@jbrowse/bandage-core 8.2.0 → 9.1.0

package/dist/chunks/{chunk-TL4B342F.js → chunk-MXDQGA7A.js}

@@ -1,6 +1,6 @@
 import {
   clampZoom
-} from "./chunk-5OIVTEF7.js";
+} from "./chunk-OOXIMURX.js";
 
 // src/viewport.ts
 function axisScaleOf(scale, pixelRows) {

package/dist/chunks/{chunk-SKKYLBRA.js → chunk-RRZMMYBG.js}

@@ -1,7 +1,7 @@
 import {
   engineKey,
   forceLayout
-} from "./chunk-5OIVTEF7.js";
+} from "./chunk-OOXIMURX.js";
 
 // src/layout/forceCache.ts
 var DEFAULT_SIZE = 4;

package/dist/chunks/{chunk-3FXPFVKJ.js → chunk-UID3QBWH.js}

@@ -1,5 +1,5 @@
 // src/version.ts
-var version = "8.2.0";
+var version = "9.1.0";
 
 export {
   version

package/dist/chunks/{chunk-2WNBVB55.js → chunk-WBCOREDZ.js}

@@ -68,45 +68,81 @@ var Canvas2DRenderer = class {
     }
     ctx.lineCap = "round";
     ctx.lineJoin = "round";
-    this.renderEdges(batch);
-    this.renderNodes(batch);
-    this.renderArrows(batch);
-  }
-  renderEdges(batch) {
-    const t = this.transform;
-    const ctx = this.ctx;
-    const hl = this.highlightedEdge === null ? void 0 : batch.edgeCurveRuns.get(this.highlightedEdge);
+    const factor = this.highlightFactor;
+    const edgeRun = this.edgeRun(batch.edgeCurveRuns);
     for (const { color, items } of groupByPaint(batch.edgeCurves, (e, i) => ({
-      color: inRun(hl, i) ? brightenAbgr(e.color, this.highlightFactor) : e.color,
+      color: inRun(edgeRun, i) ? brightenAbgr(e.color, factor) : e.color,
       weight: e.thickness,
-      last: inRun(hl, i)
+      last: inRun(edgeRun, i)
     }))) {
-      ctx.strokeStyle = abgrToCssRgba(color);
-      ctx.lineWidth = items[0].thickness * 2 * t.dpr;
-      ctx.beginPath();
-      for (const e of items) {
-        const first = e.curves[0];
-        ctx.moveTo(
-          first.x0 * t.scaleX + t.translateX,
-          first.y0 * t.scaleY + t.translateY
-        );
-        for (const c of e.curves) {
-          ctx.bezierCurveTo(
-            c.cx0 * t.scaleX + t.translateX,
-            c.cy0 * t.scaleY + t.translateY,
-            c.cx1 * t.scaleX + t.translateX,
-            c.cy1 * t.scaleY + t.translateY,
-            c.x1 * t.scaleX + t.translateX,
-            c.y1 * t.scaleY + t.translateY
-          );
-        }
-      }
-      ctx.stroke();
+      this.strokeCurves(items, color);
+    }
+    const lifted = this.liftedStrokes(batch);
+    for (const { color, items } of groupByPaint(batch.nodeStrokes, (s, i) => {
+      const f = lifted.get(i);
+      return {
+        color: f === void 0 ? s.color : brightenAbgr(s.color, f),
+        weight: s.thickness,
+        last: f !== void 0
+      };
+    })) {
+      this.strokeNodes(items, color);
+    }
+    const arrowRun = this.edgeRun(batch.arrowRuns);
+    for (const { color, items } of groupByPaint(batch.arrows, (a, i) => ({
+      color: inRun(arrowRun, i) ? brightenAbgr(a.color, factor) : a.color,
+      weight: 0,
+      last: inRun(arrowRun, i)
+    }))) {
+      this.fillArrows(items, color);
     }
   }
