@jbrowse/core 2.0.0 → 2.1.2

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 (184) hide show
  1. package/BaseFeatureWidget/BaseFeatureDetail.d.ts +9 -3
  2. package/BaseFeatureWidget/BaseFeatureDetail.js +313 -581
  3. package/BaseFeatureWidget/SequenceFeatureDetails.js +213 -478
  4. package/BaseFeatureWidget/index.js +88 -126
  5. package/BaseFeatureWidget/types.d.ts +1 -0
  6. package/BaseFeatureWidget/types.js +1 -4
  7. package/BaseFeatureWidget/util.js +40 -75
  8. package/CorePlugin.js +55 -94
  9. package/Plugin.js +9 -34
  10. package/PluginLoader.js +153 -422
  11. package/PluginManager.d.ts +28 -33
  12. package/PluginManager.js +377 -666
  13. package/ReExports/Attributes.js +3 -10
  14. package/ReExports/BaseCard.js +3 -10
  15. package/ReExports/DataGrid.js +5 -12
  16. package/ReExports/FeatureDetails.js +3 -10
  17. package/ReExports/index.js +6 -12
  18. package/ReExports/list.d.ts +5 -0
  19. package/ReExports/list.js +271 -7
  20. package/ReExports/material-ui-colors.js +15 -16
  21. package/ReExports/modules.d.ts +11 -20
  22. package/ReExports/modules.js +453 -798
  23. package/TextSearch/BaseResults.js +51 -123
  24. package/TextSearch/TextSearchManager.js +66 -144
  25. package/assemblyManager/assembly.js +280 -555
  26. package/assemblyManager/assemblyConfigSchema.js +47 -64
  27. package/assemblyManager/assemblyManager.js +126 -272
  28. package/assemblyManager/index.js +9 -22
  29. package/configuration/configurationSchema.js +167 -203
  30. package/configuration/configurationSlot.js +248 -326
  31. package/configuration/index.js +19 -35
  32. package/configuration/util.js +131 -173
  33. package/data_adapters/BaseAdapter.d.ts +2 -2
  34. package/data_adapters/BaseAdapter.js +132 -521
  35. package/data_adapters/CytobandAdapter.js +40 -126
  36. package/data_adapters/dataAdapterCache.js +77 -158
  37. package/package.json +4 -5
  38. package/pluggableElementTypes/AdapterType.js +24 -79
  39. package/pluggableElementTypes/AddTrackWorkflowType.d.ts +17 -0
  40. package/pluggableElementTypes/AddTrackWorkflowType.js +20 -0
  41. package/pluggableElementTypes/ConnectionType.js +22 -65
  42. package/pluggableElementTypes/DisplayType.js +35 -82
  43. package/pluggableElementTypes/InternetAccountType.js +23 -64
  44. package/pluggableElementTypes/PluggableElementBase.js +8 -20
  45. package/pluggableElementTypes/RpcMethodType.js +85 -427
  46. package/pluggableElementTypes/TextSearchAdapterType.js +16 -55
  47. package/pluggableElementTypes/TrackType.js +26 -70
  48. package/pluggableElementTypes/ViewType.js +21 -63
  49. package/pluggableElementTypes/WidgetType.js +21 -64
  50. package/pluggableElementTypes/index.d.ts +4 -3
  51. package/pluggableElementTypes/index.js +42 -125
  52. package/pluggableElementTypes/models/BaseConnectionModelFactory.js +28 -43
  53. package/pluggableElementTypes/models/BaseDisplayModel.js +58 -95
  54. package/pluggableElementTypes/models/BaseTrackModel.js +139 -199
  55. package/pluggableElementTypes/models/BaseViewModel.js +24 -40
  56. package/pluggableElementTypes/models/InternetAccountModel.js +116 -263
  57. package/pluggableElementTypes/models/baseConnectionConfig.js +14 -25
  58. package/pluggableElementTypes/models/baseInternetAccountConfig.js +29 -38
  59. package/pluggableElementTypes/models/baseTrackConfig.js +106 -133
  60. package/pluggableElementTypes/models/index.js +21 -70
  61. package/pluggableElementTypes/renderers/BoxRendererType.js +132 -291
  62. package/pluggableElementTypes/renderers/CircularChordRendererType.js +8 -38
  63. package/pluggableElementTypes/renderers/ComparativeServerSideRendererType.js +60 -192
  64. package/pluggableElementTypes/renderers/FeatureRendererType.d.ts +0 -2
  65. package/pluggableElementTypes/renderers/FeatureRendererType.js +89 -255
  66. package/pluggableElementTypes/renderers/RendererType.js +31 -105
  67. package/pluggableElementTypes/renderers/ServerSideRenderedContent.js +61 -72
  68. package/pluggableElementTypes/renderers/ServerSideRendererType.js +112 -265
  69. package/pluggableElementTypes/renderers/index.js +19 -62
  70. package/pluggableElementTypes/renderers/util/serializableFilterChain.js +27 -65
  71. package/rpc/BaseRpcDriver.js +169 -405
  72. package/rpc/MainThreadRpcDriver.js +27 -150
  73. package/rpc/RpcManager.js +58 -159
  74. package/rpc/WebWorkerRpcDriver.js +54 -171
  75. package/rpc/configSchema.js +25 -49
  76. package/rpc/coreRpcMethods.d.ts +1 -3
  77. package/rpc/coreRpcMethods.js +221 -959
  78. package/rpc/remoteAbortSignals.js +46 -70
  79. package/tsconfig.build.tsbuildinfo +1 -1
  80. package/ui/AboutDialog.js +106 -162
  81. package/ui/App.js +157 -242
  82. package/ui/AssemblySelector.js +59 -120
  83. package/ui/CascadingMenu.js +101 -196
  84. package/ui/ColorPicker.d.ts +16 -0
  85. package/ui/ColorPicker.js +97 -0
  86. package/ui/Drawer.js +28 -61
  87. package/ui/DrawerWidget.js +108 -202
  88. package/ui/DropDownMenu.js +60 -91
  89. package/ui/EditableTypography.js +87 -149
  90. package/ui/ErrorMessage.js +41 -56
  91. package/ui/FactoryResetDialog.js +24 -57
  92. package/ui/FatalErrorDialog.js +59 -91
  93. package/ui/FileSelector/FileSelector.js +123 -189
  94. package/ui/FileSelector/LocalFileChooser.js +44 -75
  95. package/ui/FileSelector/UrlChooser.js +17 -38
  96. package/ui/FileSelector/index.js +6 -12
  97. package/ui/Icons.js +45 -69
  98. package/ui/Logo.js +57 -110
  99. package/ui/Menu.js +232 -354
  100. package/ui/PrerenderedCanvas.js +63 -87
  101. package/ui/ResizeHandle.js +87 -116
  102. package/ui/ReturnToImportFormDialog.js +32 -63
  103. package/ui/SanitizedHTML.js +64 -47
  104. package/ui/Snackbar.js +74 -101
  105. package/ui/SnackbarModel.js +37 -51
  106. package/ui/Tooltip.js +49 -76
  107. package/ui/ViewContainer.js +113 -196
  108. package/ui/colors.d.ts +10 -0
  109. package/ui/colors.js +78 -0
  110. package/ui/index.js +51 -181
  111. package/ui/react-colorful.d.ts +17 -0
  112. package/ui/react-colorful.js +455 -0
  113. package/ui/theme.d.ts +23 -1
  114. package/ui/theme.js +199 -247
  115. package/util/Base1DUtils.d.ts +32 -0
  116. package/util/Base1DUtils.js +174 -0
  117. package/util/Base1DViewModel.d.ts +16 -30
  118. package/util/Base1DViewModel.js +116 -293
  119. package/util/QuickLRU.js +84 -332
  120. package/util/TimeTraveller.d.ts +19 -0
  121. package/util/TimeTraveller.js +86 -0
  122. package/util/aborting.js +49 -127
  123. package/util/analytics.js +91 -154
  124. package/util/blockTypes.js +106 -240
  125. package/util/calculateDynamicBlocks.js +98 -128
  126. package/util/calculateStaticBlocks.js +105 -125
  127. package/util/color/cssColorsLevel4.js +156 -160
  128. package/util/color/index.js +33 -55
  129. package/util/compositeMap.js +49 -333
  130. package/util/formatFastaStrings.js +9 -14
  131. package/util/idMaker.js +18 -31
  132. package/util/index.d.ts +18 -32
  133. package/util/index.js +747 -1226
  134. package/util/io/RemoteFileWithRangeCache.js +88 -257
  135. package/util/io/index.js +95 -169
  136. package/util/jexl.js +60 -115
  137. package/util/jexlStrings.js +24 -29
  138. package/util/layouts/BaseLayout.js +1 -4
  139. package/util/layouts/GranularRectLayout.js +388 -555
  140. package/util/layouts/MultiLayout.js +41 -109
  141. package/util/layouts/PrecomputedLayout.js +56 -112
  142. package/util/layouts/PrecomputedMultiLayout.js +22 -59
  143. package/util/layouts/SceneGraph.js +127 -197
  144. package/util/layouts/index.js +29 -66
  145. package/util/mst-reflection.js +55 -71
  146. package/util/offscreenCanvasPonyfill.js +66 -134
  147. package/util/offscreenCanvasUtils.d.ts +2 -7
  148. package/util/offscreenCanvasUtils.js +49 -146
  149. package/util/range.js +29 -40
  150. package/util/rxjs.js +20 -27
  151. package/util/simpleFeature.js +88 -152
  152. package/util/stats.js +91 -151
  153. package/util/tracks.js +130 -173
  154. package/util/types/index.js +110 -179
  155. package/util/types/mst.js +91 -146
  156. package/util/types/util.js +1 -4
  157. package/util/when.js +54 -101
  158. package/BaseFeatureWidget/SequenceFeatureDetails.test.js +0 -122
  159. package/BaseFeatureWidget/index.test.js +0 -69
  160. package/TextSearch/BaseResults.test.js +0 -42
  161. package/configuration/configurationSchema.test.js +0 -266
  162. package/configuration/configurationSlot.test.js +0 -69
  163. package/configuration/util.test.js +0 -39
  164. package/data_adapters/BaseAdapter.test.js +0 -200
  165. package/declare.d.js +0 -1
  166. package/pluggableElementTypes/RpcMethodType.test.js +0 -118
  167. package/pluggableElementTypes/renderers/declare.d.js +0 -1
  168. package/pluggableElementTypes/renderers/util/serializableFilterChain.test.js +0 -20
  169. package/rpc/BaseRpcDriver.test.js +0 -540
  170. package/rpc/declaration.d.js +0 -1
  171. package/ui/FatalErrorDialog.test.js +0 -82
  172. package/ui/SanitizedHTML.test.js +0 -36
  173. package/ui/theme.test.js +0 -92
  174. package/util/Base1DViewModel.test.js +0 -130
  175. package/util/calculateDynamicBlocks.test.js +0 -74
  176. package/util/calculateStaticBlocks.test.js +0 -297
  177. package/util/declare.d.js +0 -1
  178. package/util/formatFastaStrings.test.js +0 -40
  179. package/util/index.test.js +0 -213
  180. package/util/jexlStrings.test.js +0 -48
  181. package/util/layouts/GranularRectLayout.test.js +0 -99
  182. package/util/range.test.js +0 -64
  183. package/util/simpleFeature.test.js +0 -34
  184. package/util/stats.test.js +0 -172
