Highlight a feature, and sort it to the top

featureHighlights boxes one feature and pins its row.

Prefer name. A span is interbase (0-based, half-open), so coordinates copied from the location box match nothing. featureHighlights is display state, not a config slot, so it goes in displaySnapshot; in displayDefaults it is dropped without a word.

View source — 35 lines

import { LinearGenomeView } from '@jbrowse/react-linear-genome-view2'

export default function FeatureHighlights() {
  return (
    <LinearGenomeView
      assembly={{
        name: 'hg38',
        uri: 'https://jbrowse.org/genomes/GRCh38/fasta/hg38.prefix.fa.gz',
        refNameAliases: {
          uri: 'https://jbrowse.org/genomes/GRCh38/hg38_aliases.txt',
        },
        geneticCodes: { chrM: 2 },
      }}
      tracks={[
        {
          trackId: 'ncbi-refseq-genes',
          name: 'NCBI RefSeq Genes',
          uri: 'https://jbrowse.org/genomes/GRCh38/ncbi_refseq/GCA_000001405.15_GRCh38_full_analysis_set.refseq_annotation.sorted.gff.gz',
        },
      ]}
      view={{
        loc: 'chr12:25,150,000-25,400,000',
        tracks: [
          {
            trackId: 'ncbi-refseq-genes',
            displaySnapshot: {
              height: 220,
              featureHighlights: [{ refName: 'chr12', name: 'KRAS' }],
            },
          },
        ],
      }}
    />
  )
}