@jbrowse/plugin-config 1.7.11 → 2.0.0

package/dist/index.js

@@ -1,152 +1,137 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ConfigurationEditor = void 0;
-Object.defineProperty(exports, "JsonEditor", {
-  enumerable: true,
-  get: function get() {
-    return _JsonEditor.default;
-  }
-});
-exports.default = void 0;
-
-var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
-
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _react = require("react");
-
-var _AdapterType = _interopRequireDefault(require("@jbrowse/core/pluggableElementTypes/AdapterType"));
-
-var _WidgetType = _interopRequireDefault(require("@jbrowse/core/pluggableElementTypes/WidgetType"));
-
-var _Plugin2 = _interopRequireDefault(require("@jbrowse/core/Plugin"));
-
-var _ConfigurationEditorWidget = require("./ConfigurationEditorWidget");
-
-var _FromConfigAdapter = require("./FromConfigAdapter");
-
-var _RefNameAliasAdapter = require("./RefNameAliasAdapter");
-
-var _JsonEditor = _interopRequireDefault(require("./ConfigurationEditorWidget/components/JsonEditor"));
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
-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); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || (0, _typeof2.default)(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; }
-
-var ConfigurationEditorComponent = /*#__PURE__*/(0, _react.lazy)(function () {
-  return Promise.resolve().then(function () {
-    return _interopRequireWildcard(require('./ConfigurationEditorWidget/components/ConfigurationEditor'));
-  });
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
 });