-  renderNodes(batch) {
-    const t = this.transform;
+  // Only what the highlights lift, over a transparent clear, for a hover layer
+  // stacked on a canvas that drew the batch without them: a pointer move then
+  // repaints one node or edge rather than the whole drawing
+  renderHighlights() {
     const ctx = this.ctx;
+    ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
+    const batch = this.batch;
+    if (!this.transform || !batch) {
+      return;
+    }
+    ctx.lineCap = "round";
+    ctx.lineJoin = "round";
+    const factor = this.highlightFactor;
+    const curves = runItems(batch.edgeCurves, this.edgeRun(batch.edgeCurveRuns));
+    for (const { color, items } of groupByPaint(curves, (e) => ({
+      color: brightenAbgr(e.color, factor),
+      weight: e.thickness,
+      last: false
+    }))) {
+      this.strokeCurves(items, color);
+    }
+    const lifted = [...this.liftedStrokes(batch)];
+    for (const { color, items } of groupByPaint(lifted, ([i, f]) => ({
+      color: brightenAbgr(batch.nodeStrokes[i].color, f),
+      weight: batch.nodeStrokes[i].thickness,
+      last: false
+    }))) {
+      this.strokeNodes(
+        items.map(([i]) => batch.nodeStrokes[i]),
+        color
+      );
+    }
+    const arrows = runItems(batch.arrows, this.edgeRun(batch.arrowRuns));
+    for (const { color, items } of groupByPaint(arrows, (a) => ({
+      color: brightenAbgr(a.color, factor),
+      weight: 0,
+      last: false
+    }))) {
+      this.fillArrows(items, color);
+    }
+  }
+  edgeRun(runs) {
+    return this.highlightedEdge === null ? void 0 : runs.get(this.highlightedEdge);
+  }
+  // stroke index -> brighten factor, for the nodes the model lifted
+  liftedStrokes(batch) {
     const lifted = /* @__PURE__ */ new Map();
     for (const [nodeId, factor] of this.nodeHighlights) {
       const run = batch.nodeStrokeRuns.get(nodeId);
@@ -116,55 +152,63 @@ var Canvas2DRenderer = class {
         }
       }
     }
-    for (const { color, items } of groupByPaint(batch.nodeStrokes, (s, i) => {
-      const factor = lifted.get(i);
-      return {
-        color: factor === void 0 ? s.color : brightenAbgr(s.color, factor),
-        weight: s.thickness,
-        last: factor !== void 0
-      };
-    })) {
-      ctx.strokeStyle = abgrToCssRgba(color);
-      ctx.lineWidth = items[0].thickness * 2 * t.dpr;
-      ctx.beginPath();
-      for (const s of items) {
-        const p0 = s.points[0];
-        ctx.moveTo(
-          p0.x * t.scaleX + t.translateX,
-          p0.y * t.scaleY + t.translateY
+    return lifted;
+  }
+  strokeCurves(items, color) {
+    const t = this.transform;
+    const ctx = this.ctx;
+    ctx.strokeStyle = abgrToCssRgba(color);
+    ctx.lineWidth = items[0].thickness * 2 * t.dpr;
+    ctx.beginPath();
+    for (const e of items) {
+      const first = e.curves[0];
+      ctx.moveTo(
+        first.x0 * t.scaleX + t.translateX,
+        first.y0 * t.scaleY + t.translateY
+      );
+      for (const c of e.curves) {
+        ctx.bezierCurveTo(
+          c.cx0 * t.scaleX + t.translateX,
+          c.cy0 * t.scaleY + t.translateY,
+          c.cx1 * t.scaleX + t.translateX,
+          c.cy1 * t.scaleY + t.translateY,
+          c.x1 * t.scaleX + t.translateX,
+          c.y1 * t.scaleY + t.translateY
         );
-        for (let i = 1, l = s.points.length; i < l; i++) {
-          const p = s.points[i];
-          ctx.lineTo(
-            p.x * t.scaleX + t.translateX,
-            p.y * t.scaleY + t.translateY
-          );
-        }
       }
-      ctx.stroke();
     }
+    ctx.stroke();
   }
-  renderArrows(batch) {
+  strokeNodes(items, color) {
     const t = this.transform;
     const ctx = this.ctx;
-    const hl = this.highlightedEdge === null ? void 0 : batch.arrowRuns.get(this.highlightedEdge);
-    for (const { color, items } of groupByPaint(batch.arrows, (a, i) => ({
-      color: inRun(hl, i) ? brightenAbgr(a.color, this.highlightFactor) : a.color,
-      weight: 0,
-      last: inRun(hl, i)
-    }))) {
-      ctx.fillStyle = abgrToCssRgba(color);
-      ctx.beginPath();
-      for (const a of items) {
-        const [tip, left, notch, right] = arrowheadOutline(a, t);
-        ctx.moveTo(tip.x, tip.y);
-        ctx.lineTo(left.x, left.y);
-        ctx.lineTo(notch.x, notch.y);
-        ctx.lineTo(right.x, right.y);
-        ctx.closePath();
+    ctx.strokeStyle = abgrToCssRgba(color);
+    ctx.lineWidth = items[0].thickness * 2 * t.dpr;
+    ctx.beginPath();
+    for (const s of items) {
+      const p0 = s.points[0];
+      ctx.moveTo(p0.x * t.scaleX + t.translateX, p0.y * t.scaleY + t.translateY);
+      for (let i = 1, l = s.points.length; i < l; i++) {
+        const p = s.points[i];
+        ctx.lineTo(p.x * t.scaleX + t.translateX, p.y * t.scaleY + t.translateY);
       }
-      ctx.fill();
     }
+    ctx.stroke();
+  }
+  fillArrows(items, color) {
+    const t = this.transform;
+    const ctx = this.ctx;
+    ctx.fillStyle = abgrToCssRgba(color);
+    ctx.beginPath();
+    for (const a of items) {
+      const [tip, left, notch, right] = arrowheadOutline(a, t);
+      ctx.moveTo(tip.x, tip.y);
+      ctx.lineTo(left.x, left.y);
+      ctx.lineTo(notch.x, notch.y);
+      ctx.lineTo(right.x, right.y);
+      ctx.closePath();
+    }
+    ctx.fill();
   }
   dispose() {
     this.batch = null;
@@ -190,6 +234,9 @@ function arrowheadOutline(a, t) {
     { x: backX + uy * halfWidth, y: backY - ux * halfWidth }
   ];
 }
+function runItems(items, run) {
+  return run ? items.slice(run.start, run.start + run.count) : [];
+}
 function inRun(run, i) {
   return run !== void 0 && i >= run.start && i < run.start + run.count;
 }

package/dist/chunks/{chunk-OWFPAIJI.js → chunk-WEDZ76AK.js}

@@ -1,6 +1,6 @@
 import {
   tubeSpan
-} from "./chunk-DRA7733Q.js";
+} from "./chunk-BPRXQ2SS.js";
 
 // src/tubeMap/genes.ts
 function tubeMapGenes(byRefName, genes) {

package/dist/chunks/{chunk-CF62U3QS.js → chunk-WNUZP3WQ.js}

@@ -1,8 +1,9 @@
 import {
+  hasTubeMapBackbone,
   hasTubeMapPaths,
   tubeMapLayout,
   tubeMapReferenceLayout
-} from "./chunk-W2I4DOL4.js";
+} from "./chunk-INJ2UVOT.js";
 import {
   sampleRowLayout
 } from "./chunk-LOEA5IHZ.js";
@@ -24,7 +25,6 @@ import {
 var FORCE_LAYOUT_LABEL = "Force-directed layout";
 var hasBackbone = (graph) => graph.nodes.some(isBackbone);
 var hasWalks = (graph) => hasBackbone(graph) && (graph.paths?.length ?? 0) > 1;
-var hasTubeMapBackbone = (graph) => hasBackbone(graph) && hasTubeMapPaths(graph);
 var hasAlleles = (graph) => hasBackbone(graph) && graph.nodes.some(isOffReference);
 var LAYOUT_MODES = [
   {

package/dist/chunks/{chunk-WOO7QYKB.js → chunk-XKWD2RY3.js}

@@ -1,6 +1,6 @@
 import {
   SATURATED_PATH_COUNT
-} from "./chunk-MFKORG3F.js";
+} from "./chunk-FX4RDMDN.js";
 
 // src/bubbles/classifyBubble.ts
 var REPEAT_GROWTH = 10;
@@ -59,6 +59,9 @@ function classifyShape(b, repeats) {
   if (inversion) {
     return { kind: "inversion", label: `${formatBp(longest)} inv` };
   }
+  if (b.offReference) {
+    return shortest === longest ? sameLength(shortest) : { kind: "complex", label: `${range}, ${routes(pathCount)}` };
+  }
   const repeat = longest !== shortest ? coveringRepeat(b, repeats) : void 0;
   if (repeat) {
     const name = repeat.name ? ` (${repeat.name})` : "";
@@ -69,7 +72,7 @@ function classifyShape(b, repeats) {
   }
   const alleles = pathCount > 2 ? `, ${pathCount} alleles` : "";
   if (shortest === longest && shortest === refSpan) {
-    return refSpan <= 1 ? { kind: "snp", label: "SNP" } : { kind: "substitution", label: `${formatBp(refSpan)} sub` };
+    return sameLength(refSpan);
   }
   if (refSpan === 0 || shortest === refSpan) {
     return {
@@ -88,6 +91,9 @@ function classifyShape(b, repeats) {
     label: `${formatBp(refSpan)} ref \u2192 ${range}, ${pathCount} alleles`
   };
 }
+function sameLength(bp) {
+  return bp <= 1 ? { kind: "snp", label: "SNP" } : { kind: "substitution", label: `${formatBp(bp)} sub` };
+}
 var BUBBLE_KIND_COLORS = {
   snp: "#5b6b7a",
   substitution: "#5b6b7a",

package/dist/chunks/{chunk-6VBDMZBZ.js → chunk-XLCTQHBE.js}

@@ -1,6 +1,6 @@
 import {
   ENGINE_DEFAULTS
-} from "./chunk-5OIVTEF7.js";
+} from "./chunk-OOXIMURX.js";
 
 // src/figureSettings.ts
 var FIGURE_DEFAULTS = {

package/dist/chunks/{chunk-733L2TS6.js → chunk-XXT2JCAC.js}

@@ -3,16 +3,13 @@ import { forward, getXCoordinateOfBaseWithinNode } from "@jbrowse/tubemap-core";
 function readMismatches(read, layout) {
   const marks = [];
   const entries = read.sequenceNew ?? [];
+  const visits = read.path.filter((segment) => segment.node !== null);
   entries.forEach((entry, i) => {
     const nodeIndex = layout.nodeMap.get(forward(entry.nodeName));
     const node = nodeIndex === void 0 ? void 0 : layout.nodes[nodeIndex];
-    let pathIndex = i;
-    while (pathIndex < read.path.length && read.path[pathIndex].node !== nodeIndex) {
-      pathIndex += 1;
-    }
-    const y = read.path[pathIndex]?.y;
+    const y = visits[i]?.y;
     if (node && y !== void 0) {
-      const base = { readId: read.id, y, height: read.width, nodeY: node.y };
+      const base = { readId: read.id, y, height: read.width };
       const at = (pos) => getXCoordinateOfBaseWithinNode(node, pos);
       for (const mm of entry.mismatches) {
         const x0 = at(mm.pos);
@@ -29,7 +26,13 @@ function readMismatches(read, layout) {
           } else if (mm.type === "deletion" && mm.length !== void 0) {
             const x1 = at(mm.pos + mm.length);
             if (x1 !== null) {
-              marks.push({ ...base, kind: "deletion", x0, x1 });
+              marks.push({
+                ...base,
+                kind: "deletion",
+                x0,
+                x1,
+                length: mm.length
+              });
             }
           } else if (mm.type === "substitution" && mm.seq !== void 0) {
             const x1 = at(mm.pos + mm.seq.length);

package/dist/cli/figure.js

@@ -7,9 +7,9 @@ import {
 import {
   LAYOUT_MODES,
   layoutModeByValue
-} from "../chunks/chunk-CF62U3QS.js";
-import "../chunks/chunk-W2I4DOL4.js";
-import "../chunks/chunk-TEDQJPMI.js";
+} from "../chunks/chunk-WNUZP3WQ.js";
+import "../chunks/chunk-INJ2UVOT.js";
+import "../chunks/chunk-CWFNEKST.js";
 import "../chunks/chunk-LOEA5IHZ.js";
 import "../chunks/chunk-L3O7AWLI.js";
 import "../chunks/chunk-TZFWUT2C.js";
@@ -35,7 +35,7 @@ import "../chunks/chunk-LYJ4US66.js";
 import "../chunks/chunk-7XHHVYG7.js";
 import {
   figureSvg
-} from "../chunks/chunk-DE4UFDUZ.js";
+} from "../chunks/chunk-3TGUKQWQ.js";
 import "../chunks/chunk-LOCJN3BZ.js";
 import "../chunks/chunk-47DYCZOK.js";
 import "../chunks/chunk-WDTXW7T2.js";
@@ -43,7 +43,7 @@ import {
   genesOnRow,
   placeRowGenes
 } from "../chunks/chunk-MIW3HYPE.js";
-import "../chunks/chunk-2WNBVB55.js";
+import "../chunks/chunk-WBCOREDZ.js";
 import "../chunks/chunk-4BYTEJGW.js";
 import "../chunks/chunk-3S3YVOJ7.js";
 import "../chunks/chunk-BUBZ32IC.js";
@@ -53,8 +53,8 @@ import "../chunks/chunk-2LQ5BWT7.js";
 import "../chunks/chunk-6ZNQJ5ZD.js";
 import "../chunks/chunk-HBEKUQO4.js";
 import "../chunks/chunk-G2FD7S3C.js";
-import "../chunks/chunk-3FXPFVKJ.js";
-import "../chunks/chunk-TL4B342F.js";
+import "../chunks/chunk-UID3QBWH.js";
+import "../chunks/chunk-MXDQGA7A.js";
 import "../chunks/chunk-3C5UXR2U.js";
 import {
   filterSamples,
@@ -80,13 +80,13 @@ import {
   engineSettingsOf,
   forceLayout,
   loadGraph
-} from "../chunks/chunk-5OIVTEF7.js";
+} from "../chunks/chunk-OOXIMURX.js";
 import "../chunks/chunk-PUG7LXDF.js";
 import "../chunks/chunk-IGVV37VI.js";
+import "../chunks/chunk-OA7RIMZ2.js";
 import "../chunks/chunk-OCMBULGN.js";
 import "../chunks/chunk-QYBZZI5H.js";
 import "../chunks/chunk-CDLPYR5O.js";
-import "../chunks/chunk-OA7RIMZ2.js";
 import "../chunks/chunk-ES2N6V56.js";
 import "../chunks/chunk-ST2IBUAN.js";
 import "../chunks/chunk-BPLIXMH7.js";

package/dist/figure.js

@@ -1,11 +1,11 @@
 import {
   figureSvg
-} from "./chunks/chunk-DE4UFDUZ.js";
+} from "./chunks/chunk-3TGUKQWQ.js";
 import "./chunks/chunk-LOCJN3BZ.js";
 import "./chunks/chunk-47DYCZOK.js";
 import "./chunks/chunk-WDTXW7T2.js";
 import "./chunks/chunk-MIW3HYPE.js";
-import "./chunks/chunk-2WNBVB55.js";
+import "./chunks/chunk-WBCOREDZ.js";
 import "./chunks/chunk-4BYTEJGW.js";
 import "./chunks/chunk-3S3YVOJ7.js";
 import "./chunks/chunk-BUBZ32IC.js";
@@ -15,8 +15,8 @@ import "./chunks/chunk-2LQ5BWT7.js";
 import "./chunks/chunk-6ZNQJ5ZD.js";
 import "./chunks/chunk-HBEKUQO4.js";
 import "./chunks/chunk-G2FD7S3C.js";
-import "./chunks/chunk-3FXPFVKJ.js";
-import "./chunks/chunk-TL4B342F.js";
+import "./chunks/chunk-UID3QBWH.js";
+import "./chunks/chunk-MXDQGA7A.js";
 import "./chunks/chunk-3C5UXR2U.js";
 import "./chunks/chunk-MAUEPAMG.js";
 import "./chunks/chunk-PBENCR5L.js";
@@ -31,13 +31,13 @@ import "./chunks/chunk-AB35TJST.js";
 import "./chunks/chunk-JKJWSY4V.js";
 import "./chunks/chunk-NNODIW4U.js";
 import "./chunks/chunk-XV4P5KEQ.js";
-import "./chunks/chunk-5OIVTEF7.js";
+import "./chunks/chunk-OOXIMURX.js";
 import "./chunks/chunk-PUG7LXDF.js";
 import "./chunks/chunk-IGVV37VI.js";
+import "./chunks/chunk-OA7RIMZ2.js";
 import "./chunks/chunk-OCMBULGN.js";
 import "./chunks/chunk-QYBZZI5H.js";
 import "./chunks/chunk-CDLPYR5O.js";
-import "./chunks/chunk-OA7RIMZ2.js";
 import "./chunks/chunk-ES2N6V56.js";
 import "./chunks/chunk-ST2IBUAN.js";
 import "./chunks/chunk-BPLIXMH7.js";

package/dist/figureSettings.js

@@ -1,14 +1,14 @@
 import {
   FIGURE_DEFAULTS,
   figureSpecSettings
-} from "./chunks/chunk-6VBDMZBZ.js";
-import "./chunks/chunk-5OIVTEF7.js";
+} from "./chunks/chunk-XLCTQHBE.js";
+import "./chunks/chunk-OOXIMURX.js";
 import "./chunks/chunk-PUG7LXDF.js";
 import "./chunks/chunk-IGVV37VI.js";
+import "./chunks/chunk-OA7RIMZ2.js";
 import "./chunks/chunk-OCMBULGN.js";
 import "./chunks/chunk-QYBZZI5H.js";
 import "./chunks/chunk-CDLPYR5O.js";
-import "./chunks/chunk-OA7RIMZ2.js";
 import "./chunks/chunk-ES2N6V56.js";
 import "./chunks/chunk-ST2IBUAN.js";
 import "./chunks/chunk-BPLIXMH7.js";