@jbrowse/core
Version:
JBrowse 2 core libraries used by plugins
33 lines (32 loc) • 2.01 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 Close_1 = __importDefault(require("@mui/icons-material/Close"));
const material_1 = require("@mui/material");
const mobx_react_1 = require("mobx-react");
const react_draggable_1 = __importDefault(require("react-draggable"));
const mui_1 = require("tss-react/mui");
const useStyles = (0, mui_1.makeStyles)()(theme => ({
closeButton: {
position: 'absolute',
right: theme.spacing(1),
top: theme.spacing(1),
color: theme.palette.grey[500],
},
}));
function PaperComponent(props) {
const ref = (0, react_1.useRef)(null);
return ((0, jsx_runtime_1.jsx)(react_draggable_1.default, { nodeRef: ref, cancel: '[class*="MuiDialogContent-root"]', onStart: arg => { var _a; return `${(_a = arg.target) === null || _a === void 0 ? void 0 : _a.className}`.includes('MuiDialogTitle'); }, children: (0, jsx_runtime_1.jsx)(material_1.Paper, { ref: ref, ...props }) }));
}
const DraggableDialog = (0, mobx_react_1.observer)(function DraggableDialog(props) {
const { classes } = useStyles();
const { title, children, onClose } = props;
return ((0, jsx_runtime_1.jsx)(material_1.Dialog, { ...props, PaperComponent: PaperComponent, children: (0, jsx_runtime_1.jsxs)(material_1.ScopedCssBaseline, { children: [(0, jsx_runtime_1.jsxs)(material_1.DialogTitle, { style: { cursor: 'move' }, children: [title, onClose ? ((0, jsx_runtime_1.jsx)(material_1.IconButton, { className: classes.closeButton, onClick: () => {
onClose();
}, children: (0, jsx_runtime_1.jsx)(Close_1.default, {}) })) : null] }), (0, jsx_runtime_1.jsx)(material_1.Divider, {}), children] }) }));
});
exports.default = DraggableDialog;