@jbrowse/plugin-config
Version:
JBrowse 2 config utilities
49 lines (48 loc) • 3.37 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const Add_1 = __importDefault(require("@mui/icons-material/Add"));
const Delete_1 = __importDefault(require("@mui/icons-material/Delete"));
const material_1 = require("@mui/material");
const mobx_react_1 = require("mobx-react");
const mui_1 = require("tss-react/mui");
const StringArrayEditor_1 = __importDefault(require("./StringArrayEditor"));
const useStyles = (0, mui_1.makeStyles)()(theme => ({
card: {
marginTop: theme.spacing(1),
},
}));
const StringArrayMapEditor = (0, mobx_react_1.observer)(function ({ slot, }) {
const { classes } = useStyles();
const [value, setValue] = (0, react_1.useState)('');
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.InputLabel, { children: slot.name }), [...slot.value].map(([key, val]) => ((0, jsx_runtime_1.jsxs)(material_1.Card, { raised: true, className: classes.card, children: [(0, jsx_runtime_1.jsx)(material_1.CardHeader, { title: key, action: (0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: () => {
slot.remove(key);
}, children: (0, jsx_runtime_1.jsx)(Delete_1.default, {}) }) }), (0, jsx_runtime_1.jsx)(material_1.CardContent, { children: (0, jsx_runtime_1.jsx)(StringArrayEditor_1.default, { slot: {
name: slot.name,
value: val,
description: `Values associated with entry ${key}`,
setAtIndex: (idx, val) => {
slot.setAtKeyIndex(key, idx, val);
},
removeAtIndex: (idx) => {
slot.removeAtKeyIndex(key, idx);
},
add: (val) => {
slot.addToKey(key, val);
},
} }) })] }, key))), (0, jsx_runtime_1.jsx)(material_1.Card, { raised: true, className: classes.card, children: (0, jsx_runtime_1.jsx)(material_1.CardHeader, { disableTypography: true, title: (0, jsx_runtime_1.jsx)(material_1.TextField, { fullWidth: true, value: value, placeholder: "add new", onChange: event => {
setValue(event.target.value);
}, slotProps: {
input: {
endAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, { position: "end", children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { disabled: value === '', onClick: () => {
slot.add(value, []);
setValue('');
}, children: (0, jsx_runtime_1.jsx)(Add_1.default, {}) }) })),
},
} }) }) }), (0, jsx_runtime_1.jsx)(material_1.FormHelperText, { children: slot.description })] }));
});
exports.default = StringArrayMapEditor;