@@ -1,216 +1,133 @@
1
1
  "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- var _typeof = require("@babel/runtime/helpers/typeof");
6
-
7
- Object.defineProperty(exports, "__esModule", {
8
- value: true
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
9
17
  });
10
- exports.default = void 0;
11
-
12
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
13
-
14
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
15
-
16
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
17
-
18
- var _react = _interopRequireWildcard(require("react"));
19
-
20
- var _material = require("@mui/material");
21
-
22
- var _mui = require("tss-react/mui");
23
-
24
- var _styles = require("@mui/material/styles");
25
-
26
- var _mobxReact = require("mobx-react");
27
-
28
- var _mobxStateTree = require("mobx-state-tree");
29
-
30
- var _reactUseMeasure = _interopRequireDefault(require("react-use-measure"));
31
-
32
- var _Close = _interopRequireDefault(require("@mui/icons-material/Close"));
33
-
34
- var _Menu = _interopRequireDefault(require("@mui/icons-material/Menu"));
35
-
36
- var _EditableTypography = _interopRequireDefault(require("./EditableTypography"));
37
-
38
- var _Menu2 = _interopRequireDefault(require("./Menu"));
39
-
40
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
41
-
42
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
43
-
44
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
45
-
46
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
47
-
48
- var useStyles = (0, _mui.makeStyles)()(function (theme) {
49
- return {
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
24
+ };
25
+ var __importDefault = (this && this.__importDefault) || function (mod) {
26
+ return (mod && mod.__esModule) ? mod : { "default": mod };
27
+ };
28
+ Object.defineProperty(exports, "__esModule", { value: true });
29
+ const react_1 = __importStar(require("react"));
30
+ const material_1 = require("@mui/material");
31
+ const mui_1 = require("tss-react/mui");
32
+ const styles_1 = require("@mui/material/styles");
33
+ const mobx_react_1 = require("mobx-react");
34
+ const mobx_state_tree_1 = require("mobx-state-tree");
35
+ const react_use_measure_1 = __importDefault(require("react-use-measure"));
36
+ // icons
37
+ const Close_1 = __importDefault(require("@mui/icons-material/Close"));
38
+ const Menu_1 = __importDefault(require("@mui/icons-material/Menu"));
39
+ const EditableTypography_1 = __importDefault(require("./EditableTypography"));
40
+ const Menu_2 = __importDefault(require("./Menu"));
41
+ const useStyles = (0, mui_1.makeStyles)()(theme => ({
50
42
  viewContainer: {
51
- overflow: 'hidden',
52
- background: theme.palette.secondary.main,
53
- margin: theme.spacing(0.5)
43
+ overflow: 'hidden',
44
+ background: theme.palette.secondary.main,
45
+ margin: theme.spacing(0.5),
54
46
  },
55
47
  icon: {
56
- color: theme.palette.secondary.contrastText
48
+ color: theme.palette.secondary.contrastText,
57
49
  },
58
50
  grow: {
59
- flexGrow: 1
51
+ flexGrow: 1,
60
52
  },
61
53
  iconRoot: {
62
- '&:hover': {
63
- backgroundColor: (0, _styles.alpha)(theme.palette.secondary.contrastText, theme.palette.action.hoverOpacity),
64
- '@media (hover: none)': {
65
- backgroundColor: 'transparent'
66
- }
67
- }
54
+ '&:hover': {
55
+ backgroundColor: (0, styles_1.alpha)(theme.palette.secondary.contrastText, theme.palette.action.hoverOpacity),
56
+ '@media (hover: none)': {
57
+ backgroundColor: 'transparent',
58
+ },
59
+ },
68
60
  },
69
61
  input: {
70
- paddingBottom: 0,
71
- paddingTop: 2
62
+ paddingBottom: 0,
63
+ paddingTop: 2,
72
64
  },
73
65
  inputBase: {
74
- color: theme.palette.secondary.contrastText
66
+ color: theme.palette.secondary.contrastText,
75
67
  },
76
68
  inputRoot: {
77
- '&:hover': {
78
- backgroundColor: theme.palette.secondary.light
79
- }
69
+ '&:hover': {
70
+ backgroundColor: theme.palette.secondary.light,
71
+ },
80
72
  },
81
73
  inputFocused: {
82
- borderColor: theme.palette.primary.main,
83
- backgroundColor: theme.palette.secondary.light
84
- }
85
- };
86
- });
87
- var ViewMenu = (0, _mobxReact.observer)(function (_ref) {
88
- var model = _ref.model,
89
- IconButtonProps = _ref.IconButtonProps,
90
- IconProps = _ref.IconProps;
91
-
92
- var _useState = (0, _react.useState)(),
93
- _useState2 = (0, _slicedToArray2.default)(_useState, 2),
94
- anchorEl = _useState2[0],
95
- setAnchorEl = _useState2[1];
96
-
97
- var menuItems = model.menuItems; // <=1.3.3 didn't use a function
98
-
99
- var items = typeof menuItems === 'function' ? menuItems() : menuItems;
100
- return items !== null && items !== void 0 && items.length ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_material.IconButton, (0, _extends2.default)({}, IconButtonProps, {
101
- style: {
102
- padding: 3
74
+ borderColor: theme.palette.primary.main,
75
+ backgroundColor: theme.palette.secondary.light,
103
76
  },
104
- onClick: function onClick(event) {
105
- return setAnchorEl(event.currentTarget);
106
- },
107
- "data-testid": "view_menu_icon",
108
- size: "small"
109
- }), /*#__PURE__*/_react.default.createElement(_Menu.default, (0, _extends2.default)({}, IconProps, {
110
- fontSize: "small"
111
- }))), /*#__PURE__*/_react.default.createElement(_Menu2.default, {
112
- anchorEl: anchorEl,
113
- open: Boolean(anchorEl),
114
- onMenuItemClick: function onMenuItemClick(_event, callback) {
115
- callback();
116
- setAnchorEl(undefined);
117
- },
118
- onClose: function onClose() {
119
- return setAnchorEl(undefined);
120
- },
121
- menuItems: model.menuItems()
122
- })) : null;
77
+ }));
78
+ const ViewMenu = (0, mobx_react_1.observer)(({ model, IconButtonProps, IconProps, }) => {
79
+ const [anchorEl, setAnchorEl] = (0, react_1.useState)();
80
+ const { menuItems } = model;
81
+ // <=1.3.3 didn't use a function
82
+ const items = typeof menuItems === 'function' ? menuItems() : menuItems;
83
+ return (items === null || items === void 0 ? void 0 : items.length) ? (react_1.default.createElement(react_1.default.Fragment, null,
84
+ react_1.default.createElement(material_1.IconButton, { ...IconButtonProps, style: { padding: 3 }, onClick: event => setAnchorEl(event.currentTarget), "data-testid": "view_menu_icon", size: "small" },
85
+ react_1.default.createElement(Menu_1.default, { ...IconProps, fontSize: "small" })),
86
+ react_1.default.createElement(Menu_2.default, { anchorEl: anchorEl, open: Boolean(anchorEl), onMenuItemClick: (_event, callback) => {
87
+ callback();
88
+ setAnchorEl(undefined);
89
+ }, onClose: () => setAnchorEl(undefined), menuItems: model.menuItems() }))) : null;
123
90
  });
