react-msaview 3.2.0 → 3.2.2

package/src/parsers/ClustalMSA.ts

@@ -11,12 +11,12 @@ export default class ClustalMSA {
     return this.MSA
   }
 
-  getRow(name: string) {
+  getRow(name: string): string {
     return this.MSA.alns.find(aln => aln.id === name)?.seq || ''
   }
 
   getWidth() {
-    return this.MSA.alns[0].seq.length
+    return this.MSA.alns[0]!.seq.length
   }
 
   getRowData() {
@@ -44,10 +44,10 @@ export default class ClustalMSA {
       id: 'root',
       name: 'root',
       noTree: true,
-      branchset: this.getNames().map(name => ({
+      children: this.getNames().map(name => ({
         id: name,
         name,
-        branchset: [],
+        children: [],
       })),
     }
   }

package/src/parsers/EmfMSA.ts

@@ -0,0 +1,66 @@
+import { parseEmfAln } from 'emf-js'
+import type { NodeWithIds } from '../util'
+
+export default class EmfMSA {
+  private MSA: ReturnType<typeof parseEmfAln>
+
+  constructor(text: string) {
+    this.MSA = parseEmfAln(text)
+  }
+
+  getMSA() {
+    return this.MSA
+  }
+
+  getRow(name: string): string {
+    return this.MSA.find(aln => aln.protein === name)?.seq || ''
+  }
+
+  getWidth() {
+    return this.MSA[0]!.seq.length
+  }
+
+  getRowData() {
+    return undefined
+  }
+
+  getHeader() {
+    return ''
+  }
+
+  getNames() {
+    return this.MSA.map(aln => aln.protein)
+  }
+
+  getStructures() {
+    return {}
+  }
+
+  get alignmentNames() {
+    return []
+  }
+
+  getTree(): NodeWithIds {
+    return {
+      id: 'root',
+      name: 'root',
+      noTree: true,
+      children: this.getNames().map(name => ({
+        id: name,
+        name,
+        children: [],
+      })),
+    }
+  }
+
+  get seqConsensus() {
+    return undefined
+  }
+  get secondaryStructureConsensus() {
+    return undefined
+  }
+
+  get tracks() {
+    return []
+  }
+}

package/src/parsers/EmfTree.ts

@@ -0,0 +1,9 @@
+import { parseEmfTree } from 'emf-js'
+
+export default class EmfTree {
+  data: ReturnType<typeof parseEmfTree>
+
+  constructor(text: string) {
+    this.data = parseEmfTree(text)
+  }
+}

package/src/parsers/FastaMSA.ts

@@ -6,7 +6,7 @@ function parseSmallFasta(text: string) {
     .filter(t => /\S/.test(t))
     .map(entryText => {
       const [defLine, ...seqLines] = entryText.split('\n')
-      const [id, ...description] = defLine.split(' ')
+      const [id, ...description] = defLine!.split(' ')
       const descriptionStr = description.join(' ')
       const seqLinesStr = seqLines.join('')
       const sequence = seqLinesStr.replaceAll(/\s/g, '')
@@ -18,7 +18,7 @@ export default class FastaMSA {
   constructor(text: string) {
     this.MSA = {
       seqdata: Object.fromEntries(
-        parseSmallFasta(text).map(m => [`${m.id}`, m.sequence]),
+        parseSmallFasta(text).map(m => [m.id, m.sequence]),
       ),
     }
   }
@@ -36,11 +36,11 @@ export default class FastaMSA {
   }
 
   getRow(name: string) {
-    return this.MSA?.seqdata[name] || ''
+    return this.MSA.seqdata[name] || ''
   }
 
   getWidth() {
-    const name = Object.keys(this.MSA?.seqdata)[0]
+    const name = Object.keys(this.MSA.seqdata)[0]!
     return this.getRow(name).length
   }
 
@@ -61,9 +61,9 @@ export default class FastaMSA {
       id: 'root',
       name: 'root',
       noTree: true,
-      branchset: this.getNames().map(name => ({
+      children: this.getNames().map(name => ({
         id: name,
-        branchset: [],
+        children: [],
         name,
       })),
     }

package/src/parsers/StockholmMSA.ts

@@ -7,9 +7,9 @@ interface StockholmEntry {
     DE?: string[]
     NH?: string[]
   }
-  gs: {
+  gs?: {
     AC: Record<string, string>
-    DR: Record<string, string>
+    DR?: Record<string, string>
   }
   gc?: {
     SS_cons?: string
@@ -33,11 +33,11 @@ export default class StockholmMSA {
   }
 
   getRow(name: string) {
-    return this.MSA?.seqdata[name] || ''
+    return this.MSA.seqdata[name] || ''
   }
 
   getWidth() {
-    const name = Object.keys(this.MSA?.seqdata)[0]
+    const name = Object.keys(this.MSA.seqdata)[0]!
     return this.getRow(name).length
   }
 
@@ -56,7 +56,7 @@ export default class StockholmMSA {
   getRowData(rowName: string) {
     return {
       name: rowName,
-      accession: this.MSA.gs?.AC?.[rowName],
+      accession: this.MSA.gs?.AC[rowName],
       dbxref: this.MSA.gs?.DR?.[rowName],
     }
   }
@@ -74,10 +74,10 @@ export default class StockholmMSA {
       .map(([id, dr]) => [id, pdbRegex.exec(dr)] as const)
       .filter((item): item is [string, RegExpExecArray] => !!item[1])
       .map(([id, match]) => {
-        const pdb = match[1].toLowerCase()
-        const chain = match[2]
-        const startPos = +match[3]
-        const endPos = +match[4]
+        const pdb = match[1]!.toLowerCase()
+        const chain = match[2]!
+        const startPos = +match[3]!
+        const endPos = +match[4]!
         return { id, pdb, chain, startPos, endPos }
       })
 
@@ -93,16 +93,16 @@ export default class StockholmMSA {
   }
 
   getTree(): NodeWithIds {
-    const tree = this.MSA?.gf?.NH?.[0]
+    const tree = this.MSA.gf.NH?.[0]
     return tree
       ? generateNodeIds(parseNewick(tree))
       : {
           id: 'root',
           name: 'root',
           noTree: true,
-          branchset: this.getNames().map(name => ({
+          children: this.getNames().map(name => ({
             id: name,
-            branchset: [],
+            children: [],
             name,
           })),
         }

package/src/renderToSvg.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable react-refresh/only-export-components */
 import React from 'react'
 import { createRoot } from 'react-dom/client'
 import { when } from 'mobx'
@@ -153,13 +154,11 @@ function CoreRendering({
 
       <g
         clipPath={`url(#${clipId1})`}
-        /* eslint-disable-next-line react/no-danger */
         dangerouslySetInnerHTML={{ __html: ctx1.getSvg().innerHTML }}
       />
       <g
         clipPath={`url(#${clipId2})`}
         transform={`translate(${treeAreaWidth} 0)`}
-        /* eslint-disable-next-line react/no-danger */
         dangerouslySetInnerHTML={{ __html: ctx2.getSvg().innerHTML }}
       />
     </>

package/src/reparseTree.ts

@@ -3,11 +3,11 @@ import type { NodeWithIds } from './util'
 export function reparseTree(tree: NodeWithIds): NodeWithIds {
   return {
     ...tree,
-    branchset: tree.branchset.map(r =>
-      r.branchset.length
+    children: tree.children.map(r =>
+      r.children.length
         ? reparseTree(r)
         : {
-            branchset: [r],
+            children: [r],
             id: `${r.id}-leafnode`,
             name: `${r.name}-hidden`,
           },

package/src/rowCoordinateCalculations.test.ts

@@ -0,0 +1,19 @@
+import { expect, test } from 'vitest'
+import { mouseOverCoordToGlobalCoord } from './rowCoordinateCalculations'
+test('blanks3', () => {
+  const blanks = [2, 5, 8]
+  ;(
+    [
+      [0, 0],
+      [1, 1],
+      [2, 3],
+      [3, 4],
+      [4, 6],
+      [5, 7],
+      [6, 9],
+      [7, 10],
+    ] as const
+  ).forEach(r => {
+    expect(mouseOverCoordToGlobalCoord(blanks, r[0])).toBe(r[1])
+  })
+})

package/src/rowCoordinateCalculations.ts

@@ -0,0 +1,26 @@
+export function mouseOverCoordToGlobalCoord(blanks: number[], pos: number) {
+  let i = 0 // 'mouse over coord'
+  let j = 0 // 'position in blanks array'
+  let k = 0 // 'global coord'/return value
+
+  for (; i < pos; i++, k++) {
+    // skip multiple gaps in a row
+    while (j < blanks.length && blanks[j]! - 1 === k) {
+      j++
+      k++
+    }
+  }
+  return k
+}
+
+export function globalCoordToRowSpecificCoord(seq: string, pos: number) {
+  let k = 0
+  for (let i = 0; i < pos; i++) {
+    if (seq[i] !== '-') {
+      k++
+    } else if (k >= pos) {
+      break
+    }
+  }
+  return k
+}

package/src/util.ts

@@ -14,7 +14,7 @@ export function transform<T>(
 }
 
 interface Node {
-  branchset?: Node[]
+  children?: Node[]
   name?: string
   [key: string]: unknown
 }
@@ -22,7 +22,7 @@ interface Node {
 export interface NodeWithIds {
   id: string
   name: string
-  branchset: NodeWithIds[]
+  children: NodeWithIds[]
   length?: number
   noTree?: boolean
 }
@@ -30,7 +30,7 @@ export interface NodeWithIds {
 export interface NodeWithIdsAndLength {
   id: string
   name: string
-  branchset: NodeWithIdsAndLength[]
+  children: NodeWithIdsAndLength[]
   noTree?: boolean
   length: number
 }
@@ -46,8 +46,8 @@ export function generateNodeIds(
     ...tree,
     id,
     name: tree.name || id,
-    branchset:
-      tree.branchset?.map((b, i) =>
+    children:
+      tree.children?.map((b, i) =>
         generateNodeIds(b, `${id}-${i}`, depth + 1),
       ) || [],
   }

package/src/version.ts

@@ -1 +1 @@
-export const version = '3.2.0'
+export const version = '3.2.2'