@jbrowse/plugin-wiggle 2.11.2 → 2.12.0

package/dist/MultiLinearWiggleDisplay/components/DraggableDialog.js

@@ -1,9 +1,32 @@
 "use strict";
+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;
+});
+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 });
-const react_1 = __importDefault(require("react"));
+const react_1 = __importStar(require("react"));
 const material_1 = require("@mui/material");
 const mobx_react_1 = require("mobx-react");
 const mui_1 = require("tss-react/mui");
@@ -18,18 +41,19 @@ const useStyles = (0, mui_1.makeStyles)()(theme => ({
         color: theme.palette.grey[500],
     },
 }));
-// draggable dialog demo https://mui.com/material-ui/react-dialog/#draggable-dialog
 function PaperComponent(props) {
-    return (react_1.default.createElement(react_draggable_1.default, { handle: "#draggable-dialog-title", cancel: '[class*="MuiDialogContent-root"]' },
-        react_1.default.createElement(material_1.Paper, { ...props })));
+    const ref = (0, react_1.useRef)(null);
+    return (react_1.default.createElement(react_draggable_1.default, { nodeRef: ref, cancel: '[class*="MuiDialogContent-root"]', 
+        // @ts-expect-error
+        onStart: arg => { var _a, _b; return (_b = (_a = arg.target) === null || _a === void 0 ? void 0 : _a.className) === null || _b === void 0 ? void 0 : _b.includes('MuiDialogTitle'); } },
+        react_1.default.createElement(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 (react_1.default.createElement(material_1.Dialog, { ...props, PaperComponent: PaperComponent, "aria-labelledby": "draggable-dialog-title" // this area is important for the draggable functionality
-     },
+    return (react_1.default.createElement(material_1.Dialog, { ...props, PaperComponent: PaperComponent },
         react_1.default.createElement(material_1.ScopedCssBaseline, null,
-            react_1.default.createElement(material_1.DialogTitle, { style: { cursor: 'move' }, id: "draggable-dialog-title" },
+            react_1.default.createElement(material_1.DialogTitle, { style: { cursor: 'move' } },
                 title,
                 onClose ? (react_1.default.createElement(material_1.IconButton, { className: classes.closeButton, onClick: () => {
                         // @ts-expect-error

package/dist/MultiLinearWiggleDisplay/components/SourcesGrid.js

@@ -31,15 +31,15 @@ const material_1 = require("@mui/material");
 const util_1 = require("@jbrowse/core/util");
 const x_data_grid_1 = require("@mui/x-data-grid");
 const mui_1 = require("tss-react/mui");
-// locals
 const ColorPicker_1 = __importStar(require("@jbrowse/core/ui/ColorPicker"));
+const ui_1 = require("@jbrowse/core/ui");
+// locals
 const util_2 = require("./util");
 // icons
 const KeyboardDoubleArrowUp_1 = __importDefault(require("@mui/icons-material/KeyboardDoubleArrowUp"));
 const KeyboardDoubleArrowDown_1 = __importDefault(require("@mui/icons-material/KeyboardDoubleArrowDown"));
 const KeyboardArrowDown_1 = __importDefault(require("@mui/icons-material/KeyboardArrowDown"));
 const KeyboardArrowUp_1 = __importDefault(require("@mui/icons-material/KeyboardArrowUp"));
-const ui_1 = require("@jbrowse/core/ui");
 const useStyles = (0, mui_1.makeStyles)()({
     cell: {
         whiteSpace: 'nowrap',
@@ -51,7 +51,6 @@ function SourcesGrid({ rows, onChange, showTips, }) {
     const { classes } = useStyles();
     const [anchorEl, setAnchorEl] = (0, react_1.useState)(null);
     const [selected, setSelected] = (0, react_1.useState)([]);
-    // @ts-expect-error
     const { name: _name, color: _color, baseUri: _baseUri, ...rest } = rows[0];
     const [widgetColor, setWidgetColor] = (0, react_1.useState)('blue');
     const [currSort, setCurrSort] = (0, react_1.useState)({
@@ -100,33 +99,29 @@ function SourcesGrid({ rows, onChange, showTips, }) {
                     },
                     {
                         field: 'name',
-                        sortingOrder: [null],
                         headerName: 'Name',
                         width: (0, util_1.measureGridWidth)(rows.map(r => r.name)),
                     },
                     ...Object.keys(rest).map(val => ({
                         field: val,
-                        sortingOrder: [null],
-                        renderCell: (params) => {
-                            const { value } = params;
-                            return (react_1.default.createElement("div", { className: classes.cell },
-                                react_1.default.createElement(ui_1.SanitizedHTML, { html: (0, util_1.getStr)(value) })));
-                        },
-                        // @ts-ignore
-                        width: (0, util_1.measureGridWidth)(rows.map(r => r[val])),
+                        renderCell: ({ value }) => (react_1.default.createElement("div", { className: classes.cell },
+                            react_1.default.createElement(ui_1.SanitizedHTML, { html: (0, util_1.getStr)(value) }))),
+                        width: (0, util_1.measureGridWidth)(rows.map(r => `${r[val]}`)),
                     })),
                 ], sortModel: [
                 /* we control the sort as a controlled component using onSortModelChange */
                 ], onSortModelChange: args => {
                     const sort = args[0];
+                    // this idx%2 flip flops the sorting order, we could inspect args
+                    // for sort direction asc or desc but this is just a simplified
+                    // thing since we are controlling sort instead of the default data
+                    // grid sort anyways
                     const idx = (currSort.idx + 1) % 2;
                     const field = (sort === null || sort === void 0 ? void 0 : sort.field) || currSort.field;
                     setCurrSort({ idx, field });
                     onChange(field
                         ? [...rows].sort((a, b) => {
-                            // @ts-expect-error
                             const aa = (0, util_1.getStr)(a[field]);
-                            // @ts-expect-error
                             const bb = (0, util_1.getStr)(b[field]);
                             return idx === 1
                                 ? aa.localeCompare(bb)

package/dist/MultiWiggleAddTrackWorkflow/AddTrackWorkflow.js

@@ -80,7 +80,10 @@ function MultiWiggleWidget({ model }) {
                     bigWigs = JSON.parse(val);
                 }
                 catch (e) {
-                    bigWigs = val.split(/\n|\r\n|\r/);
+                    bigWigs = val
+                        .split(/\n|\r\n|\r/)
+                        .map(f => f.trim())
+                        .filter(f => !!f);
                 }
                 const obj = typeof bigWigs[0] === 'string'
                     ? { bigWigs }

package/dist/util.d.ts

@@ -9,6 +9,7 @@ export interface ScaleOpts {
     inverted?: boolean;
 }
 export interface Source {
+    baseUri?: string;
     name: string;
     color?: string;
     group?: string;

package/esm/MultiLinearWiggleDisplay/components/DraggableDialog.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useRef } from 'react';
 import { Dialog, DialogTitle, IconButton, Divider, Paper, ScopedCssBaseline, } from '@mui/material';
 import { observer } from 'mobx-react';
 import { makeStyles } from 'tss-react/mui';
@@ -13,18 +13,19 @@ const useStyles = makeStyles()(theme => ({
         color: theme.palette.grey[500],
     },
 }));
-// draggable dialog demo https://mui.com/material-ui/react-dialog/#draggable-dialog
 function PaperComponent(props) {
-    return (React.createElement(Draggable, { handle: "#draggable-dialog-title", cancel: '[class*="MuiDialogContent-root"]' },
-        React.createElement(Paper, { ...props })));
+    const ref = useRef(null);
+    return (React.createElement(Draggable, { nodeRef: ref, cancel: '[class*="MuiDialogContent-root"]', 
+        // @ts-expect-error
+        onStart: arg => { var _a, _b; return (_b = (_a = arg.target) === null || _a === void 0 ? void 0 : _a.className) === null || _b === void 0 ? void 0 : _b.includes('MuiDialogTitle'); } },
+        React.createElement(Paper, { ref: ref, ...props })));
 }
 const DraggableDialog = observer(function DraggableDialog(props) {
     const { classes } = useStyles();
     const { title, children, onClose } = props;
-    return (React.createElement(Dialog, { ...props, PaperComponent: PaperComponent, "aria-labelledby": "draggable-dialog-title" // this area is important for the draggable functionality
-     },
+    return (React.createElement(Dialog, { ...props, PaperComponent: PaperComponent },
         React.createElement(ScopedCssBaseline, null,
-            React.createElement(DialogTitle, { style: { cursor: 'move' }, id: "draggable-dialog-title" },
+            React.createElement(DialogTitle, { style: { cursor: 'move' } },
                 title,
                 onClose ? (React.createElement(IconButton, { className: classes.closeButton, onClick: () => {
                         // @ts-expect-error

package/esm/MultiLinearWiggleDisplay/components/SourcesGrid.js

@@ -3,15 +3,15 @@ import { Button } from '@mui/material';
 import { getStr, measureGridWidth } from '@jbrowse/core/util';
 import { DataGrid } from '@mui/x-data-grid';
 import { makeStyles } from 'tss-react/mui';
-// locals
 import ColorPicker, { ColorPopover } from '@jbrowse/core/ui/ColorPicker';
+import { SanitizedHTML } from '@jbrowse/core/ui';
+// locals
 import { moveUp, moveDown } from './util';
 // icons
 import KeyboardDoubleArrowUpIcon from '@mui/icons-material/KeyboardDoubleArrowUp';
 import KeyboardDoubleArrowDownIcon from '@mui/icons-material/KeyboardDoubleArrowDown';
 import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown';
 import KeyboardArrowUpIcon from '@mui/icons-material/KeyboardArrowUp';
-import { SanitizedHTML } from '@jbrowse/core/ui';
 const useStyles = makeStyles()({
     cell: {
         whiteSpace: 'nowrap',
@@ -23,7 +23,6 @@ function SourcesGrid({ rows, onChange, showTips, }) {
     const { classes } = useStyles();
     const [anchorEl, setAnchorEl] = useState(null);
     const [selected, setSelected] = useState([]);
-    // @ts-expect-error
     const { name: _name, color: _color, baseUri: _baseUri, ...rest } = rows[0];
     const [widgetColor, setWidgetColor] = useState('blue');
     const [currSort, setCurrSort] = useState({
@@ -72,33 +71,29 @@ function SourcesGrid({ rows, onChange, showTips, }) {
                     },
                     {
                         field: 'name',
-                        sortingOrder: [null],
                         headerName: 'Name',
                         width: measureGridWidth(rows.map(r => r.name)),
                     },
                     ...Object.keys(rest).map(val => ({
                         field: val,
-                        sortingOrder: [null],
-                        renderCell: (params) => {
-                            const { value } = params;
-                            return (React.createElement("div", { className: classes.cell },
-                                React.createElement(SanitizedHTML, { html: getStr(value) })));
-                        },
-                        // @ts-ignore
-                        width: measureGridWidth(rows.map(r => r[val])),
+                        renderCell: ({ value }) => (React.createElement("div", { className: classes.cell },
+                            React.createElement(SanitizedHTML, { html: getStr(value) }))),
+                        width: measureGridWidth(rows.map(r => `${r[val]}`)),
                     })),
                 ], sortModel: [
                 /* we control the sort as a controlled component using onSortModelChange */
                 ], onSortModelChange: args => {
                     const sort = args[0];
+                    // this idx%2 flip flops the sorting order, we could inspect args
+                    // for sort direction asc or desc but this is just a simplified
+                    // thing since we are controlling sort instead of the default data
+                    // grid sort anyways
                     const idx = (currSort.idx + 1) % 2;
                     const field = (sort === null || sort === void 0 ? void 0 : sort.field) || currSort.field;
                     setCurrSort({ idx, field });
                     onChange(field
                         ? [...rows].sort((a, b) => {
-                            // @ts-expect-error
                             const aa = getStr(a[field]);
-                            // @ts-expect-error
                             const bb = getStr(b[field]);
                             return idx === 1
                                 ? aa.localeCompare(bb)

package/esm/MultiWiggleAddTrackWorkflow/AddTrackWorkflow.js

@@ -55,7 +55,10 @@ export default function MultiWiggleWidget({ model }) {
                     bigWigs = JSON.parse(val);
                 }
                 catch (e) {
-                    bigWigs = val.split(/\n|\r\n|\r/);
+                    bigWigs = val
+                        .split(/\n|\r\n|\r/)
+                        .map(f => f.trim())
+                        .filter(f => !!f);
                 }
                 const obj = typeof bigWigs[0] === 'string'
                     ? { bigWigs }

package/esm/util.d.ts

@@ -9,6 +9,7 @@ export interface ScaleOpts {
     inverted?: boolean;
 }
 export interface Source {
+    baseUri?: string;
     name: string;
     color?: string;
     group?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jbrowse/plugin-wiggle",
-  "version": "2.11.2",
+  "version": "2.12.0",
   "description": "JBrowse 2 wiggle adapters, tracks, etc.",
   "keywords": [
     "jbrowse",
@@ -66,5 +66,5 @@
   "distModule": "esm/index.js",
   "srcModule": "src/index.ts",
   "module": "esm/index.js",
-  "gitHead": "511048cb6965f0bf624c96de244e7fd47fce17d6"
+  "gitHead": "935f2602d29abc737bb1f493a922b6218d023ae2"
 }