@jbrowse/core 2.4.2 → 2.6.0

package/BaseFeatureWidget/BaseFeatureDetail.js

@@ -1,378 +0,0 @@
-"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 });
-exports.FeatureDetails = exports.BaseAttributes = exports.Attributes = exports.UriLink = exports.BaseCoreDetails = exports.SimpleValue = exports.BasicValue = exports.FieldName = exports.BaseCard = exports.useStyles = void 0;
-/* eslint-disable @typescript-eslint/no-explicit-any */
-const react_1 = __importStar(require("react"));
-const react_error_boundary_1 = require("react-error-boundary");
-const material_1 = require("@mui/material");
-const mui_1 = require("tss-react/mui");
-const x_data_grid_1 = require("@mui/x-data-grid");
-const mobx_react_1 = require("mobx-react");
-const is_object_1 = __importDefault(require("is-object"));
-// icons
-const ExpandMore_1 = __importDefault(require("@mui/icons-material/ExpandMore"));
-// locals
-const util_1 = require("../util");
-const ui_1 = require("../ui");
-const SequenceFeatureDetails_1 = __importDefault(require("./SequenceFeatureDetails"));
-const util_2 = require("./util");
-const MAX_FIELD_NAME_WIDTH = 170;
-// these are always omitted as too detailed
-const globalOmit = [
-    '__jbrowsefmt',
-    'length',
-    'position',
-    'subfeatures',
-    'uniqueId',
-    'exonFrames',
-    'parentId',
-    'thickStart',
-    'thickEnd',
-];
-// coreDetails are omitted in some circumstances
-const coreDetails = [
-    'name',
-    'start',
-    'end',
-    'strand',
-    'refName',
-    'description',
-    'type',
-];
-exports.useStyles = (0, mui_1.makeStyles)()(theme => {
-    var _a;
-    return ({
-        expansionPanelDetails: {
-            display: 'block',
-            padding: theme.spacing(1),
-        },
-        expandIcon: {
-            color: ((_a = theme.palette.tertiary) === null || _a === void 0 ? void 0 : _a.contrastText) || '#fff',
-        },
-        field: {
-            display: 'flex',
-            flexWrap: 'wrap',
-        },
-        fieldDescription: {
-            '&:hover': {
-                background: theme.palette.mode === 'dark' ? '#e65100' : 'yellow',
-            },
-        },
-        fieldName: {
-            wordBreak: 'break-all',
-            minWidth: 90,
-            borderBottom: '1px solid #0003',
-            fontSize: 12,
-            background: theme.palette.action.disabledBackground,
-            marginRight: theme.spacing(1),
-            padding: theme.spacing(0.5),
-        },
-        fieldValue: {
-            wordBreak: 'break-word',
-            maxHeight: 300,
-            fontSize: 12,
-            padding: theme.spacing(0.5),
-            overflow: 'auto',
-        },
-        fieldSubvalue: {
-            wordBreak: 'break-word',
-            maxHeight: 300,
-            padding: theme.spacing(0.5),
-            background: theme.palette.action.disabledBackground,
-            border: `1px solid ${theme.palette.action.disabledBackground}`,
-            boxSizing: 'border-box',
-            overflow: 'auto',
-        },
-    });
-});
-function BaseCard({ children, title, defaultExpanded = true, }) {
-    const { classes } = (0, exports.useStyles)();
-    const [expanded, setExpanded] = (0, react_1.useState)(defaultExpanded);
-    return (react_1.default.createElement(material_1.Accordion, { expanded: expanded, onChange: () => setExpanded(s => !s), TransitionProps: { unmountOnExit: true, timeout: 150 } },
-        react_1.default.createElement(material_1.AccordionSummary, { expandIcon: react_1.default.createElement(ExpandMore_1.default, { className: classes.expandIcon }) },
-            react_1.default.createElement(material_1.Typography, { variant: "button" },
-                " ",
-                title)),
-        react_1.default.createElement(material_1.AccordionDetails, { className: classes.expansionPanelDetails }, children)));
-}
-exports.BaseCard = BaseCard;
-const FieldName = ({ description, name, width, prefix = [], }) => {
-    const { classes, cx } = (0, exports.useStyles)();
-    const val = [...prefix, name].join('.');
-    return description ? (react_1.default.createElement(material_1.Tooltip, { title: description, placement: "left" },
-        react_1.default.createElement("div", { className: cx(classes.fieldDescription, classes.fieldName) }, val))) : (react_1.default.createElement("div", { className: classes.fieldName, style: { width: width } }, val));
-};
-exports.FieldName = FieldName;
-const BasicValue = ({ value }) => {
-    const { classes } = (0, exports.useStyles)();
-    const isLink = `${value}`.match(/^https?:\/\//);
-    return (react_1.default.createElement("div", { className: classes.fieldValue }, react_1.default.isValidElement(value) ? (value) : isLink ? (react_1.default.createElement(material_1.Link, { href: `${value}` }, `${value}`)) : (react_1.default.createElement(ui_1.SanitizedHTML, { html: (0, is_object_1.default)(value) ? JSON.stringify(value) : String(value) }))));
-};
-exports.BasicValue = BasicValue;
-function SimpleValue({ name, value, description, prefix, width, }) {
-    const { classes } = (0, exports.useStyles)();
-    return value !== null && value !== undefined ? (react_1.default.createElement("div", { className: classes.field },
-        react_1.default.createElement(exports.FieldName, { prefix: prefix, description: description, name: name, width: width }),
-        react_1.default.createElement(exports.BasicValue, { value: value }))) : null;
-}
-exports.SimpleValue = SimpleValue;
-function ArrayValue({ name, value, description, prefix = [], }) {
-    const { classes } = (0, exports.useStyles)();
-    if (value.length === 1) {
-        return (0, is_object_1.default)(value[0]) ? (react_1.default.createElement(Attributes, { attributes: value[0], prefix: [...prefix, name] })) : (react_1.default.createElement("div", { className: classes.field },
-            react_1.default.createElement(exports.FieldName, { prefix: prefix, description: description, name: name }),
-            react_1.default.createElement(exports.BasicValue, { value: value[0] })));
-    }
-    else if (value.every(val => (0, is_object_1.default)(val))) {
-        return (react_1.default.createElement(react_1.default.Fragment, null, value.map((val, i) => (react_1.default.createElement(Attributes, { key: JSON.stringify(val) + '-' + i, attributes: val, prefix: [...prefix, name + '-' + i] })))));
-    }
-    else {
-        return (react_1.default.createElement("div", { className: classes.field },
-            react_1.default.createElement(exports.FieldName, { prefix: prefix, description: description, name: name }),
-            value.map((val, i) => (react_1.default.createElement("div", { key: JSON.stringify(val) + '-' + i, className: classes.fieldSubvalue },
-                react_1.default.createElement(exports.BasicValue, { value: val }))))));
-    }
-}
-const toLocale = (n) => n.toLocaleString('en-US');
-function Position(props) {
-    const { feature } = props;
-    const strand = feature.strand;
-    const strandMap = {
-        '-1': '-',
-        '0': '',
-        '1': '+',
-    };
-    const str = strandMap[strand] ? `(${strandMap[strand]})` : '';
-    // @ts-expect-error
-    const loc = (0, util_1.assembleLocString)(feature);
-    return react_1.default.createElement(react_1.default.Fragment, null, `${loc} ${str}`);
-}
-function CoreDetails(props) {
-    const { feature } = props;
-    const obj = feature;
-    // eslint-disable-next-line no-underscore-dangle
-    const formattedFeat = { ...obj, ...obj.__jbrowsefmt };
-    const { start, end } = formattedFeat;
-    const displayedDetails = {
-        ...formattedFeat,
-        length: toLocale(end - start),
-    };
-    const coreRenderedDetails = {
-        description: 'Description',
-        name: 'Name',
-        length: 'Length',
-        type: 'Type',
-    };
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(SimpleValue, { name: "Position", value: react_1.default.createElement(Position, { ...props, feature: formattedFeat }) }),
-        Object.entries(coreRenderedDetails)
-            .map(([key, name]) => [name, displayedDetails[key]])
-            .filter(([, value]) => value != null)
-            .map(([name, value]) => (react_1.default.createElement(SimpleValue, { key: name, name: name, value: value })))));
-}
-const BaseCoreDetails = (props) => {
-    return (react_1.default.createElement(BaseCard, { ...props, title: "Primary data" },
-        react_1.default.createElement(CoreDetails, { ...props })));
-};
-exports.BaseCoreDetails = BaseCoreDetails;
-function UriLink({ value, }) {
-    const href = (0, util_1.getUriLink)(value);
-    return react_1.default.createElement(ui_1.SanitizedHTML, { html: `<a href="${href}">${href}</a>` });
-}
-exports.UriLink = UriLink;
-function DataGridDetails({ value, prefix, name, }) {
-    const keys = Object.keys(value[0]).sort();
-    const unionKeys = new Set(keys);
-    for (const val of value) {
-        for (const k of Object.keys(val)) {
-            unionKeys.add(k);
-        }
-    }
-    if (unionKeys.size < keys.length + 5) {
-        // avoids key 'id' from being used in row data
-        const rows = Object.entries(value).map(([k, val]) => {
-            const { id, ...rest } = val;
-            return {
-                id: k,
-                identifier: id,
-                ...rest,
-            };
-        });
-        // avoids key 'id' from being used in column names, and tries
-        // to make it at the start of the colNames array
-        let colNames;
-        if (unionKeys.has('id')) {
-            unionKeys.delete('id');
-            colNames = ['identifier', ...unionKeys];
-        }
-        else {
-            colNames = [...unionKeys];
-        }
-        const columns = colNames.map(val => ({
-            field: val,
-            renderCell: (params) => {
-                const { value } = params;
-                return (0, util_1.isUriLocation)(value) ? react_1.default.createElement(UriLink, { value: value }) : (0, util_1.getStr)(value);
-            },
-            width: (0, util_1.measureGridWidth)(rows.map(r => r[val])),
-        }));
-        const rowHeight = 25;
-        const hideFoot = rows.length < 100;
-        const headHeight = 80;
-        const height = Math.min(rows.length, 100) * rowHeight + headHeight + (hideFoot ? 0 : 50);
-        // disableSelection on click helps avoid
-        // https://github.com/mui-org/material-ui-x/issues/1197
-        return (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement(exports.FieldName, { prefix: prefix, name: name }),
-            react_1.default.createElement("div", { style: {
-                    height,
-                    width: '100%',
-                } },
-                react_1.default.createElement(x_data_grid_1.DataGrid, { disableSelectionOnClick: true, rowHeight: rowHeight, rows: rows, hideFooterSelectedRowCount: true, columns: columns, hideFooter: hideFoot }))));
-    }
-    return null;
-}
-// pick using a path from an object, similar to _.get from lodash with special logic
-// for Descriptions from e.g. VCF headers
-// @param arr  example ['a','b'], obj = {a:{b:'hello}}
-// @returns hello (with special addition to grab description also)
-function accessNested(arr, obj = {}) {
-    arr.forEach(elt => {
-        if (obj) {
-            obj = obj[elt];
-        }
-    });
-    return typeof obj === 'string'
-        ? obj
-        : typeof (obj === null || obj === void 0 ? void 0 : obj.Description) === 'string'
-            ? obj.Description
-            : undefined;
-}
-function generateMaxWidth(array, prefix) {
-    const arr = [];
-    array.forEach(key => {
-        const val = [...prefix, key[0]].join('.');
-        arr.push((0, util_1.measureText)(val, 12));
-    });
-    return Math.ceil(Math.max(...arr)) + 10;
-}
-function UriAttribute({ value, prefix, name, }) {
-    const { classes } = (0, exports.useStyles)();
-    const { uri, baseUri = '' } = value;
-    let href;
-    try {
-        href = new URL(uri, baseUri).href;
-    }
-    catch (e) {
-        href = uri;
-    }
-    return (react_1.default.createElement("div", { className: classes.field },
-        react_1.default.createElement(exports.FieldName, { prefix: prefix, name: name }),
-        react_1.default.createElement(exports.BasicValue, { value: href })));
-}
-function Attributes(props) {
-    const { attributes, omit = [], omitSingleLevel = [], descriptions, formatter = val => val, hideUris, prefix = [], } = props;
-    const omits = new Set([...omit, ...globalOmit, ...omitSingleLevel]);
-    const { __jbrowsefmt, ...rest } = attributes;
-    const formattedAttributes = { ...rest, ...__jbrowsefmt };
-    const maxLabelWidth = generateMaxWidth(Object.entries(formattedAttributes).filter(([k, v]) => v !== undefined && !omits.has(k)), prefix);
-    return (react_1.default.createElement(react_1.default.Fragment, null, Object.entries(formattedAttributes)
-        .filter(([k, v]) => v !== undefined && !omits.has(k))
-        .map(([key, value]) => {
-        const description = accessNested([...prefix, key], descriptions);
-        if (Array.isArray(value)) {
-            // check if it looks like an array of objects, which could be used
-            // in data grid
-            return value.length > 1 && value.every(val => (0, is_object_1.default)(val)) ? (react_1.default.createElement(DataGridDetails, { key: key, name: key, prefix: prefix, value: value })) : (react_1.default.createElement(ArrayValue, { key: key, name: key, value: value, description: description, prefix: prefix }));
-        }
-        else if ((0, is_object_1.default)(value)) {
-            const { omitSingleLevel, ...rest } = props;
-            return (0, util_1.isUriLocation)(value) ? (hideUris ? null : (react_1.default.createElement(UriAttribute, { key: key, name: key, prefix: prefix, value: value }))) : (react_1.default.createElement(Attributes, { ...rest, key: key, attributes: value, descriptions: descriptions, prefix: [...prefix, key] }));
-        }
-        else {
-            return (react_1.default.createElement(SimpleValue, { key: key, name: key, value: formatter(value, key), description: description, prefix: prefix, width: Math.min(maxLabelWidth, MAX_FIELD_NAME_WIDTH) }));
-        }
-    })));
-}
-exports.Attributes = Attributes;
-const BaseAttributes = (props) => {
-    const { feature } = props;
-    return (react_1.default.createElement(BaseCard, { ...props, title: "Attributes" },
-        react_1.default.createElement(Attributes, { ...props, attributes: feature })));
-};
-exports.BaseAttributes = BaseAttributes;
-function isEmpty(obj) {
-    return Object.keys(obj).length === 0;
-}
-function generateTitle(name, id, type) {
-    return [(0, util_2.ellipses)(`${name}` || `${id}`), `${type}`]
-        .filter(f => !!f)
-        .join(' - ');
-}
-function FeatureDetails(props) {
-    const { omit = [], model, feature, depth = 0 } = props;
-    const { mate, name = '', id = '', type = '', subfeatures } = feature;
-    const pm = (0, util_1.getEnv)(model).pluginManager;
-    const session = (0, util_1.getSession)(model);
-    const ExtraPanel = pm.evaluateExtensionPoint('Core-extraFeaturePanel', null, {
-        session,
-        feature,
-        model,
-    });
-    return (react_1.default.createElement(BaseCard, { title: generateTitle(name, id, type) },
-        react_1.default.createElement(material_1.Typography, null, "Core details"),
-        react_1.default.createElement(CoreDetails, { ...props }),
-        mate ? (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement(material_1.Divider, null),
-            react_1.default.createElement(material_1.Typography, null, "Mate details"),
-            react_1.default.createElement(CoreDetails, { ...props, feature: mate }))) : null,
-        react_1.default.createElement(material_1.Divider, null),
-        react_1.default.createElement(material_1.Typography, null, "Attributes"),
-        react_1.default.createElement(Attributes, { attributes: feature, ...props, omit: omit, omitSingleLevel: coreDetails }),
-        react_1.default.createElement(react_error_boundary_1.ErrorBoundary, { FallbackComponent: ({ error }) => react_1.default.createElement(ui_1.ErrorMessage, { error: error }) },
-            react_1.default.createElement(SequenceFeatureDetails_1.default, { ...props })),
-        ExtraPanel ? (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement(material_1.Divider, null),
-            react_1.default.createElement(BaseCard, { title: ExtraPanel.name },
-                react_1.default.createElement(ExtraPanel.Component, { ...props })))) : null,
-        (subfeatures === null || subfeatures === void 0 ? void 0 : subfeatures.length) ? (react_1.default.createElement(BaseCard, { title: "Subfeatures", defaultExpanded: depth < 1 }, subfeatures.map(sub => (react_1.default.createElement(FeatureDetails, { key: JSON.stringify(sub), feature: sub, model: model, depth: depth + 1 }))))) : null));
-}
-exports.FeatureDetails = FeatureDetails;
-exports.default = (0, mobx_react_1.observer)(function ({ model }) {
-    const { featureData } = model;
-    if (!featureData) {
-        return null;
-    }
-    // replacing undefined with null helps with allowing fields to be hidden,
-    // setting null is not allowed by jexl so we set it to undefined to hide. see
-    // config guide. this replacement happens both here and when snapshotting the
-    // featureData
-    const g = JSON.parse(JSON.stringify(featureData, (_, v) => (v === undefined ? null : v)));
-    return isEmpty(g) ? null : react_1.default.createElement(FeatureDetails, { model: model, feature: g });
-});

