@jbrowse/plugin-alignments 2.4.2 → 2.6.0

package/esm/util.d.ts

@@ -1,6 +1,7 @@
 import { BaseFeatureDataAdapter } from '@jbrowse/core/data_adapters/BaseAdapter';
-import { Feature } from '@jbrowse/core/util/simpleFeature';
-import { AugmentedRegion } from '@jbrowse/core/util';
+import { Feature, AugmentedRegion } from '@jbrowse/core/util';
+import { IAnyStateTreeNode } from 'mobx-state-tree';
+import { IAutorunOptions } from 'mobx';
 export declare function getTag(feature: Feature, tag: string): any;
 export declare function getTagAlt(feature: Feature, tag: string, alt: string): any;
 export declare const orientationTypes: {
@@ -14,6 +15,19 @@ export declare const orientationTypes: {
         [key: string]: string;
     };
 };
+export declare const pairMap: {
+    readonly LR: "color_pair_lr";
+    readonly LL: "color_pair_ll";
+    readonly RR: "color_pair_rr";
+    readonly RL: "color_pair_rl";
+};
 export declare function getColorWGBS(strand: number, base: string): "#f00" | "#00f" | "#888";
 export declare function fetchSequence(region: AugmentedRegion, adapter: BaseFeatureDataAdapter): Promise<any>;
 export declare function shouldFetchReferenceSequence(type?: string): boolean;
+export declare const modificationColors: Record<string, string | undefined>;
+type DisplayModel = IAnyStateTreeNode & {
+    setError: (arg: unknown) => void;
+};
+export declare function createAutorun(self: DisplayModel, cb: () => Promise<void>, opts?: IAutorunOptions): void;
+export declare function randomColor(): string;
+export {};

package/esm/util.js

@@ -1,15 +1,18 @@
 import { toArray } from 'rxjs/operators';
 import { firstValueFrom } from 'rxjs';
+import { addDisposer, isAlive } from 'mobx-state-tree';
+import { autorun } from 'mobx';
 // get tag from BAM or CRAM feature, where CRAM uses feature.get('tags') and
 // BAM does not
 export function getTag(feature, tag) {
     const tags = feature.get('tags');
-    return tags ? tags[tag] : feature.get(tag);
+    return tags !== undefined ? tags[tag] : feature.get(tag);
 }
 // use fallback alt tag, used in situations where upper case/lower case tags
 // exist e.g. Mm/MM for base modifications
 export function getTagAlt(feature, tag, alt) {
-    return getTag(feature, tag) || getTag(feature, alt);
+    var _a;
+    return (_a = getTag(feature, tag)) !== null && _a !== void 0 ? _a : getTag(feature, alt);
 }
 // orientation definitions from igv.js, see also
 // https://software.broadinstitute.org/software/igv/interpreting_pair_orientations
@@ -45,6 +48,12 @@ export const orientationTypes = {
         F1F2: 'RL',
     },
 };