-exports.ConfigurationEditor = ConfigurationEditorComponent;
-
-var _default = /*#__PURE__*/function (_Plugin) {
-  (0, _inherits2.default)(_default, _Plugin);
-
-  var _super = _createSuper(_default);
-
-  function _default() {
-    var _this;
-
-    (0, _classCallCheck2.default)(this, _default);
-
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ConfigurationEditor = exports.JsonEditor = void 0;
+var react_1 = require("react");
+var AdapterType_1 = __importDefault(require("@jbrowse/core/pluggableElementTypes/AdapterType"));
+var WidgetType_1 = __importDefault(require("@jbrowse/core/pluggableElementTypes/WidgetType"));
+var Plugin_1 = __importDefault(require("@jbrowse/core/Plugin"));
+var ConfigurationEditorWidget_1 = require("./ConfigurationEditorWidget");
+var FromConfigAdapter_1 = require("./FromConfigAdapter");
+var RefNameAliasAdapter_1 = require("./RefNameAliasAdapter");
+var LazyConfigurationEditorComponent = (0, react_1.lazy)(function () { return Promise.resolve().then(function () { return __importStar(require('./ConfigurationEditorWidget/components/ConfigurationEditor')); }); });
+exports.ConfigurationEditor = LazyConfigurationEditorComponent;
+var default_1 = /** @class */ (function (_super) {
+    __extends(default_1, _super);
+    function default_1() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.name = 'ConfigurationPlugin';
+        return _this;
     }
-
-    _this = _super.call.apply(_super, [this].concat(args));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "name", 'ConfigurationPlugin');
-    return _this;
-  }
-
-  (0, _createClass2.default)(_default, [{
-    key: "install",
-    value: function install(pluginManager) {
-      pluginManager.addAdapterType(function () {
-        return new _AdapterType.default({
-          name: 'FromConfigAdapter',
-          configSchema: _FromConfigAdapter.configSchema,
-          AdapterClass: _FromConfigAdapter.AdapterClass,
-          adapterMetadata: {
-            category: null,
-            hiddenFromGUI: true,
-            displayName: null,
-            description: null
-          }
+    default_1.prototype.install = function (pluginManager) {
+        pluginManager.addAdapterType(function () {
+            return new AdapterType_1.default({
+                name: 'FromConfigAdapter',
+                configSchema: FromConfigAdapter_1.configSchema,
+                getAdapterClass: function () {
+                    return Promise.resolve().then(function () { return __importStar(require('./FromConfigAdapter/FromConfigAdapter')); }).then(function (r) { return r.default; });
+                },
+                adapterMetadata: {
+                    category: null,
+                    hiddenFromGUI: true,
+                    displayName: null,
+                    description: null,
+                },
+            });
         });
-      });
-      pluginManager.addAdapterType(function () {
-        return new _AdapterType.default({
-          name: 'FromConfigRegionsAdapter',
-          configSchema: _FromConfigAdapter.regionsConfigSchema,
-          AdapterClass: _FromConfigAdapter.RegionsAdapterClass,
-          adapterMetadata: {
-            category: null,
-            hiddenFromGUI: true,
-            displayName: null,
-            description: null
-          }
+        pluginManager.addAdapterType(function () {
+            return new AdapterType_1.default({
+                name: 'FromConfigRegionsAdapter',
+                configSchema: FromConfigAdapter_1.regionsConfigSchema,
+                getAdapterClass: function () {
+                    return Promise.resolve().then(function () { return __importStar(require('./FromConfigAdapter/FromConfigRegionsAdapter')); }).then(function (r) { return r.default; });
+                },
+                adapterMetadata: {
+                    category: null,
+                    hiddenFromGUI: true,
+                    displayName: null,
+                    description: null,
+                },
+            });
         });
-      });
-      pluginManager.addAdapterType(function () {
-        return new _AdapterType.default({
-          name: 'FromConfigSequenceAdapter',
-          configSchema: _FromConfigAdapter.sequenceConfigSchema,
-          AdapterClass: _FromConfigAdapter.SequenceAdapterClass,
-          adapterMetadata: {
-            category: null,
-            hiddenFromGUI: true,
-            displayName: null,
-            description: null
-          }
+        pluginManager.addAdapterType(function () {
+            return new AdapterType_1.default({
+                name: 'FromConfigSequenceAdapter',
+                configSchema: FromConfigAdapter_1.sequenceConfigSchema,
+                getAdapterClass: function () {
+                    return Promise.resolve().then(function () { return __importStar(require('./FromConfigAdapter/FromConfigSequenceAdapter')); }).then(function (r) { return r.default; });
+                },
+                adapterMetadata: {
+                    category: null,
+                    hiddenFromGUI: true,
+                    displayName: null,
+                    description: null,
+                },
+            });
         });
-      });
-      pluginManager.addAdapterType(function () {
-        return new _AdapterType.default({
-          name: 'RefNameAliasAdapter',
-          configSchema: _RefNameAliasAdapter.configSchema,
-          AdapterClass: _RefNameAliasAdapter.AdapterClass,
-          adapterMetadata: {
-            category: null,
-            hiddenFromGUI: true,
-            displayName: null,
-            description: null
-          }
+        pluginManager.addAdapterType(function () {
+            return new AdapterType_1.default({
+                name: 'RefNameAliasAdapter',
+                configSchema: RefNameAliasAdapter_1.configSchema,
+                getAdapterClass: function () {
+                    return Promise.resolve().then(function () { return __importStar(require('./RefNameAliasAdapter/RefNameAliasAdapter')); }).then(function (r) { return r.default; });
+                },
+                adapterMetadata: {
+                    category: null,
+                    hiddenFromGUI: true,
+                    displayName: null,
+                    description: null,
+                },
+            });
         });
-      });
-      pluginManager.addWidgetType(function () {
-        return new _WidgetType.default({
-          name: 'ConfigurationEditorWidget',
-          HeadingComponent: _ConfigurationEditorWidget.HeadingComponent,
-          configSchema: _ConfigurationEditorWidget.configSchema,
-          stateModel: (0, _ConfigurationEditorWidget.stateModelFactory)(pluginManager),
-          ReactComponent: ConfigurationEditorComponent
+        pluginManager.addWidgetType(function () {
+            return new WidgetType_1.default({
+                name: 'ConfigurationEditorWidget',
+                HeadingComponent: ConfigurationEditorWidget_1.HeadingComponent,
+                configSchema: ConfigurationEditorWidget_1.configSchema,
+                stateModel: (0, ConfigurationEditorWidget_1.stateModelFactory)(pluginManager),
+                ReactComponent: LazyConfigurationEditorComponent,
+            });
         });
-      });
-    }
-  }]);
-  return _default;
-}(_Plugin2.default);
-
-exports.default = _default;
+    };
+    return default_1;
+}(Plugin_1.default));
+exports.default = default_1;
+var JsonEditor_1 = require("./ConfigurationEditorWidget/components/JsonEditor");
+Object.defineProperty(exports, "JsonEditor", { enumerable: true, get: function () { return __importDefault(JsonEditor_1).default; } });
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/esm/ConfigurationEditorWidget/components/CallbackEditor.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+declare function CallbackEditor({ slot, }: {
+    slot: {
+        set: (arg: string) => void;
+        description: string;
+        name: string;
+        value: string;
+        contextVariable: string;
+    };
+}): JSX.Element;
+declare const _default: typeof CallbackEditor;
+export default _default;

package/esm/ConfigurationEditorWidget/components/CallbackEditor.js

@@ -0,0 +1,71 @@
+import React, { useEffect, useState } from 'react';
+import { useDebounce } from '@jbrowse/core/util';
+import { stringToJexlExpression } from '@jbrowse/core/util/jexlStrings';
+import { FormControl, FormHelperText, InputLabel, Tooltip, IconButton, TextField, } from '@mui/material';
+import { makeStyles } from 'tss-react/mui';
+import HelpIcon from '@mui/icons-material/Help';
+import { getEnv } from 'mobx-state-tree';
+import { observer } from 'mobx-react';
+// Optimize by using system default fonts:
+// https://css-tricks.com/snippets/css/font-stacks/
+const fontFamily = 'Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace';
+const useStyles = makeStyles()(theme => ({
+    callbackEditor: {
+        marginTop: '16px',
+        borderBottom: `1px solid ${theme.palette.divider}`,
+        fontFamily,
+    },
+    textAreaFont: {
+        fontFamily,
+    },
+}));
+function CallbackEditor({ slot, }) {
+    const { classes } = useStyles();
+    const [code, setCode] = useState(slot.value);
+    const [error, setCodeError] = useState();
+    const debouncedCode = useDebounce(code, 400);
+    useEffect(() => {
+        var _a;
+        try {
+            const jexlDebouncedCode = debouncedCode.startsWith('jexl:')
+                ? debouncedCode
+                : `jexl:${debouncedCode}`;
+            if (jexlDebouncedCode === 'jexl:') {
+                throw new Error('Empty jexl expression is not valid');
+            }
+            stringToJexlExpression(jexlDebouncedCode, (_a = getEnv(slot).pluginManager) === null || _a === void 0 ? void 0 : _a.jexl);
+            slot.set(jexlDebouncedCode);
+            setCodeError(undefined);
+        }
+        catch (e) {
+            console.error({ e });
+            setCodeError(e);
+        }
+    }, [debouncedCode, slot]);
+    // if default value is a callback, will have to remove jexl:
+    // do this last
+    return (React.createElement(React.Fragment, null,
+        React.createElement(FormControl, null,
+            React.createElement(InputLabel, { shrink: true, htmlFor: "callback-editor" }, slot.name),
+            React.createElement(TextField, { multiline: true, className: classes.callbackEditor, value: code.startsWith('jexl:') ? code.split('jexl:')[1] : code, onChange: event => setCode(event.target.value), style: { background: error ? '#fdd' : undefined }, InputProps: {
+                    classes: {
+                        input: classes.textAreaFont,
+                    },
+                } }),
+            error ? (React.createElement(FormHelperText, { style: { color: '#f00' } }, `${error}`)) : null,
+            React.createElement(FormHelperText, null, slot.description)),
+        React.createElement(Tooltip, { title: React.createElement("div", null,
+                "Callbacks are written in Jexl format. Click to learn more.",
+                React.createElement("br", null),
+                " Names of available context items: ",
+                slot.contextVariable), arrow: true },
+            React.createElement(IconButton, { color: "primary", onClick: () => {
+                    const newWindow = window.open('https://github.com/TomFrost/Jexl', '_blank', 'noopener,noreferrer');
+                    if (newWindow) {
+                        newWindow.opener = null;
+                    }
+                } },
+                React.createElement(HelpIcon, null)))));
+}
+export default observer(CallbackEditor);
+//# sourceMappingURL=CallbackEditor.js.map

package/esm/ConfigurationEditorWidget/components/CallbackEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CallbackEditor.js","sourceRoot":"","sources":["../../../src/ConfigurationEditorWidget/components/CallbackEditor.tsx"],"names":[],"mappings":"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"}

package/esm/ConfigurationEditorWidget/components/CodeEditor.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export default function CodeEditor({ contents, setContents, }: {
+    contents: string;
+    setContents: (arg: string) => void;
+}): JSX.Element;

package/esm/ConfigurationEditorWidget/components/CodeEditor.js

@@ -0,0 +1,42 @@
+import React, { useEffect, useState } from 'react';
+import { TextField } from '@mui/material';
+import { makeStyles } from 'tss-react/mui';
+// fontSize and fontFamily have to match between Editor and SyntaxHighlighter
+const fontSize = '12px';
+// Optimize by using system default fonts: https://css-tricks.com/snippets/css/font-stacks/
+const fontFamily = 'Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace';
+const useStyles = makeStyles()(theme => ({
+    callbackEditor: {
+        fontFamily,
+        fontSize,
+        background: theme.palette.background.default,
+        overflowX: 'auto',
+        marginTop: '16px',
+        border: '1px solid rgba(0,0,0,0.42)',
+    },
+    textAreaFont: {
+        fontFamily,
+    },
+}));
+export default function CodeEditor({ contents, setContents, }) {
+    const { classes } = useStyles();
+    const [error, setCodeError] = useState();
+    const [val, setVal] = useState(contents);
+    useEffect(() => {
+        try {
+            JSON.parse(contents);
+            setCodeError(undefined);
+            setContents(val);
+        }
+        catch (e) {
+            console.error({ e });
+            setCodeError(e);
+        }
+    }, [val, contents, setContents]);
+    return (React.createElement(TextField, { className: classes.callbackEditor, value: contents, onChange: event => setVal(event.target.value), style: { background: error ? '#fdd' : undefined }, InputProps: {
+            classes: {
+                input: classes.textAreaFont,
+            },
+        } }));
+}
+//# sourceMappingURL=CodeEditor.js.map

package/esm/ConfigurationEditorWidget/components/CodeEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CodeEditor.js","sourceRoot":"","sources":["../../../src/ConfigurationEditorWidget/components/CodeEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAClD,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAE1C,6EAA6E;AAC7E,MAAM,QAAQ,GAAG,MAAM,CAAA;AACvB,2FAA2F;AAC3F,MAAM,UAAU,GACd,sNAAsN,CAAA;AAExN,MAAM,SAAS,GAAG,UAAU,EAAE,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IACvC,cAAc,EAAE;QACd,UAAU;QACV,QAAQ;QACR,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,UAAU,CAAC,OAAO;QAC5C,SAAS,EAAE,MAAM;QACjB,SAAS,EAAE,MAAM;QACjB,MAAM,EAAE,4BAA4B;KACrC;IACD,YAAY,EAAE;QACZ,UAAU;KACX;CACF,CAAC,CAAC,CAAA;AAEH,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,QAAQ,EACR,WAAW,GAIZ;IACC,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,CAAA;IAC/B,MAAM,CAAC,KAAK,EAAE,YAAY,CAAC,GAAG,QAAQ,EAAW,CAAA;IACjD,MAAM,CAAC,GAAG,EAAE,MAAM,CAAC,GAAG,QAAQ,CAAC,QAAQ,CAAC,CAAA;IACxC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI;YACF,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAA;YACpB,YAAY,CAAC,SAAS,CAAC,CAAA;YACvB,WAAW,CAAC,GAAG,CAAC,CAAA;SACjB;QAAC,OAAO,CAAC,EAAE;YACV,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC,CAAA;YACpB,YAAY,CAAC,CAAC,CAAC,CAAA;SAChB;IACH,CAAC,EAAE,CAAC,GAAG,EAAE,QAAQ,EAAE,WAAW,CAAC,CAAC,CAAA;IAEhC,OAAO,CACL,oBAAC,SAAS,IACR,SAAS,EAAE,OAAO,CAAC,cAAc,EACjC,KAAK,EAAE,QAAQ,EACf,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,EAC7C,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EAAE,EACjD,UAAU,EAAE;YACV,OAAO,EAAE;gBACP,KAAK,EAAE,OAAO,CAAC,YAAY;aAC5B;SACF,GACD,CACH,CAAA;AACH,CAAC"}

package/esm/ConfigurationEditorWidget/components/ColorEditor.d.ts

@@ -0,0 +1,20 @@
+/// <reference types="react" />
+export declare const ColorSlot: (props: {
+    value: string;
+    label?: string | undefined;
+    TextFieldProps?: {
+        helperText: string;
+        fullWidth: boolean;
+    } | undefined;
+    onChange: (arg: string) => void;
+}) => JSX.Element;
+declare function ColorEditorSlot(props: {
+    slot: {
+        name: string;
+        value: string;
+        description: string;
+        set: (arg: string) => void;
+    };
+}): JSX.Element;
+declare const _default: typeof ColorEditorSlot;
+export default _default;

package/esm/ConfigurationEditorWidget/components/ColorEditor.js

@@ -0,0 +1,37 @@
+import React, { lazy, useState } from 'react';
+import { observer } from 'mobx-react';
+import { TextField } from '@mui/material';
+const ColorPicker = lazy(() => import('./ColorPicker'));
+// this is needed because passing a entire color object into the react-color
+// for alpha, can't pass in an rgba string for example
+function serializeColor(color) {
+    if (color instanceof Object) {
+        const { r, g, b, a } = color;
+        return a === undefined ? `rgb(${r},${g},${b})` : `rgba(${r},${g},${b},${a})`;
+    }
+    return color;
+}
+export const ColorSlot = (props) => {
+    const { value = '#000', label = '', TextFieldProps = {}, onChange } = props;
+    const [displayed, setDisplayed] = useState(false);
+    return (React.createElement(React.Fragment, null,
+        React.createElement(TextField, { value: value, label: label, InputProps: {
+                style: {
+                    color: value,
+                    borderRightWidth: '25px',
+                    borderRightStyle: 'solid',
+                    borderRightColor: value,
+                },
+            }, onClick: () => setDisplayed(!displayed), onChange: event => onChange(event.target.value), ...TextFieldProps }),
+        displayed ? (React.createElement(React.Suspense, { fallback: React.createElement("div", null) },
+            React.createElement(ColorPicker, { color: value, onChange: event => onChange(serializeColor(event.rgb)) }))) : null));
+};
+function ColorEditorSlot(props) {
+    const { slot } = props;
+    return (React.createElement(ColorSlot, { label: slot.name, value: slot.value, onChange: color => slot.set(color), TextFieldProps: {
+            helperText: slot.description,
+            fullWidth: true,
+        } }));
+}
+export default observer(ColorEditorSlot);
+//# sourceMappingURL=ColorEditor.js.map

package/esm/ConfigurationEditorWidget/components/ColorEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorEditor.js","sourceRoot":"","sources":["../../../src/ConfigurationEditorWidget/components/ColorEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AAGzC,MAAM,WAAW,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,CAAA;AAEvD,4EAA4E;AAC5E,sDAAsD;AACtD,SAAS,cAAc,CAAC,KAAY;IAClC,IAAI,KAAK,YAAY,MAAM,EAAE;QAC3B,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,KAAiB,CAAA;QACxC,OAAO,CAAC,KAAK,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAA;KAC7E;IACD,OAAO,KAAK,CAAA;AACd,CAAC;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,KAQzB,EAAE,EAAE;IACH,MAAM,EAAE,KAAK,GAAG,MAAM,EAAE,KAAK,GAAG,EAAE,EAAE,cAAc,GAAG,EAAE,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAA;IAC3E,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAEjD,OAAO,CACL;QACE,oBAAC,SAAS,IACR,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE;gBACV,KAAK,EAAE;oBACL,KAAK,EAAE,KAAK;oBACZ,gBAAgB,EAAE,MAAM;oBACxB,gBAAgB,EAAE,OAAO;oBACzB,gBAAgB,EAAE,KAAK;iBACxB;aACF,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,CAAC,SAAS,CAAC,EACvC,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,KAC3C,cAAc,GAClB;QACD,SAAS,CAAC,CAAC,CAAC,CACX,oBAAC,KAAK,CAAC,QAAQ,IAAC,QAAQ,EAAE,gCAAO;YAC/B,oBAAC,WAAW,IACV,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,QAAQ,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GACtD,CACa,CAClB,CAAC,CAAC,CAAC,IAAI,CACP,CACJ,CAAA;AACH,CAAC,CAAA;AAED,SAAS,eAAe,CAAC,KAOxB;IACC,MAAM,EAAE,IAAI,EAAE,GAAG,KAAK,CAAA;IACtB,OAAO,CACL,oBAAC,SAAS,IACR,KAAK,EAAE,IAAI,CAAC,IAAI,EAChB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,EAClC,cAAc,EAAE;YACd,UAAU,EAAE,IAAI,CAAC,WAAW;YAC5B,SAAS,EAAE,IAAI;SAChB,GACD,CACH,CAAA;AACH,CAAC;AAED,eAAe,QAAQ,CAAC,eAAe,CAAC,CAAA"}

package/esm/ConfigurationEditorWidget/components/ColorPicker.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { Color, ColorResult } from 'react-color';
+export declare function ColorPicker(props: {
+    color: Color;
+    onChange: (color: ColorResult) => void;
+}): JSX.Element;
+export default ColorPicker;

package/esm/ConfigurationEditorWidget/components/ColorPicker.js

@@ -0,0 +1,26 @@
+import React, { useState } from 'react';
+import { makeStyles } from 'tss-react/mui';
+import { ChromePicker } from 'react-color';
+const useStyles = makeStyles()({
+    popover: {
+        position: 'absolute',
+        zIndex: 2,
+    },
+    cover: {
+        position: 'fixed',
+        top: 0,
+        right: 0,
+        bottom: 0,
+        left: 0,
+    },
+});
+export function ColorPicker(props) {
+    const { color, onChange } = props;
+    const { classes } = useStyles();
+    const [displayColorPicker, setDisplayColorPicker] = useState(true);
+    return (React.createElement("div", null, displayColorPicker ? (React.createElement("div", { className: classes.popover },
+        React.createElement("div", { role: "presentation", className: classes.cover, onClick: () => setDisplayColorPicker(false) }),
+        React.createElement(ChromePicker, { color: color, onChange: onChange }))) : null));
+}
+export default ColorPicker;
+//# sourceMappingURL=ColorPicker.js.map

package/esm/ConfigurationEditorWidget/components/ColorPicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorPicker.js","sourceRoot":"","sources":["../../../src/ConfigurationEditorWidget/components/ColorPicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC1C,OAAO,EAAE,YAAY,EAAsB,MAAM,aAAa,CAAA;AAE9D,MAAM,SAAS,GAAG,UAAU,EAAE,CAAC;IAC7B,OAAO,EAAE;QACP,QAAQ,EAAE,UAAU;QACpB,MAAM,EAAE,CAAC;KACV;IACD,KAAK,EAAE;QACL,QAAQ,EAAE,OAAO;QACjB,GAAG,EAAE,CAAC;QACN,KAAK,EAAE,CAAC;QACR,MAAM,EAAE,CAAC;QACT,IAAI,EAAE,CAAC;KACR;CACF,CAAC,CAAA;AAEF,MAAM,UAAU,WAAW,CAAC,KAG3B;IACC,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAA;IACjC,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,CAAA;IAC/B,MAAM,CAAC,kBAAkB,EAAE,qBAAqB,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAA;IAElE,OAAO,CACL,iCACG,kBAAkB,CAAC,CAAC,CAAC,CACpB,6BAAK,SAAS,EAAE,OAAO,CAAC,OAAO;QAC7B,6BACE,IAAI,EAAC,cAAc,EACnB,SAAS,EAAE,OAAO,CAAC,KAAK,EACxB,OAAO,EAAE,GAAG,EAAE,CAAC,qBAAqB,CAAC,KAAK,CAAC,GAC3C;QACF,oBAAC,YAAY,IAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,GAAI,CAC9C,CACP,CAAC,CAAC,CAAC,IAAI,CACJ,CACP,CAAA;AACH,CAAC;AAED,eAAe,WAAW,CAAA"}

package/esm/ConfigurationEditorWidget/components/ConfigurationEditor.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { AnyConfigurationModel } from '@jbrowse/core/configuration';
+declare const ConfigurationEditor: ({ model }: {
+    model: {
+        target: AnyConfigurationModel;
+    };
+}) => JSX.Element;
+export default ConfigurationEditor;