124
- var ViewContainer = (0, _mobxReact.observer)(function (_ref2) {
125
- var _view$assemblyNames;
126
-
127
- var view = _ref2.view,
128
- onClose = _ref2.onClose,
129
- style = _ref2.style,
130
- children = _ref2.children;
131
-
132
- var _useStyles = useStyles(),
133
- classes = _useStyles.classes;
134
-
135
- var theme = (0, _material.useTheme)();
136
- var padWidth = theme.spacing(1);
137
-
138
- var _useMeasure = (0, _reactUseMeasure.default)(),
139
- _useMeasure2 = (0, _slicedToArray2.default)(_useMeasure, 2),
140
- ref = _useMeasure2[0],
141
- width = _useMeasure2[1].width;
142
-
143
- (0, _react.useEffect)(function () {
144
- if (width && (0, _mobxStateTree.isAlive)(view)) {
145
- view.setWidth(width - parseInt(padWidth, 10) * 2);
146
- }
147
- }, [padWidth, view, width]);
148
- var scrollRef = (0, _react.useRef)(null); // scroll the view into view when first mounted
149
- // note that this effect will run only once, because of
150
- // the empty array second param
151
-
152
- (0, _react.useEffect)(function () {
153
- var _scrollRef$current, _scrollRef$current$sc;
154
-
155
- (_scrollRef$current = scrollRef.current) === null || _scrollRef$current === void 0 ? void 0 : (_scrollRef$current$sc = _scrollRef$current.scrollIntoView) === null || _scrollRef$current$sc === void 0 ? void 0 : _scrollRef$current$sc.call(_scrollRef$current, {
156
- block: 'center'
157
- });
158
- }, []);
159
- return /*#__PURE__*/_react.default.createElement(_material.Paper, {
160
- ref: ref,
161
- elevation: 12,
162
- className: classes.viewContainer,
163
- style: _objectSpread(_objectSpread({}, style), {}, {
164
- padding: "0px ".concat(padWidth, " ").concat(padWidth)
165
- })
166
- }, /*#__PURE__*/_react.default.createElement("div", {
167
- ref: scrollRef,
168
- style: {
169
- display: 'flex'
170
- }
171
- }, /*#__PURE__*/_react.default.createElement(ViewMenu, {
172
- model: view,
173
- IconButtonProps: {
174
- classes: {
175
- root: classes.iconRoot
176
- },
177
- edge: 'start'
178
- },
179
- IconProps: {
180
- className: classes.icon
181
- }
182
- }), /*#__PURE__*/_react.default.createElement("div", {
183
- className: classes.grow
184
- }), /*#__PURE__*/_react.default.createElement(_material.Tooltip, {
185
- title: "Rename view",
186
- arrow: true
187
- }, /*#__PURE__*/_react.default.createElement(_EditableTypography.default, {
188
- value: view.displayName || ( // @ts-ignore
189
- (_view$assemblyNames = view.assemblyNames) === null || _view$assemblyNames === void 0 ? void 0 : _view$assemblyNames.join(',')) || 'Untitled view',
190
- setValue: function setValue(val) {
191
- return view.setDisplayName(val);
192
- },
193
- variant: "body2",
194
- classes: {
195
- input: classes.input,
196
- inputBase: classes.inputBase,
197
- inputRoot: classes.inputRoot,
198
- inputFocused: classes.inputFocused
199
- }
200
- })), /*#__PURE__*/_react.default.createElement("div", {
201
- className: classes.grow
202
- }), /*#__PURE__*/_react.default.createElement(_material.IconButton, {
203
- "data-testid": "close_view",
204
- classes: {
205
- root: classes.iconRoot
206
- },
207
- edge: "end",
208
- size: "small",
209
- onClick: onClose
210
- }, /*#__PURE__*/_react.default.createElement(_Close.default, {
211
- className: classes.icon,
212
- fontSize: "small"
213
- }))), /*#__PURE__*/_react.default.createElement(_material.Paper, null, children));
91
+ const ViewContainer = (0, mobx_react_1.observer)(({ view, onClose, style, children, }) => {
92
+ var _a;
93
+ const { classes } = useStyles();
94
+ const theme = (0, material_1.useTheme)();
95
+ const padWidth = theme.spacing(1);
96
+ const [ref, { width }] = (0, react_use_measure_1.default)();
97
+ (0, react_1.useEffect)(() => {
98
+ if (width && (0, mobx_state_tree_1.isAlive)(view)) {
99
+ view.setWidth(width - parseInt(padWidth, 10) * 2);
100
+ }
101
+ }, [padWidth, view, width]);
102
+ const scrollRef = (0, react_1.useRef)(null);
103
+ // scroll the view into view when first mounted
104
+ // note that this effect will run only once, because of
105
+ // the empty array second param
106
+ (0, react_1.useEffect)(() => {
107
+ var _a, _b;
108
+ (_b = (_a = scrollRef.current) === null || _a === void 0 ? void 0 : _a.scrollIntoView) === null || _b === void 0 ? void 0 : _b.call(_a, { block: 'center' });
109
+ }, []);
110
+ return (react_1.default.createElement(material_1.Paper, { ref: ref, elevation: 12, className: classes.viewContainer, style: { ...style, padding: `0px ${padWidth} ${padWidth}` } },
111
+ react_1.default.createElement("div", { ref: scrollRef, style: { display: 'flex' } },
112
+ react_1.default.createElement(ViewMenu, { model: view, IconButtonProps: {
113
+ classes: { root: classes.iconRoot },
114
+ edge: 'start',
115
+ }, IconProps: { className: classes.icon } }),
116
+ react_1.default.createElement("div", { className: classes.grow }),
117
+ react_1.default.createElement(material_1.Tooltip, { title: "Rename view", arrow: true },
118
+ react_1.default.createElement(EditableTypography_1.default, { value: view.displayName ||
119
+ (
120
+ // @ts-ignore
121
+ (_a = view.assemblyNames) === null || _a === void 0 ? void 0 : _a.join(',')) ||
122
+ 'Untitled view', setValue: val => view.setDisplayName(val), variant: "body2", classes: {
123
+ input: classes.input,
124
+ inputBase: classes.inputBase,
125
+ inputRoot: classes.inputRoot,
126
+ inputFocused: classes.inputFocused,
127
+ } })),
128
+ react_1.default.createElement("div", { className: classes.grow }),
129
+ react_1.default.createElement(material_1.IconButton, { "data-testid": "close_view", classes: { root: classes.iconRoot }, edge: "end", size: "small", onClick: onClose },
130
+ react_1.default.createElement(Close_1.default, { className: classes.icon, fontSize: "small" }))),
131
+ react_1.default.createElement(material_1.Paper, null, children)));
214
132
  });
215
- var _default = ViewContainer;
216
- exports.default = _default;
133
+ exports.default = ViewContainer;
package/ui/colors.d.ts ADDED
@@ -0,0 +1,10 @@
1
+ declare const category10: string[];
2
+ declare const dark2: string[];
3
+ declare const set1: string[];
4
+ declare const set2: string[];
5
+ declare const tableau10: string[];
6
+ declare const ggplot2Colors6: string[];
7
+ declare const ggplot2Colors5: string[];
8
+ declare const ggplot2Colors4: string[];
9
+ declare const ggplot2Colors3: string[];
10
+ export { set1, set2, tableau10, dark2, category10, ggplot2Colors6, ggplot2Colors5, ggplot2Colors4, ggplot2Colors3, };
package/ui/colors.js ADDED
@@ -0,0 +1,78 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.ggplot2Colors3 = exports.ggplot2Colors4 = exports.ggplot2Colors5 = exports.ggplot2Colors6 = exports.category10 = exports.dark2 = exports.tableau10 = exports.set2 = exports.set1 = void 0;
4
+ const category10 = [
5
+ '#1f77b4',
6
+ '#ff7f0e',
7
+ '#2ca02c',
8
+ '#d62728',
9
+ '#9467bd',
10
+ '#8c564b',
11
+ '#e377c2',
12
+ '#7f7f7f',
13
+ '#bcbd22',
14
+ '#17becf',
15
+ ];
16
+ exports.category10 = category10;
17
+ const dark2 = [
18
+ '#1b9e77',
19
+ '#d95f02',
20
+ '#7570b3',
21
+ '#e7298a',
22
+ '#66a61e',
23
+ '#e6ab02',
24
+ '#a6761d',
25
+ '#666666',
26
+ ];
27
+ exports.dark2 = dark2;
28
+ const set1 = [
29
+ '#e41a1c',
30
+ '#377eb8',
31
+ '#4daf4a',
32
+ '#984ea3',
33
+ '#ff7f00',
34
+ '#ffff33',
35
+ '#a65628',
36
+ '#f781bf',
37
+ '#999999',
38
+ ];
39
+ exports.set1 = set1;
40
+ const set2 = [
41
+ '#66c2a5',
42
+ '#fc8d62',
43
+ '#8da0cb',
44
+ '#e78ac3',
45
+ '#a6d854',
46
+ '#ffd92f',
47
+ '#e5c494',
48
+ '#b3b3b3',
49
+ ];
50
+ exports.set2 = set2;
51
+ const tableau10 = [
52
+ '#4e79a7',
53
+ '#f28e2c',
54
+ '#e15759',
55
+ '#76b7b2',
56
+ '#59a14f',
57
+ '#edc949',
58
+ '#af7aa1',
59
+ '#ff9da7',
60
+ '#9c755f',
61
+ '#bab0ab',
62
+ ];
63
+ exports.tableau10 = tableau10;
64
+ const ggplot2Colors6 = [
65
+ '#F8766D',
66
+ '#B79F00',
67
+ '#00BA38',
68
+ '#00BFC4',
69
+ '#619CFF',
70
+ '#F564E3',
71
+ ];
72
+ exports.ggplot2Colors6 = ggplot2Colors6;
73
+ const ggplot2Colors5 = ['#F8766D', '#A3A500', '#00BF7D', '#00B0F6', '#E76BF3'];
74
+ exports.ggplot2Colors5 = ggplot2Colors5;
75
+ const ggplot2Colors4 = ['#F8766D', '#7CAE00', '#00BFC4', '#C77CFF'];
76
+ exports.ggplot2Colors4 = ggplot2Colors4;
77
+ const ggplot2Colors3 = ['#F8766D', '#00BA38', '#619CFF'];
78
+ exports.ggplot2Colors3 = ggplot2Colors3;
package/ui/index.js CHANGED
@@ -1,183 +1,53 @@
1
1
  "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- var _typeof = require("@babel/runtime/helpers/typeof");
6
-
7
- Object.defineProperty(exports, "__esModule", {
8
- value: true
9
- });
10
- var _exportNames = {
11
- LogoFull: true,
12
- Logomark: true,
13
- App: true,
14
- ReturnToImportFormDialog: true,
15
- ErrorMessage: true,
16
- AssemblySelector: true,
17
- FileSelector: true,
18
- PrerenderedCanvas: true,
19
- ResizeHandle: true,
20
- EditableTypography: true,
21
- FactoryResetDialog: true,
22
- Tooltip: true,
23
- FatalErrorDialog: true,
24
- Menu: true,
25
- CascadingMenu: true,
26
- SanitizedHTML: true
27
- };
28
- Object.defineProperty(exports, "App", {
29
- enumerable: true,
30
- get: function get() {
31
- return _App.default;
32
- }
33
- });
34
- Object.defineProperty(exports, "AssemblySelector", {
35
- enumerable: true,
36
- get: function get() {
37
- return _AssemblySelector.default;
38
- }
39
- });
40
- Object.defineProperty(exports, "CascadingMenu", {
41
- enumerable: true,
42
- get: function get() {
43
- return _CascadingMenu.default;
44
- }
45
- });
46
- Object.defineProperty(exports, "EditableTypography", {
47
- enumerable: true,
48
- get: function get() {
49
- return _EditableTypography.default;
50
- }
51
- });
52
- Object.defineProperty(exports, "ErrorMessage", {
53
- enumerable: true,
54
- get: function get() {
55
- return _ErrorMessage.default;
56
- }
57
- });
58
- Object.defineProperty(exports, "FactoryResetDialog", {
59
- enumerable: true,
60
- get: function get() {
61
- return _FactoryResetDialog.default;
62
- }
63
- });
64
- Object.defineProperty(exports, "FatalErrorDialog", {
65
- enumerable: true,
66
- get: function get() {
67
- return _FatalErrorDialog.default;
68
- }
69
- });
70
- Object.defineProperty(exports, "FileSelector", {
71
- enumerable: true,
72
- get: function get() {
73
- return _FileSelector.default;
74
- }
75
- });
76
- Object.defineProperty(exports, "LogoFull", {
77
- enumerable: true,
78
- get: function get() {
79
- return _Logo.LogoFull;
80
- }
81
- });
82
- Object.defineProperty(exports, "Logomark", {
83
- enumerable: true,
84
- get: function get() {
85
- return _Logo.Logomark;
86
- }
87
- });
88
- Object.defineProperty(exports, "Menu", {
89
- enumerable: true,
90
- get: function get() {
91
- return _Menu.default;
92
- }
93
- });
94
- Object.defineProperty(exports, "PrerenderedCanvas", {
95
- enumerable: true,
96
- get: function get() {
97
- return _PrerenderedCanvas.default;
98
- }
99
- });
100
- Object.defineProperty(exports, "ResizeHandle", {
101
- enumerable: true,
102
- get: function get() {
103
- return _ResizeHandle.default;
104
- }
105
- });
106
- Object.defineProperty(exports, "ReturnToImportFormDialog", {
107
- enumerable: true,
108
- get: function get() {
109
- return _ReturnToImportFormDialog.default;
110
- }
111
- });
112
- Object.defineProperty(exports, "SanitizedHTML", {
113
- enumerable: true,
114
- get: function get() {
115
- return _SanitizedHTML.default;
116
- }
117
- });
118
- Object.defineProperty(exports, "Tooltip", {
119
- enumerable: true,
120
- get: function get() {
121
- return _Tooltip.default;
122
- }
123
- });
124
-
125
- var _theme = require("./theme");
126
-
127
- Object.keys(_theme).forEach(function (key) {
128
- if (key === "default" || key === "__esModule") return;
129
- if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
130
- if (key in exports && exports[key] === _theme[key]) return;
131
- Object.defineProperty(exports, key, {
132
- enumerable: true,
133
- get: function get() {
134
- return _theme[key];
135
- }
136
- });
137
- });
138
-
139
- var _Logo = require("./Logo");
140
-
141
- var _App = _interopRequireDefault(require("./App"));
142
-
143
- var _ReturnToImportFormDialog = _interopRequireDefault(require("./ReturnToImportFormDialog"));
144
-
145
- var _ErrorMessage = _interopRequireDefault(require("./ErrorMessage"));
146
-
147
- var _AssemblySelector = _interopRequireDefault(require("./AssemblySelector"));
148
-
149
- var _FileSelector = _interopRequireDefault(require("./FileSelector"));
150
-
151
- var _PrerenderedCanvas = _interopRequireDefault(require("./PrerenderedCanvas"));
152
-
153
- var _ResizeHandle = _interopRequireDefault(require("./ResizeHandle"));
154
-
155
- var _EditableTypography = _interopRequireDefault(require("./EditableTypography"));
156
-
157
- var _FactoryResetDialog = _interopRequireDefault(require("./FactoryResetDialog"));
158
-
159
- var _Tooltip = _interopRequireDefault(require("./Tooltip"));
160
-
161
- var _FatalErrorDialog = _interopRequireDefault(require("./FatalErrorDialog"));
162
-
163
- var _Menu = _interopRequireWildcard(require("./Menu"));
164
-
165
- Object.keys(_Menu).forEach(function (key) {
166
- if (key === "default" || key === "__esModule") return;
167
- if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
168
- if (key in exports && exports[key] === _Menu[key]) return;
169
- Object.defineProperty(exports, key, {
170
- enumerable: true,
171
- get: function get() {
172
- return _Menu[key];
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
173
7
  }
174
- });
175
- });
176
-
177
- var _CascadingMenu = _interopRequireDefault(require("./CascadingMenu"));
178
-
179
- var _SanitizedHTML = _interopRequireDefault(require("./SanitizedHTML"));
180
-
181
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
182
-
183
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
+ };
16
+ var __importDefault = (this && this.__importDefault) || function (mod) {
17
+ return (mod && mod.__esModule) ? mod : { "default": mod };
18
+ };
19
+ Object.defineProperty(exports, "__esModule", { value: true });
20
+ exports.SanitizedHTML = exports.CascadingMenu = exports.Menu = exports.FatalErrorDialog = exports.Tooltip = exports.FactoryResetDialog = exports.EditableTypography = exports.ResizeHandle = exports.PrerenderedCanvas = exports.FileSelector = exports.AssemblySelector = exports.ErrorMessage = exports.ReturnToImportFormDialog = exports.App = exports.Logomark = exports.LogoFull = void 0;
21
+ __exportStar(require("./theme"), exports);
22
+ var Logo_1 = require("./Logo");
23
+ Object.defineProperty(exports, "LogoFull", { enumerable: true, get: function () { return Logo_1.LogoFull; } });
24
+ Object.defineProperty(exports, "Logomark", { enumerable: true, get: function () { return Logo_1.Logomark; } });
25
+ var App_1 = require("./App");
26
+ Object.defineProperty(exports, "App", { enumerable: true, get: function () { return __importDefault(App_1).default; } });
27
+ var ReturnToImportFormDialog_1 = require("./ReturnToImportFormDialog");
28
+ Object.defineProperty(exports, "ReturnToImportFormDialog", { enumerable: true, get: function () { return __importDefault(ReturnToImportFormDialog_1).default; } });
29
+ var ErrorMessage_1 = require("./ErrorMessage");
30
+ Object.defineProperty(exports, "ErrorMessage", { enumerable: true, get: function () { return __importDefault(ErrorMessage_1).default; } });
31
+ var AssemblySelector_1 = require("./AssemblySelector");
32
+ Object.defineProperty(exports, "AssemblySelector", { enumerable: true, get: function () { return __importDefault(AssemblySelector_1).default; } });
33
+ var FileSelector_1 = require("./FileSelector");
34
+ Object.defineProperty(exports, "FileSelector", { enumerable: true, get: function () { return __importDefault(FileSelector_1).default; } });
35
+ var PrerenderedCanvas_1 = require("./PrerenderedCanvas");
36
+ Object.defineProperty(exports, "PrerenderedCanvas", { enumerable: true, get: function () { return __importDefault(PrerenderedCanvas_1).default; } });
37
+ var ResizeHandle_1 = require("./ResizeHandle");
38
+ Object.defineProperty(exports, "ResizeHandle", { enumerable: true, get: function () { return __importDefault(ResizeHandle_1).default; } });
39
+ var EditableTypography_1 = require("./EditableTypography");
40
+ Object.defineProperty(exports, "EditableTypography", { enumerable: true, get: function () { return __importDefault(EditableTypography_1).default; } });
41
+ var FactoryResetDialog_1 = require("./FactoryResetDialog");
42
+ Object.defineProperty(exports, "FactoryResetDialog", { enumerable: true, get: function () { return __importDefault(FactoryResetDialog_1).default; } });
43
+ var Tooltip_1 = require("./Tooltip");
44
+ Object.defineProperty(exports, "Tooltip", { enumerable: true, get: function () { return __importDefault(Tooltip_1).default; } });
45
+ var FatalErrorDialog_1 = require("./FatalErrorDialog");
46
+ Object.defineProperty(exports, "FatalErrorDialog", { enumerable: true, get: function () { return __importDefault(FatalErrorDialog_1).default; } });
47
+ var Menu_1 = require("./Menu");
48
+ Object.defineProperty(exports, "Menu", { enumerable: true, get: function () { return __importDefault(Menu_1).default; } });
49
+ var CascadingMenu_1 = require("./CascadingMenu");
50
+ Object.defineProperty(exports, "CascadingMenu", { enumerable: true, get: function () { return __importDefault(CascadingMenu_1).default; } });
51
+ var SanitizedHTML_1 = require("./SanitizedHTML");
52
+ Object.defineProperty(exports, "SanitizedHTML", { enumerable: true, get: function () { return __importDefault(SanitizedHTML_1).default; } });
53
+ __exportStar(require("./Menu"), exports);