@jbrowse/plugin-config 2.16.1 → 2.18.0

package/dist/FromConfigSequenceAdapter/FromConfigSequenceAdapter.d.ts

@@ -1,26 +1,13 @@
-import { Feature } from '@jbrowse/core/util/simpleFeature';
-import { NoAssemblyRegion } from '@jbrowse/core/util/types';
-import { RegionsAdapter } from '@jbrowse/core/data_adapters/BaseAdapter';
 import FromConfigAdapter from '../FromConfigAdapter/FromConfigAdapter';
+import type { RegionsAdapter } from '@jbrowse/core/data_adapters/BaseAdapter';
+import type { Feature } from '@jbrowse/core/util/simpleFeature';
+import type { NoAssemblyRegion } from '@jbrowse/core/util/types';
 export default class FromConfigSequenceAdapter extends FromConfigAdapter implements RegionsAdapter {
-    /**
-     * Fetch features for a certain region
-     * @param region - Region
-     * @returns Observable of Feature objects in the region
-     */
     getFeatures(region: NoAssemblyRegion): import("rxjs").Observable<Feature>;
-    /**
-     * Get refName, start, and end for all features after collapsing any overlaps
-     */
     getRegions(): Promise<{
         start: number;
         end: number;
         refName: string;
     }[]>;
-    /**
-     * called to provide a hint that data tied to a certain region
-     * will not be needed for the foreseeable future and can be purged
-     * from caches, etc
-     */
     freeResources(): void;
 }

package/dist/FromConfigSequenceAdapter/FromConfigSequenceAdapter.js

@@ -3,18 +3,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-const simpleFeature_1 = __importDefault(require("@jbrowse/core/util/simpleFeature"));
 const rxjs_1 = require("@jbrowse/core/util/rxjs");
+const simpleFeature_1 = __importDefault(require("@jbrowse/core/util/simpleFeature"));
+const rxjs_2 = require("rxjs");
 const operators_1 = require("rxjs/operators");
-// locals
 const FromConfigAdapter_1 = __importDefault(require("../FromConfigAdapter/FromConfigAdapter"));