+export const pairMap = {
+    LR: 'color_pair_lr',
+    LL: 'color_pair_ll',
+    RR: 'color_pair_rr',
+    RL: 'color_pair_rl',
+};
 export function getColorWGBS(strand, base) {
     if (strand === 1) {
         if (base === 'C') {
@@ -64,14 +73,17 @@ export function getColorWGBS(strand, base) {
     }
     return '#888';
 }
+// fetches region sequence augmenting by +/- 1bp for CpG on either side of
+// requested region
 export async function fetchSequence(region, adapter) {
     var _a;
-    const { end, originalRefName, refName } = region;
+    const { start, end, originalRefName, refName } = region;
     const feats = await firstValueFrom(adapter
         .getFeatures({
         ...region,
         refName: originalRefName || refName,
         end: end + 1,
+        start: Math.max(0, start - 1),
     })
         .pipe(toArray()));
     return (_a = feats[0]) === null || _a === void 0 ? void 0 : _a.get('seq');
@@ -80,4 +92,31 @@ export async function fetchSequence(region, adapter) {
 export function shouldFetchReferenceSequence(type) {
     return type === 'methylation';
 }
+// adapted from IGV
+// https://github.com/igvteam/igv/blob/e803e3af2d8c9ea049961dfd4628146bdde9a574/src/main/java/org/broad/igv/sam/mods/BaseModificationColors.java#L27
+export const modificationColors = {
+    m: 'rgb(255,0,0)',
+    h: 'rgb(11, 132, 165)',
+    o: 'rgb(111, 78, 129)',
+    f: 'rgb(246, 200, 95)',
+    c: 'rgb(157, 216, 102)',
+    g: 'rgb(255, 160, 86)',
+    e: 'rgb(141, 221, 208)',
+    b: 'rgb(202, 71, 47)',
+};
+export function createAutorun(self, cb, opts) {
+    addDisposer(self, autorun(async () => {
+        try {
+            await cb();
+        }
+        catch (e) {
+            if (isAlive(self)) {
+                self.setError(e);
+            }
+        }
+    }, opts));
+}
+export function randomColor() {
+    return `hsl(${Math.random() * 200}, 50%, 50%)`;
+}
 //# sourceMappingURL=util.js.map

package/esm/util.js.map

@@ -1 +1 @@
-{"version":3,"file":"util.js","sourceRoot":"","sources":["../src/util.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAA;AAGxC,OAAO,EAAE,cAAc,EAAE,MAAM,MAAM,CAAA;AACrC,4EAA4E;AAC5E,eAAe;AACf,MAAM,UAAU,MAAM,CAAC,OAAgB,EAAE,GAAW;IAClD,MAAM,IAAI,GAAG,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,CAAA;IAChC,OAAO,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;AAC5C,CAAC;AAED,4EAA4E;AAC5E,0CAA0C;AAC1C,MAAM,UAAU,SAAS,CAAC,OAAgB,EAAE,GAAW,EAAE,GAAW;IAClE,OAAO,MAAM,CAAC,OAAO,EAAE,GAAG,CAAC,IAAI,MAAM,CAAC,OAAO,EAAE,GAAG,CAAC,CAAA;AACrD,CAAC;AAED,gDAAgD;AAChD,kFAAkF;AAClF,MAAM,CAAC,MAAM,gBAAgB,GAAG;IAC9B,EAAE,EAAE;QACF,IAAI,EAAE,IAAI;QACV,IAAI,EAAE,IAAI;QAEV,IAAI,EAAE,IAAI;QACV,IAAI,EAAE,IAAI;QAEV,IAAI,EAAE,IAAI;QACV,IAAI,EAAE,IAAI;QAEV,IAAI,EAAE,IAAI;QACV,IAAI,EAAE,IAAI;KACkB;IAE9B,EAAE,EAAE;QACF,IAAI,EAAE,IAAI;QACV,IAAI,EAAE,IAAI;QAEV,IAAI,EAAE,IAAI;QACV,IAAI,EAAE,IAAI;QAEV,IAAI,EAAE,IAAI;QACV,IAAI,EAAE,IAAI;QAEV,IAAI,EAAE,IAAI;QACV,IAAI,EAAE,IAAI;KACkB;IAE9B,EAAE,EAAE;QACF,IAAI,EAAE,IAAI;QACV,IAAI,EAAE,IAAI;QAEV,IAAI,EAAE,IAAI;QACV,IAAI,EAAE,IAAI;QAEV,IAAI,EAAE,IAAI;QACV,IAAI,EAAE,IAAI;QAEV,IAAI,EAAE,IAAI;QACV,IAAI,EAAE,IAAI;KACkB;CAC/B,CAAA;AAED,MAAM,UAAU,YAAY,CAAC,MAAc,EAAE,IAAY;IACvD,IAAI,MAAM,KAAK,CAAC,EAAE;QAChB,IAAI,IAAI,KAAK,GAAG,EAAE;YAChB,OAAO,MAAM,CAAA;SACd;QACD,IAAI,IAAI,KAAK,GAAG,EAAE;YAChB,OAAO,MAAM,CAAA;SACd;KACF;SAAM,IAAI,MAAM,KAAK,CAAC,CAAC,EAAE;QACxB,IAAI,IAAI,KAAK,GAAG,EAAE;YAChB,OAAO,MAAM,CAAA;SACd;QACD,IAAI,IAAI,KAAK,GAAG,EAAE;YAChB,OAAO,MAAM,CAAA;SACd;KACF;IACD,OAAO,MAAM,CAAA;AACf,CAAC;AAED,MAAM,CAAC,KAAK,UAAU,aAAa,CACjC,MAAuB,EACvB,OAA+B;;IAE/B,MAAM,EAAE,GAAG,EAAE,eAAe,EAAE,OAAO,EAAE,GAAG,MAAM,CAAA;IAEhD,MAAM,KAAK,GAAG,MAAM,cAAc,CAChC,OAAO;SACJ,WAAW,CAAC;QACX,GAAG,MAAM;QACT,OAAO,EAAE,eAAe,IAAI,OAAO;QACnC,GAAG,EAAE,GAAG,GAAG,CAAC;KACb,CAAC;SACD,IAAI,CAAC,OAAO,EAAE,CAAC,CACnB,CAAA;IACD,OAAO,MAAA,KAAK,CAAC,CAAC,CAAC,0CAAE,GAAG,CAAC,KAAK,CAAC,CAAA;AAC7B,CAAC;AAED,kEAAkE;AAClE,MAAM,UAAU,4BAA4B,CAAC,IAAa;IACxD,OAAO,IAAI,KAAK,aAAa,CAAA;AAC/B,CAAC"}
+{"version":3,"file":"util.js","sourceRoot":"","sources":["../src/util.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jbrowse/plugin-alignments",
-  "version": "2.4.2",
+  "version": "2.6.0",
   "description": "JBrowse 2 alignments adapters, tracks, etc.",
   "keywords": [
     "jbrowse",
@@ -37,7 +37,7 @@
     "clean": "rimraf dist esm *.tsbuildinfo"
   },
   "dependencies": {
-    "@gmod/bam": "^1.1.15",
+    "@gmod/bam": "^2.0.0",
     "@gmod/cram": "^1.7.1",
     "@mui/icons-material": "^5.0.1",
     "canvas2svg": "^1.0.16",
@@ -65,5 +65,5 @@
   "distModule": "esm/index.js",
   "srcModule": "src/index.ts",
   "module": "esm/index.js",
-  "gitHead": "36e382a70e7d220343b873e7e6aba5c83e5342c8"
+  "gitHead": "9962c94711dd3386dcb76c16f3646937d9c4751a"
 }

package/src/AlignmentsFeatureDetail/AlignmentsFeatureFlags.tsx

@@ -1,10 +1,8 @@
 import React from 'react'
 import { Checkbox, FormControlLabel, FormGroup } from '@mui/material'
 import { makeStyles } from 'tss-react/mui'
-import {
-  BaseCard,
-  SimpleValue,
-} from '@jbrowse/core/BaseFeatureWidget/BaseFeatureDetail'
+import { BaseCard } from '@jbrowse/core/BaseFeatureWidget/BaseFeatureDetail'
+import SimpleField from '@jbrowse/core/BaseFeatureWidget/BaseFeatureDetail/SimpleField'
 
 const useStyles = makeStyles()({
   compact: {
@@ -36,7 +34,7 @@ export default function AlignmentFlags(props: { feature: { flags: number } }) {
 
   return (
     <BaseCard {...props} title="Flags">
-      <SimpleValue name="Flag" value={flags} />
+      <SimpleField name="Flag" value={flags} />
       <FormGroup>
         {flagNames.map((name, idx) => {
           const val = flags & (1 << idx)

package/src/AlignmentsFeatureDetail/__snapshots__/index.test.tsx.snap

@@ -280,7 +280,7 @@ exports[`open up a widget 1`] = `
                 </div>
               </div>
               <div
-                class="css-1upvn7b-container2"
+                class="css-1lttu3w-container"
               >
                 <button
                   class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium css-sghohy-MuiButtonBase-root-MuiButton-root"
@@ -316,7 +316,6 @@ exports[`open up a widget 1`] = `
                     />
                   </button>
                 </div>
-                <br />
               </div>
             </div>
           </div>

package/src/AlignmentsTrack/configSchemaF.ts

@@ -0,0 +1,22 @@
+import { ConfigurationSchema } from '@jbrowse/core/configuration'
+import { createBaseTrackConfig } from '@jbrowse/core/pluggableElementTypes'
+import PluginManager from '@jbrowse/core/PluginManager'
+
+/**
+ * #config AlignmentsTrack
+ * has very little config; most config and state logic is on the display
+ */
+function x() {} // eslint-disable-line @typescript-eslint/no-unused-vars
+
+export default function configSchemaFactory(pluginManager: PluginManager) {
+  return ConfigurationSchema(
+    'AlignmentsTrack',
+    {},
+    {
+      /**
+       * #baseConfiguration
+       */
+      baseConfiguration: createBaseTrackConfig(pluginManager),
+    },
+  )
+}

package/src/AlignmentsTrack/index.ts

@@ -1,32 +1,11 @@
 import PluginManager from '@jbrowse/core/PluginManager'
 import TrackType from '@jbrowse/core/pluggableElementTypes/TrackType'
-import { ConfigurationSchema } from '@jbrowse/core/configuration'
-import {
-  createBaseTrackConfig,
-  createBaseTrackModel,
-} from '@jbrowse/core/pluggableElementTypes/models'
+import { createBaseTrackModel } from '@jbrowse/core/pluggableElementTypes/models'
+import configSchemaF from './configSchemaF'
 
-/**
- * #config AlignmentsTrack
- * has very little config; most config and state logic is on the display
- */
-function x() {} // eslint-disable-line @typescript-eslint/no-unused-vars
-
-function configSchemaFactory(pluginManager: PluginManager) {
-  return ConfigurationSchema(
-    'AlignmentsTrack',
-    {},
-    {
-      /**
-       * #baseConfiguration
-       */
-      baseConfiguration: createBaseTrackConfig(pluginManager),
-    },
-  )
-}
 export default function register(pm: PluginManager) {
   pm.addTrackType(() => {
-    const configSchema = configSchemaFactory(pm)
+    const configSchema = configSchemaF(pm)
     const track = new TrackType({
       name: 'AlignmentsTrack',
       displayName: 'Alignments track',

package/src/BamAdapter/BamAdapter.ts

@@ -8,10 +8,10 @@ import { bytesForRegions, updateStatus, Feature } from '@jbrowse/core/util'
 import { openLocation } from '@jbrowse/core/util/io'
 import { ObservableCreate } from '@jbrowse/core/util/rxjs'
 import { toArray } from 'rxjs/operators'
+import { firstValueFrom } from 'rxjs'
 
 // locals
 import BamSlightlyLazyFeature from './BamSlightlyLazyFeature'
-import { firstValueFrom } from 'rxjs'
 
 interface Header {
   idToName: string[]
@@ -43,8 +43,6 @@ export default class BamAdapter extends BaseFeatureDataAdapter {
       // chunkSizeLimit and fetchSizeLimit are more troublesome than
       // helpful, and have given overly large values on the ultra long
       // nanopore reads even with 500MB limits, so disabled with infinity
-      chunkSizeLimit: Infinity,
-      fetchSizeLimit: Infinity,
       yieldThreadTime: Infinity,
     })
 
@@ -89,7 +87,7 @@ export default class BamAdapter extends BaseFeatureDataAdapter {
         const idToName: string[] = []
         const nameToId: Record<string, number> = {}
         samHeader
-          .filter(l => l.tag === 'SQ')
+          ?.filter(l => l.tag === 'SQ')
           .forEach((sqLine, refId) => {
             sqLine.data.forEach(item => {
               if (item.tag === 'SN') {
@@ -182,61 +180,65 @@ export default class BamAdapter extends BaseFeatureDataAdapter {
     return ObservableCreate<Feature>(async observer => {
       const { bam } = await this.configure()
       await this.setup(opts)
-      statusCallback('Downloading alignments')
-      const records = await bam.getRecordsForRange(refName, start, end, opts)
-
-      const {
-        flagInclude = 0,
-        flagExclude = 0,
-        tagFilter,
-        readName,
-      } = filterBy || {}
-
-      for (const record of records) {
-        let ref: string | undefined
-        if (!record.get('MD')) {
-          ref = await this.seqFetch(
-            originalRefName || refName,
-            record.get('start'),
-            record.get('end'),
-          )
-        }
+      const records = await updateStatus(
+        'Downloading alignments',
+        statusCallback,
+        () => bam.getRecordsForRange(refName, start, end, opts),
+      )
 
-        const flags = record.flags
-        if (
-          !((flags & flagInclude) === flagInclude && !(flags & flagExclude))
-        ) {
-          continue
-        }
+      await updateStatus('Processing alignments', statusCallback, async () => {
+        const {
+          flagInclude = 0,
+          flagExclude = 0,
+          tagFilter,
+          readName,
+        } = filterBy || {}
+
+        for (const record of records) {
+          let ref: string | undefined
+          if (!record.get('MD')) {
+            ref = await this.seqFetch(
+              originalRefName || refName,
+              record.get('start'),
+              record.get('end'),
+            )
+          }
 
-        if (tagFilter) {
-          const val = record.get(tagFilter.tag)
-          if (!(val === '*' ? val !== undefined : val === tagFilter.value)) {
+          const flags = record.flags
+          if ((flags & flagInclude) !== flagInclude && !(flags & flagExclude)) {
             continue
           }
-        }
 
-        if (readName && record.get('name') !== readName) {
-          continue
-        }
+          if (tagFilter) {
+            const v = record.get(tagFilter.tag)
+            if (!(v === '*' ? v !== undefined : `${v}` === tagFilter.value)) {
+              continue
+            }
+          }
 
-        observer.next(new BamSlightlyLazyFeature(record, this, ref))
-      }
-      statusCallback('')
-      observer.complete()
+          if (readName && record.get('name') !== readName) {
+            continue
+          }
+
+          observer.next(new BamSlightlyLazyFeature(record, this, ref))
+        }
+        observer.complete()
+      })
     }, signal)
   }
 
-  async estimateRegionsStats(regions: Region[], opts?: BaseOptions) {
+  async getMultiRegionFeatureDensityStats(
+    regions: Region[],
+    opts?: BaseOptions,
+  ) {
     const { bam } = await this.configure()
     // this is a method to avoid calling on htsget adapters
-    // @ts-expect-error
-    if (bam.index.filehandle !== '?') {
+    if (bam.index) {
       const bytes = await bytesForRegions(regions, bam)
       const fetchSizeLimit = this.getConf('fetchSizeLimit')
       return { bytes, fetchSizeLimit }
     } else {
-      return super.estimateRegionsStats(regions, opts)
+      return super.getMultiRegionFeatureDensityStats(regions, opts)
     }
   }
 

package/src/CombinationTest.test.ts

@@ -100,9 +100,9 @@ async function mismatchesCheck(f: string) {
 test('match CIGAR across file types', async () => {
   await cigarCheck('volvox-sorted')
   await cigarCheck('volvox-long-reads.fastq.sorted')
-})
+}, 20000)
 
 test('mismatches same across file types', async () => {
   await mismatchesCheck('volvox-sorted')
   await mismatchesCheck('volvox-long-reads.fastq.sorted')
-})
+}, 20000)

package/src/CramAdapter/CramAdapter.ts

@@ -4,7 +4,12 @@ import {
   BaseOptions,
   BaseSequenceAdapter,
 } from '@jbrowse/core/data_adapters/BaseAdapter'
-import { checkAbortSignal, Region, Feature } from '@jbrowse/core/util'
+import {
+  checkAbortSignal,
+  Region,
+  Feature,
+  updateStatus,
+} from '@jbrowse/core/util'
 import { openLocation } from '@jbrowse/core/util/io'
 import { ObservableCreate } from '@jbrowse/core/util/rxjs'
 import { toArray } from 'rxjs/operators'
@@ -142,36 +147,36 @@ export default class CramAdapter extends BaseFeatureDataAdapter {
 
   private async setupPre(opts?: BaseOptions) {
     const { statusCallback = () => {} } = opts || {}
-    const conf = await this.configure()
-    statusCallback('Downloading index')
-    const { cram } = conf
-    const samHeader = await cram.cram.getSamHeader()
-
-    // use the @SQ lines in the header to figure out the
-    // mapping between ref ID numbers and names
-    const idToName: string[] = []
-    const nameToId: Record<string, number> = {}
-    samHeader
-      .filter(l => l.tag === 'SQ')
-      .forEach((sqLine, refId) => {
-        sqLine.data.forEach(item => {
-          if (item.tag === 'SN') {
-            // this is the ref name
-            const refName = item.value
-            nameToId[refName] = refId
-            idToName[refId] = refName
-          }
+    return updateStatus('Downloading index', statusCallback, async () => {
+      const conf = await this.configure()
+      const { cram } = conf
+      const samHeader = await cram.cram.getSamHeader()
+
+      // use the @SQ lines in the header to figure out the
+      // mapping between ref ID numbers and names
+      const idToName: string[] = []
+      const nameToId: Record<string, number> = {}
+      samHeader
+        .filter(l => l.tag === 'SQ')
+        .forEach((sqLine, refId) => {
+          sqLine.data.forEach(item => {
+            if (item.tag === 'SN') {
+              // this is the ref name
+              const refName = item.value
+              nameToId[refName] = refId
+              idToName[refId] = refName
+            }
+          })
         })
-      })
 
-    const readGroups = samHeader
-      .filter(l => l.tag === 'RG')
-      .map(rgLine => rgLine.data.find(item => item.tag === 'ID')?.value)
+      const readGroups = samHeader
+        .filter(l => l.tag === 'RG')
+        .map(rgLine => rgLine.data.find(item => item.tag === 'ID')?.value)
 
-    const data = { idToName, nameToId, readGroups }
-    statusCallback('')
-    this.samHeader = data
-    return { samHeader: data, ...conf }
+      const data = { idToName, nameToId, readGroups }
+      this.samHeader = data
+      return { samHeader: data, ...conf }
+    })
   }
 
   private async setup(opts?: BaseOptions) {
@@ -236,38 +241,44 @@ export default class CramAdapter extends BaseFeatureDataAdapter {
       if (originalRefName) {
         this.seqIdToOriginalRefName[refId] = originalRefName
       }
-      statusCallback('Downloading alignments')
-      const records = await cram.getRecordsForRange(refId, start, end)
+      const records = await updateStatus(
+        'Downloading alignments',
+        statusCallback,
+        () => cram.getRecordsForRange(refId, start, end),
+      )
       checkAbortSignal(signal)
-      const {
-        flagInclude = 0,
-        flagExclude = 0,
-        tagFilter,
-        readName,
-      } = filterBy || {}
-
-      let filtered = records.filter(record => {
-        const flags = record.flags
-        return (flags & flagInclude) === flagInclude && !(flags & flagExclude)
-      })
+      await updateStatus('Processing alignments', statusCallback, () => {
+        const {
+          flagInclude = 0,
+          flagExclude = 0,
+          tagFilter,
+          readName,
+        } = filterBy || {}
+
+        for (const record of records) {
+          const flags = record.flags
+          if ((flags & flagInclude) !== flagInclude && !(flags & flagExclude)) {
+            continue
+          }
 
-      if (tagFilter) {
-        filtered = filtered.filter(record => {
-          // @ts-expect-error
-          const val = record[tagFilter.tag]
-          return val === '*' ? val !== undefined : val === tagFilter.value
-        })
-      }
+          if (tagFilter) {
+            const v =
+              tagFilter.tag === 'RG'
+                ? this.samHeader.readGroups?.[record.readGroupId]
+                : record.tags[tagFilter.tag]
+            if (!(v === '*' ? v !== undefined : `${v}` === tagFilter.value)) {
+              continue
+            }
+          }
 
-      if (readName) {
-        filtered = filtered.filter(record => record.readName === readName)
-      }
+          if (readName && record.readName !== readName) {
+            continue
+          }
+          observer.next(this.cramRecordToFeature(record))
+        }
 
-      filtered.forEach(record => {
-        observer.next(this.cramRecordToFeature(record))
+        observer.complete()
       })
-      statusCallback('')
-      observer.complete()
     }, signal)
   }
 
@@ -278,7 +289,10 @@ export default class CramAdapter extends BaseFeatureDataAdapter {
   }
 
   // we return the configured fetchSizeLimit, and the bytes for the region
-  async estimateRegionsStats(regions: Region[], opts?: BaseOptions) {
+  async getMultiRegionFeatureDensityStats(
+    regions: Region[],
+    opts?: BaseOptions,
+  ) {
     const bytes = await this.bytesForRegions(regions, opts)
     const fetchSizeLimit = this.getConf('fetchSizeLimit')
     return {

package/src/CramAdapter/CramSlightlyLazyFeature.ts

@@ -47,8 +47,7 @@ export default class CramSlightlyLazyFeature implements Feature {
   }
 
   _read_group_id() {
-    const rg = this._store.samHeader.readGroups
-    return rg ? rg[this.record.readGroupId] : undefined
+    return this._store.samHeader.readGroups?.[this.record.readGroupId]
   }
 
   _get_qual() {
@@ -157,9 +156,7 @@ export default class CramSlightlyLazyFeature implements Feature {
     const mismatches = this.get('mismatches')
     if (mismatches.length) {
       const record =
-        this.get('strand') === -1
-          ? mismatches[mismatches.length - 1]
-          : mismatches[0]
+        this.get('strand') === -1 ? mismatches.at(-1) : mismatches[0]
       const { type, cliplen } = record
       if (type === 'softclip' || type === 'hardclip') {
         return cliplen

package/src/CramAdapter/CramTestAdapters.ts

@@ -2,7 +2,7 @@ import { GenericFilehandle } from 'generic-filehandle'
 import { Observable } from 'rxjs'
 import SimpleFeature from '@jbrowse/core/util/simpleFeature'
 import { BaseFeatureDataAdapter } from '@jbrowse/core/data_adapters/BaseAdapter'
-import { ConfigurationSchema } from '@jbrowse/core/configuration/configurationSchema'
+import { ConfigurationSchema } from '@jbrowse/core/configuration'
 
 // setup for Cram Adapter Testing
 export function parseSmallFasta(text: string) {
@@ -13,7 +13,7 @@ export function parseSmallFasta(text: string) {
       const [defLine, ...seqLines] = entryText.split(/\n|\r\n|\r/)
       const [id, ...descriptionLines] = defLine.split(' ')
       const description = descriptionLines.join(' ')
-      const sequence = seqLines.join('').replace(/\s/g, '')
+      const sequence = seqLines.join('').replaceAll(/\s/g, '')
       return { id, description, sequence }
     })
 }

package/src/LinearAlignmentsDisplay/models/model.tsx

@@ -20,6 +20,7 @@ import {
 import { BaseDisplay } from '@jbrowse/core/pluggableElementTypes/models'
 import PluginManager from '@jbrowse/core/PluginManager'
 import { MenuItem } from '@jbrowse/core/ui'
+import { FeatureDensityStats } from '@jbrowse/core/data_adapters/BaseAdapter'
 
 const minDisplayHeight = 20
 
@@ -161,6 +162,13 @@ function stateModelFactory(
       get height() {
         return self.heightPreConfig ?? getConf(self, 'height')
       },
+
+      get featureIdUnderMouse() {
+        return (
+          self.PileupDisplay.featureIdUnderMouse ||
+          self.SNPCoverageDisplay.featureIdUnderMouse
+        )
+      },
     }))
     .views(self => ({
       /**
@@ -234,9 +242,9 @@ function stateModelFactory(
       /**
        * #action
        */
-      updateStatsLimit(stats?: unknown) {
-        self.PileupDisplay.updateStatsLimit(stats)
-        self.SNPCoverageDisplay.updateStatsLimit(stats)
+      setFeatureDensityStatsLimit(stats?: FeatureDensityStats) {
+        self.PileupDisplay.setFeatureDensityStatsLimit(stats)
+        self.SNPCoverageDisplay.setFeatureDensityStatsLimit(stats)
       },
 
       /**
@@ -328,7 +336,11 @@ function stateModelFactory(
        */
       async renderSvg(opts: { rasterizeLayers?: boolean }) {
         const pileupHeight = self.height - self.SNPCoverageDisplay.height
-        await when(() => self.PileupDisplay.ready)
+        await when(
+          () =>
+            !self.PileupDisplay.renderProps().notReady &&
+            !self.SNPCoverageDisplay.renderProps().notReady,
+        )
         return (
           <>
             <g>{await self.SNPCoverageDisplay.renderSvg(opts)}</g>