package/BaseFeatureWidget/SequenceBox.d.ts

@@ -1,29 +0,0 @@
-/// <reference types="react" />
-import { Feat } from './util';
-export declare function GeneCDS({ cds, sequence }: {
-    cds: Feat[];
-    sequence: string;
-}): JSX.Element;
-export declare function GeneProtein({ cds, sequence, codonTable, }: {
-    cds: Feat[];
-    sequence: string;
-    codonTable: {
-        [key: string]: string;
-    };
-}): JSX.Element;
-export declare function GenecDNA({ utr, cds, exons, sequence, upstream, downstream, includeIntrons, collapseIntron, intronBp, }: {
-    utr: Feat[];
-    cds: Feat[];
-    exons: Feat[];
-    sequence: string;
-    upstream?: string;
-    downstream?: string;
-    includeIntrons?: boolean;
-    collapseIntron?: boolean;
-    intronBp: number;
-}): JSX.Element;
-export declare function Genomic({ sequence, upstream, downstream, }: {
-    sequence: string;
-    upstream?: string;
-    downstream?: string;
-}): JSX.Element;

package/BaseFeatureWidget/SequenceBox.js

@@ -1,63 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Genomic = exports.GenecDNA = exports.GeneProtein = exports.GeneCDS = void 0;
-const react_1 = __importDefault(require("react"));
-const util_1 = require("./util");
-// note that these are currently put into the style section instead of being
-// defined in classes to aid copy and paste to an external document e.g. word
-const proteinColor = 'rgb(220,160,220)';
-const intronColor = undefined;
-const cdsColor = 'rgb(220,220,180)';
-const updownstreamColor = 'rgba(250,200,200)';
-const utrColor = 'rgb(200,240,240)';
-const genomeColor = 'rgb(200,280,200)';
-function GeneCDS({ cds, sequence }) {
-    return react_1.default.createElement("span", { style: { background: cdsColor } }, (0, util_1.stitch)(cds, sequence));
-}
-exports.GeneCDS = GeneCDS;
-function GeneProtein({ cds, sequence, codonTable, }) {
-    const str = (0, util_1.stitch)(cds, sequence);
-    let protein = '';
-    for (let i = 0; i < str.length; i += 3) {
-        // use & symbol for undefined codon, or partial slice
-        protein += codonTable[str.slice(i, i + 3)] || '&';
-    }
-    return react_1.default.createElement("span", { style: { background: proteinColor } }, protein);
-}
-exports.GeneProtein = GeneProtein;
-function GenecDNA({ utr, cds, exons, sequence, upstream, downstream, includeIntrons, collapseIntron, intronBp, }) {
-    const chunks = (cds.length ? [...cds, ...utr].sort((a, b) => a.start - b.start) : exons).filter(f => f.start !== f.end);
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        upstream ? (react_1.default.createElement("span", { style: {
-                background: updownstreamColor,
-            } }, upstream)) : null,
-        chunks.map((chunk, idx) => {
-            var _a;
-            const intron = sequence.slice(chunk.end, (_a = chunks[idx + 1]) === null || _a === void 0 ? void 0 : _a.start);
-            return (react_1.default.createElement(react_1.default.Fragment, { key: JSON.stringify(chunk) },
-                react_1.default.createElement("span", { style: {
-                        background: chunk.type === 'CDS' ? cdsColor : utrColor,
-                    } }, sequence.slice(chunk.start, chunk.end)),
-                includeIntrons && idx < chunks.length - 1 ? (react_1.default.createElement("span", { style: { background: intronColor } }, collapseIntron && intron.length > intronBp * 2
-                    ? `${intron.slice(0, intronBp)}...${intron.slice(-intronBp)}`
-                    : intron)) : null));
-        }),
-        downstream ? (react_1.default.createElement("span", { style: { background: updownstreamColor } }, downstream)) : null));
-}
-exports.GenecDNA = GenecDNA;
-function Genomic({ sequence, upstream, downstream, }) {
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        upstream ? (react_1.default.createElement("span", { style: {
-                background: updownstreamColor,
-            } }, upstream)) : null,
-        react_1.default.createElement("span", { style: {
-                background: genomeColor,
-            } }, sequence),
-        downstream ? (react_1.default.createElement("span", { style: {
-                background: updownstreamColor,
-            } }, downstream)) : null));
-}
-exports.Genomic = Genomic;

package/BaseFeatureWidget/SequenceFeatureDetails.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-import { BaseProps } from './types';
-export default function SequenceFeatureDetails({ model, feature }: BaseProps): JSX.Element | null;