-const rxjs_2 = require("rxjs");
 class FromConfigSequenceAdapter extends FromConfigAdapter_1.default {
-    /**
-     * Fetch features for a certain region
-     * @param region - Region
-     * @returns Observable of Feature objects in the region
-     */
     getFeatures(region) {
         return (0, rxjs_1.ObservableCreate)(async (observer) => {
             const feats = await (0, rxjs_2.firstValueFrom)(super.getFeatures(region).pipe((0, operators_1.toArray)()));
@@ -31,12 +25,8 @@ class FromConfigSequenceAdapter extends FromConfigAdapter_1.default {
             observer.complete();
         });
     }
-    /**
-     * Get refName, start, and end for all features after collapsing any overlaps
-     */
     async getRegions() {
         const regions = [];
-        // recall: features are stored in this object sorted by start coordinate
         for (const [refName, features] of this.features) {
             let currentRegion;
             for (const feature of features) {
@@ -62,11 +52,6 @@ class FromConfigSequenceAdapter extends FromConfigAdapter_1.default {
         }
         return regions;
     }
-    /**
-     * called to provide a hint that data tied to a certain region
-     * will not be needed for the foreseeable future and can be purged
-     * from caches, etc
-     */
-    freeResources( /* { region } */) { }
+    freeResources() { }
 }
 exports.default = FromConfigSequenceAdapter;

package/dist/FromConfigSequenceAdapter/configSchema.d.ts

@@ -1,7 +1,4 @@
 declare const sequenceConfigSchema: import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{
-    /**
-     * #slot
-     */
     features: {
         type: string;
         defaultValue: never[];

package/dist/FromConfigSequenceAdapter/configSchema.js

@@ -1,14 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const configuration_1 = require("@jbrowse/core/configuration");
-/**
- * #config FromConfigSequenceAdapter
- */
-function x() { } // eslint-disable-line @typescript-eslint/no-unused-vars
+function x() { }
 const sequenceConfigSchema = (0, configuration_1.ConfigurationSchema)('FromConfigSequenceAdapter', {
-    /**
-     * #slot
-     */
     features: {
         type: 'frozen',
         defaultValue: [],

package/dist/FromConfigSequenceAdapter/index.d.ts

@@ -1,2 +1,2 @@
-import PluginManager from '@jbrowse/core/PluginManager';
+import type PluginManager from '@jbrowse/core/PluginManager';
 export default function FromConfigSequenceAdapterF(pluginManager: PluginManager): void;

package/dist/NcbiSequenceReportAliasAdapter/NcbiSequenceReportAliasAdapter.d.ts

@@ -1,4 +1,5 @@
-import { BaseRefNameAliasAdapter, BaseAdapter } from '@jbrowse/core/data_adapters/BaseAdapter';
+import { BaseAdapter } from '@jbrowse/core/data_adapters/BaseAdapter';
+import type { BaseRefNameAliasAdapter } from '@jbrowse/core/data_adapters/BaseAdapter';
 export default class NcbiSequenceReportAliasAdapter extends BaseAdapter implements BaseRefNameAliasAdapter {
     getRefNameAliases(): Promise<{
         refName: string;

package/dist/NcbiSequenceReportAliasAdapter/configSchema.d.ts

@@ -1,7 +1,4 @@
 declare const NcbiSequenceReportAliasAdapterConfigSchema: import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{
-    /**
-     * #slot
-     */
     location: {
         type: string;
         defaultValue: {

package/dist/NcbiSequenceReportAliasAdapter/configSchema.js

@@ -1,15 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const configuration_1 = require("@jbrowse/core/configuration");
-/**
- * #config NcbiSequenceReportAliasAdapter
- * can read "sequence_report.tsv" type files from NCBI
- */
-function x() { } // eslint-disable-line @typescript-eslint/no-unused-vars
+function x() { }
 const NcbiSequenceReportAliasAdapterConfigSchema = (0, configuration_1.ConfigurationSchema)('NcbiSequenceReportAliasAdapter', {
-    /**
-     * #slot
-     */
     location: {
         type: 'fileLocation',
         defaultValue: {

package/dist/NcbiSequenceReportAliasAdapter/index.d.ts

@@ -1,2 +1,2 @@
-import PluginManager from '@jbrowse/core/PluginManager';
+import type PluginManager from '@jbrowse/core/PluginManager';
 export default function NcbiSequenceReportAliasAdapterF(pluginManager: PluginManager): void;

package/dist/RefNameAliasAdapter/RefNameAliasAdapter.d.ts

@@ -1,4 +1,5 @@
-import { BaseRefNameAliasAdapter, BaseAdapter } from '@jbrowse/core/data_adapters/BaseAdapter';
+import { BaseAdapter } from '@jbrowse/core/data_adapters/BaseAdapter';
+import type { BaseRefNameAliasAdapter } from '@jbrowse/core/data_adapters/BaseAdapter';
 export default class RefNameAliasAdapter extends BaseAdapter implements BaseRefNameAliasAdapter {
     getRefNameAliases(): Promise<{
         refName: string;

package/dist/RefNameAliasAdapter/configSchema.d.ts

@@ -1,7 +1,4 @@
 declare const RefNameAliasAdapter: import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{
-    /**
-     * #slot
-     */
     location: {
         type: string;
         defaultValue: {
@@ -9,11 +6,6 @@ declare const RefNameAliasAdapter: import("@jbrowse/core/configuration/configura
             locationType: string;
         };
     };
-    /**
-     * #slot
-     * by default, the "ref names that match the fasta" are assumed to be in the
-     * first column (0), change this variable if needed
-     */
     refNameColumn: {
         type: string;
         defaultValue: number;

package/dist/RefNameAliasAdapter/configSchema.js

@@ -1,16 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const configuration_1 = require("@jbrowse/core/configuration");
-/**
- * #config RefNameAliasAdapter
- * can read "chromAliases" type files from UCSC or any tab separated file of
- * refName aliases
- */
-function x() { } // eslint-disable-line @typescript-eslint/no-unused-vars
+function x() { }
 const RefNameAliasAdapter = (0, configuration_1.ConfigurationSchema)('RefNameAliasAdapter', {
-    /**
-     * #slot
-     */
     location: {
         type: 'fileLocation',
         defaultValue: {
@@ -18,11 +10,6 @@ const RefNameAliasAdapter = (0, configuration_1.ConfigurationSchema)('RefNameAli
             locationType: 'UriLocation',
         },
     },
-    /**
-     * #slot
-     * by default, the "ref names that match the fasta" are assumed to be in the
-     * first column (0), change this variable if needed
-     */
     refNameColumn: {
         type: 'number',
         defaultValue: 0,

package/dist/RefNameAliasAdapter/index.d.ts

@@ -1,2 +1,2 @@
-import PluginManager from '@jbrowse/core/PluginManager';
+import type PluginManager from '@jbrowse/core/PluginManager';
 export default function RefNameAliasAdapterF(pluginManager: PluginManager): void;

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import Plugin from '@jbrowse/core/Plugin';
-import PluginManager from '@jbrowse/core/PluginManager';
+import type PluginManager from '@jbrowse/core/PluginManager';
 declare const LazyConfigurationEditorComponent: import("react").LazyExoticComponent<({ model, }: {
     model: {
         target: import("@jbrowse/core/configuration").AnyConfigurationModel;

package/dist/index.js

@@ -29,12 +29,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ConfigurationEditor = void 0;
 const react_1 = require("react");
 const Plugin_1 = __importDefault(require("@jbrowse/core/Plugin"));
+const ConfigurationEditorWidget_1 = __importDefault(require("./ConfigurationEditorWidget"));
 const FromConfigAdapter_1 = __importDefault(require("./FromConfigAdapter"));
 const FromConfigRegionsAdapter_1 = __importDefault(require("./FromConfigRegionsAdapter"));
 const FromConfigSequenceAdapter_1 = __importDefault(require("./FromConfigSequenceAdapter"));
-const RefNameAliasAdapter_1 = __importDefault(require("./RefNameAliasAdapter"));
-const ConfigurationEditorWidget_1 = __importDefault(require("./ConfigurationEditorWidget"));
 const NcbiSequenceReportAliasAdapter_1 = __importDefault(require("./NcbiSequenceReportAliasAdapter"));
+const RefNameAliasAdapter_1 = __importDefault(require("./RefNameAliasAdapter"));
 const LazyConfigurationEditorComponent = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./ConfigurationEditorWidget/components/ConfigurationEditor'))));
 exports.ConfigurationEditor = LazyConfigurationEditorComponent;
 class ConfigurationPlugin extends Plugin_1.default {

package/esm/ConfigurationEditorWidget/components/BooleanEditor.js

@@ -1,6 +1,6 @@
 import React from 'react';
-import { observer } from 'mobx-react';
 import { Checkbox, FormControl, FormControlLabel, FormHelperText, } from '@mui/material';
+import { observer } from 'mobx-react';
 const BooleanEditor = observer(function ({ slot, }) {
     return (React.createElement(FormControl, null,
         React.createElement(FormControlLabel, { label: slot.name, control: React.createElement(Checkbox, { checked: slot.value, onChange: evt => {

package/esm/ConfigurationEditorWidget/components/CallbackEditor.js

@@ -1,14 +1,11 @@
 import React, { useEffect, useState } from 'react';
-import { Tooltip, IconButton, TextField } from '@mui/material';
 import { useDebounce } from '@jbrowse/core/util';
 import { stringToJexlExpression } from '@jbrowse/core/util/jexlStrings';
-import { getEnv } from 'mobx-state-tree';
+import HelpIcon from '@mui/icons-material/Help';
+import { IconButton, TextField, Tooltip } from '@mui/material';
 import { observer } from 'mobx-react';
+import { getEnv } from 'mobx-state-tree';
 import { makeStyles } from 'tss-react/mui';
-// icons
-import HelpIcon from '@mui/icons-material/Help';
-// 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: {
@@ -52,16 +49,16 @@ const CallbackEditor = observer(function ({ slot, }) {
             setCodeError(e);
         }
     }, [debouncedCode, slot]);
-    // if default value is a callback, will have to remove jexl:
-    // do this last
     return (React.createElement(React.Fragment, null,
         error ? React.createElement("p", { className: classes.error }, `${error}`) : null,
         React.createElement("div", { className: classes.callbackContainer },
             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,
+                }, style: { background: error ? '#fdd' : undefined }, slotProps: {
+                    input: {
+                        classes: {
+                            input: classes.textAreaFont,
+                        },
                     },
                 } }),
             React.createElement("p", null, slot.description),

package/esm/ConfigurationEditorWidget/components/ColorEditor.js

@@ -1,7 +1,7 @@
 import React, { useState } from 'react';
-import { observer } from 'mobx-react';
-import { TextField } from '@mui/material';
 import ColorPicker from '@jbrowse/core/ui/ColorPicker';
+import { TextField } from '@mui/material';
+import { observer } from 'mobx-react';
 export const ColorSlot = (props) => {
     const { value = '#000', label = '', TextFieldProps = {}, onChange } = props;
     const [displayed, setDisplayed] = useState(false);

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

@@ -1,6 +1,6 @@
 import React from 'react';
-import { AbstractSessionModel } from '@jbrowse/core/util';
-import { AnyConfigurationModel } from '@jbrowse/core/configuration';
+import type { AnyConfigurationModel } from '@jbrowse/core/configuration';
+import type { AbstractSessionModel } from '@jbrowse/core/util';
 declare const ConfigurationEditor: ({ model, }: {
     model: {
         target: AnyConfigurationModel;

package/esm/ConfigurationEditorWidget/components/ConfigurationEditor.js

@@ -1,14 +1,12 @@
 import React from 'react';
-import { FormGroup, Accordion, AccordionDetails, AccordionSummary, Typography, } from '@mui/material';
-import { makeStyles } from 'tss-react/mui';
+import { getTypeNamesFromExplicitlyTypedUnion, isConfigurationSchemaType, isConfigurationSlotType, readConfObject, } from '@jbrowse/core/configuration';
+import SanitizedHTML from '@jbrowse/core/ui/SanitizedHTML';
+import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
+import { Accordion, AccordionDetails, AccordionSummary, FormGroup, Typography, } from '@mui/material';
 import { observer } from 'mobx-react';
 import { getMembers } from 'mobx-state-tree';
 import { singular } from 'pluralize';
-import SanitizedHTML from '@jbrowse/core/ui/SanitizedHTML';
-import { readConfObject, getTypeNamesFromExplicitlyTypedUnion, isConfigurationSchemaType, isConfigurationSlotType, } from '@jbrowse/core/configuration';
-// icons
-import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
-// locals
+import { makeStyles } from 'tss-react/mui';
 import SlotEditor from './SlotEditor';
 import TypeSelector from './TypeSelector';
 const useStyles = makeStyles()(theme => ({
@@ -39,8 +37,6 @@ const Member = observer(function (props) {
                 return React.createElement(Member, { key: key, ...props, slot: subslot, slotName: key });
             });
         }
-        // if this is an explicitly typed schema, make a type-selecting dropdown
-        // that can be used to change its type
         const typeNameChoices = getTypeNamesFromExplicitlyTypedUnion(slotSchema);
         return (React.createElement(Accordion, { defaultExpanded: true, className: classes.accordion },
             React.createElement(AccordionSummary, { expandIcon: React.createElement(ExpandMoreIcon, { className: classes.icon }) },
@@ -67,9 +63,6 @@ const Schema = observer(function ({ schema, path = [], }) {
 });
 const ConfigurationEditor = observer(function ({ model, }) {
     const { classes } = useStyles();
-    // key forces a re-render, otherwise the same field can end up being used for
-    // different tracks since only the backing model changes for example see pr
-    // #804
     const { target } = model;
     const key = readConfObject(target, 'trackId');
     const name = readConfObject(target, 'name');

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import { TextFieldProps } from '@mui/material';
+import type { TextFieldProps } from '@mui/material';
 export default function ConfigurationTextField(props: {
     helperText?: string;
 } & TextFieldProps): React.JSX.Element;

package/esm/ConfigurationEditorWidget/components/ConfigurationTextField.js

@@ -1,11 +1,11 @@
 import React from 'react';
-import { TextField } from '@mui/material';
 import { SanitizedHTML } from '@jbrowse/core/ui';
-// adds ability to have html in helperText. note that FormHelperTextProps is
-// div because the default is p which does not like div children
+import { TextField } from '@mui/material';
 export default function ConfigurationTextField(props) {
     const { helperText } = props;
-    return (React.createElement(TextField, { ...props, helperText: React.createElement(SanitizedHTML, { html: helperText || '' }), FormHelperTextProps: {
-            component: 'div',
-        }, fullWidth: true }));
+    return (React.createElement(TextField, { ...props, helperText: React.createElement(SanitizedHTML, { html: helperText || '' }), fullWidth: true, slotProps: {
+            formHelperText: {
+                component: 'div',
+            },
+        } }));
 }

package/esm/ConfigurationEditorWidget/components/HeadingComponent.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { observer } from 'mobx-react';
-import { isStateTreeNode, getType } from 'mobx-state-tree';
+import { getType, isStateTreeNode } from 'mobx-state-tree';
 const HeadingComponent = observer(function ({ model, }) {
     if (model === null || model === void 0 ? void 0 : model.target) {
         if (model.target.type) {

package/esm/ConfigurationEditorWidget/components/JsonEditor.js

@@ -1,10 +1,8 @@
 import React, { useEffect, useState } from 'react';
 import { InputLabel, TextField } from '@mui/material';
-import { makeStyles } from 'tss-react/mui';
 import { observer } from 'mobx-react';
-// fontSize and fontFamily have to match between Editor and SyntaxHighlighter
+import { makeStyles } from 'tss-react/mui';
 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 => ({
     error: {
@@ -47,9 +45,11 @@ const JsonEditor = observer(function JsonEditor({ slot, }) {
             React.createElement(InputLabel, { shrink: true, htmlFor: "json-editor" }, slot.name),
             React.createElement(TextField, { id: "json-editor", className: classes.callbackEditor, value: contents, helperText: slot.description, multiline: true, onChange: event => {
                     setContents(event.target.value);
-                }, style: { background: error ? '#fdd' : undefined }, InputProps: {
-                    classes: {
-                        input: classes.textAreaFont,
+                }, style: { background: error ? '#fdd' : undefined }, slotProps: {
+                    input: {
+                        classes: {
+                            input: classes.textAreaFont,
+                        },
                     },
                 } }))));
 });

package/esm/ConfigurationEditorWidget/components/NumberMapEditor.js

@@ -1,10 +1,9 @@
 import React, { useState } from 'react';
-import { observer } from 'mobx-react';
+import AddIcon from '@mui/icons-material/Add';
+import DeleteIcon from '@mui/icons-material/Delete';
 import { Card, CardContent, CardHeader, FormHelperText, IconButton, InputAdornment, InputLabel, TextField, } from '@mui/material';
+import { observer } from 'mobx-react';
 import { makeStyles } from 'tss-react/mui';
-// icons
-import DeleteIcon from '@mui/icons-material/Delete';
-import AddIcon from '@mui/icons-material/Add';
 import NumberEditor from './NumberEditor';
 const useStyles = makeStyles()(theme => ({
     card: {
@@ -31,13 +30,15 @@ const NumberMapEditor = observer(function ({ slot, }) {
         React.createElement(Card, { raised: true, className: classes.card },
             React.createElement(CardHeader, { disableTypography: true, title: React.createElement(TextField, { fullWidth: true, value: value, placeholder: "add new", onChange: event => {
                         setValue(event.target.value);
-                    }, InputProps: {
-                        endAdornment: (React.createElement(InputAdornment, { position: "end" },
-                            React.createElement(IconButton, { disabled: value === '', onClick: () => {
-                                    slot.add(value, 0);
-                                    setValue('');
-                                } },
-                                React.createElement(AddIcon, null)))),
+                    }, slotProps: {
+                        input: {
+                            endAdornment: (React.createElement(InputAdornment, { position: "end" },
+                                React.createElement(IconButton, { disabled: value === '', onClick: () => {
+                                        slot.add(value, 0);
+                                        setValue('');
+                                    } },
+                                    React.createElement(AddIcon, null)))),
+                        },
                     } }) })),
         React.createElement(FormHelperText, null, slot.description)));
 });

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import { IAnyType } from 'mobx-state-tree';
+import type { IAnyType } from 'mobx-state-tree';
 declare const SlotEditor: ({ slot, slotSchema, }: {
     slot: any;
     slotSchema: IAnyType;

package/esm/ConfigurationEditorWidget/components/SlotEditor.js

@@ -1,22 +1,20 @@
 import React, { useEffect, useState } from 'react';
-import { observer } from 'mobx-react';
-import { getPropertyMembers } from 'mobx-state-tree';
-import { getEnv } from '@jbrowse/core/util';
 import { FileSelector } from '@jbrowse/core/ui';
-import { getSubType, getUnionSubTypes, } from '@jbrowse/core/util/mst-reflection';
-import { IconButton, MenuItem, Paper, SvgIcon, TextField } from '@mui/material';
-// icons
+import { getEnv } from '@jbrowse/core/util';
+import { getSubType, getUnionSubTypes } from '@jbrowse/core/util/mst-reflection';
 import RadioButtonUncheckedIcon from '@mui/icons-material/RadioButtonUnchecked';
-// locals
-import StringArrayEditor from './StringArrayEditor';
+import { IconButton, MenuItem, Paper, SvgIcon, TextField } from '@mui/material';
+import { observer } from 'mobx-react';
+import { getPropertyMembers } from 'mobx-state-tree';
+import BooleanEditor from './BooleanEditor';
 import CallbackEditor from './CallbackEditor';
 import ColorEditor from './ColorEditor';
-import JsonEditor from './JsonEditor';
-import StringArrayMapEditor from './StringArrayMapEditor';
 import ConfigurationTextField from './ConfigurationTextField';
-import NumberMapEditor from './NumberMapEditor';
+import JsonEditor from './JsonEditor';
 import NumberEditor from './NumberEditor';
-import BooleanEditor from './BooleanEditor';
+import NumberMapEditor from './NumberMapEditor';
+import StringArrayEditor from './StringArrayEditor';
+import StringArrayMapEditor from './StringArrayMapEditor';
 import { useSlotEditorStyles } from './useSlotEditorStyles';
 const StringEditor = observer(function ({ slot, }) {
     return (React.createElement(ConfigurationTextField, { label: slot.name, helperText: slot.description, value: slot.value, onChange: evt => {
@@ -28,7 +26,6 @@ const TextEditor = observer(function ({ slot, }) {
             slot.set(evt.target.value);
         } }));
 });
-// checked checkbox, looks like a styled (x)
 const SvgCheckbox = () => (React.createElement(SvgIcon, null,
     React.createElement("path", { d: "M20.41,3C21.8,5.71 22.35,8.84 22,12C21.8,15.16 20.7,18.29 18.83,21L17.3,20C18.91,17.57 19.85,14.8 20,12C20.34,9.2 19.89,6.43 18.7,4L20.41,3M5.17,3L6.7,4C5.09,6.43 4.15,9.2 4,12C3.66,14.8 4.12,17.57 5.3,20L3.61,21C2.21,18.29 1.65,15.17 2,12C2.2,8.84 3.3,5.71 5.17,3M12.08,10.68L14.4,7.45H16.93L13.15,12.45L15.35,17.37H13.09L11.71,14L9.28,17.33H6.76L10.66,12.21L8.53,7.45H10.8L12.08,10.68Z" })));
 const IntegerEditor = observer(function ({ slot, }) {
@@ -54,9 +51,7 @@ const FileSelectorWrapper = observer(function ({ slot, }) {
     var _a;
     return (React.createElement(FileSelector, { location: slot.value, setLocation: location => {
             slot.set(location);
-        }, name: slot.name, description: slot.description, 
-        // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-        rootModel: (_a = getEnv(slot).pluginManager) === null || _a === void 0 ? void 0 : _a.rootModel }));
+        }, name: slot.name, description: slot.description, rootModel: (_a = getEnv(slot).pluginManager) === null || _a === void 0 ? void 0 : _a.rootModel }));
 });
 const valueComponents = {
     string: StringEditor,
@@ -78,7 +73,7 @@ const SlotEditor = observer(function ({ slot, slotSchema, }) {
     const { type } = slot;
     let ValueComponent = slot.isCallback
         ? CallbackEditor
-        : // @ts-expect-error
+        :
             valueComponents[type];
     if (!ValueComponent) {
         console.warn(`no slot editor defined for ${type}, editing as string`);

package/esm/ConfigurationEditorWidget/components/StringArrayEditor.js

@@ -1,8 +1,7 @@
 import React, { useState } from 'react';
-import { observer } from 'mobx-react';
-import { Button, FormHelperText, IconButton, InputAdornment, InputLabel, List, ListItem, TextField, } from '@mui/material';
-// icons
 import DeleteIcon from '@mui/icons-material/Delete';
+import { Button, FormHelperText, IconButton, InputAdornment, InputLabel, List, ListItem, TextField, } from '@mui/material';
+import { observer } from 'mobx-react';
 const StringArrayEditor = observer(function ({ slot, }) {
     const [value, setValue] = useState('');
     const [addNew, setAddNew] = useState(false);
@@ -12,28 +11,32 @@ const StringArrayEditor = observer(function ({ slot, }) {
             slot.value.map((val, idx) => (React.createElement(ListItem, { key: `${JSON.stringify(val)}-${idx}`, disableGutters: true },
                 React.createElement(TextField, { value: val, onChange: evt => {
                         slot.setAtIndex(idx, evt.target.value);
-                    }, InputProps: {
-                        endAdornment: (React.createElement(InputAdornment, { position: "end" },
-                            React.createElement(IconButton, { onClick: () => {
-                                    slot.removeAtIndex(idx);
-                                } },
-                                React.createElement(DeleteIcon, null)))),
+                    }, slotProps: {
+                        input: {
+                            endAdornment: (React.createElement(InputAdornment, { position: "end" },
+                                React.createElement(IconButton, { onClick: () => {
+                                        slot.removeAtIndex(idx);
+                                    } },
+                                    React.createElement(DeleteIcon, null)))),
+                        },
                     } })))),
             addNew ? (React.createElement(ListItem, { disableGutters: true },
                 React.createElement(TextField, { value: value, placeholder: "add new", onChange: event => {
                         setValue(event.target.value);
-                    }, InputProps: {
-                        endAdornment: (React.createElement(InputAdornment, { position: "end" },
-                            React.createElement(React.Fragment, null,
-                                React.createElement(Button, { color: "primary", variant: "contained", style: { margin: 2 }, "data-testid": `stringArrayAdd-${slot.name}`, onClick: () => {
-                                        setAddNew(false);
-                                        slot.add(value);
-                                        setValue('');
-                                    } }, "OK"),
-                                React.createElement(Button, { color: "primary", variant: "contained", style: { margin: 2 }, onClick: () => {
-                                        setAddNew(false);
-                                        setValue('');
-                                    } }, "Cancel")))),
+                    }, slotProps: {
+                        input: {
+                            endAdornment: (React.createElement(InputAdornment, { position: "end" },
+                                React.createElement(React.Fragment, null,
+                                    React.createElement(Button, { color: "primary", variant: "contained", style: { margin: 2 }, "data-testid": `stringArrayAdd-${slot.name}`, onClick: () => {
+                                            setAddNew(false);
+                                            slot.add(value);
+                                            setValue('');
+                                        } }, "OK"),
+                                    React.createElement(Button, { color: "primary", variant: "contained", style: { margin: 2 }, onClick: () => {
+                                            setAddNew(false);
+                                            setValue('');
+                                        } }, "Cancel")))),
+                        },
                     } }))) : null,
             React.createElement(Button, { color: "primary", variant: "contained", style: { margin: 4 }, disabled: addNew, onClick: () => {
                     setAddNew(true);

package/esm/ConfigurationEditorWidget/components/StringArrayMapEditor.js

@@ -1,11 +1,9 @@
 import React, { useState } from 'react';
-import { observer } from 'mobx-react';
+import AddIcon from '@mui/icons-material/Add';
+import DeleteIcon from '@mui/icons-material/Delete';
 import { Card, CardContent, CardHeader, FormHelperText, IconButton, InputAdornment, InputLabel, TextField, } from '@mui/material';
+import { observer } from 'mobx-react';
 import { makeStyles } from 'tss-react/mui';
-// icons
-import DeleteIcon from '@mui/icons-material/Delete';
-import AddIcon from '@mui/icons-material/Add';
-// locals
 import StringArrayEditor from './StringArrayEditor';
 const useStyles = makeStyles()(theme => ({
     card: {
@@ -40,13 +38,15 @@ const StringArrayMapEditor = observer(function ({ slot, }) {
         React.createElement(Card, { raised: true, className: classes.card },
             React.createElement(CardHeader, { disableTypography: true, title: React.createElement(TextField, { fullWidth: true, value: value, placeholder: "add new", onChange: event => {
                         setValue(event.target.value);
-                    }, InputProps: {
-                        endAdornment: (React.createElement(InputAdornment, { position: "end" },
-                            React.createElement(IconButton, { disabled: value === '', onClick: () => {
-                                    slot.add(value, []);
-                                    setValue('');
-                                } },
-                                React.createElement(AddIcon, null)))),
+                    }, slotProps: {
+                        input: {
+                            endAdornment: (React.createElement(InputAdornment, { position: "end" },
+                                React.createElement(IconButton, { disabled: value === '', onClick: () => {
+                                        slot.add(value, []);
+                                        setValue('');
+                                    } },
+                                    React.createElement(AddIcon, null)))),
+                        },
                     } }) })),
         React.createElement(FormHelperText, null, slot.description)));
 });