@jbrowse/bandage-core 6.0.1 → 6.0.3

package/dist/chunks/chunk-5XQDMQXU.js

@@ -0,0 +1,431 @@
+import {
+  svgCanvas
+} from "./chunk-47DYCZOK.js";
+import {
+  stripGeneGaps,
+  walkStripFrame,
+  walkStripLabelsTree
+} from "./chunk-ROF2R3RF.js";
+import {
+  walkRowsKey,
+  walkRowsKeyTree,
+  walkRowsTree
+} from "./chunk-6SXMCK6I.js";
+import {
+  Canvas2DRenderer
+} from "./chunk-D3M7SBKL.js";
+import {
+  genePins
+} from "./chunk-BUBZ32IC.js";
+import {
+  EXON_COLOR,
+  exonOutlineTree,
+  exonStretches
+} from "./chunk-3S3YVOJ7.js";
+import {
+  version
+} from "./chunk-LLJUG2H7.js";
+import {
+  axisScaleOf
+} from "./chunk-MQJUG2D2.js";
+import {
+  facetLifts,
+  walkLift
+} from "./chunk-GGQRADFS.js";
+import {
+  encodingStops
+} from "./chunk-WFX3MAKA.js";
+import {
+  rangeText,
+  walkKey
+} from "./chunk-GOY6REMT.js";
+import {
+  FIT_PADDING,
+  drawingBounds,
+  fitTransform
+} from "./chunk-IO2PCPZI.js";
+import {
+  buildGeometry,
+  computeReferenceRamp
+} from "./chunk-PCZ4PTYC.js";
+import {
+  geneLabelCandidates
+} from "./chunk-DKOB2OPC.js";
+import {
+  nodesUnderBox
+} from "./chunk-YMSSF2RK.js";
+import {
+  walkRowsExtent
+} from "./chunk-EZPBJPK6.js";
+import {
+  pathLegend
+} from "./chunk-X5L37W4J.js";
+import {
+  LABEL_CHAR_PX,
+  LABEL_PAD,
+  LABEL_PX,
+  occupancy,
+  placeLabels
+} from "./chunk-AB35TJST.js";
+import {
+  nodeInk
+} from "./chunk-PBENCR5L.js";
+import {
+  resolveColorScheme
+} from "./chunk-JKJWSY4V.js";
+import {
+  deletionEdges
+} from "./chunk-4EMPBO7S.js";
+import {
+  ROW_HEIGHT_PX
+} from "./chunk-CPMHA4W5.js";
+import {
+  serializeEl
+} from "./chunk-NNODIW4U.js";
+import {
+  FACET_GAP_PX,
+  FACET_PAD_PX,
+  FACET_TITLE_PX,
+  facetCells,
+  facetGrid,
+  facetSettingOf
+} from "./chunk-6SBUFFTB.js";
+import {
+  referenceLabel
+} from "./chunk-RAKOB6IV.js";
+
+// src/figure.ts
+var FONT = 'font-family="Helvetica, Arial, sans-serif" font-size="11"';
+var BAR_PX = 48;
+var SWATCH_PX = 18;
+var KEY_GAP_PX = 16;
+var STRIP_KEY_PX = 22;
+var FADED = "rgb(160,160,160)";
+var GENE_INK = "#1c1c22";
+function esc(s) {
+  return s.replaceAll("&", "&amp;").replaceAll("<", "&lt;").replaceAll(">", "&gt;").replaceAll('"', "&quot;");
+}
+function keySvg(id, x, y, stops, label, after, under, opacity = 1) {
+  const bar = stops.length > 1 ? BAR_PX : SWATCH_PX;
+  const fill = stops.length > 1 ? `fill="url(#${id})"` : `fill="${stops[0].color}"${opacity < 1 ? ` fill-opacity="${opacity}"` : ""}`;
+  const defs = stops.length > 1 ? `<linearGradient id="${id}">${stops.map((s) => `<stop offset="${s.offset}" stop-color="${s.color}"/>`).join("")}</linearGradient>` : "";
+  const width = Math.max(
+    bar + 5 + (label.length + after.length) * LABEL_CHAR_PX,
+    (under?.length ?? 0) * LABEL_CHAR_PX
+  );
+  return {
+    width,
+    markup: `${defs}<g transform="translate(${x} ${y})" ${FONT}><rect y="5" width="${bar}" height="8" rx="2" ${fill}/><text x="${bar + 5}" y="13"><tspan font-weight="bold">${esc(label)}</tspan>${esc(after)}</text>${under ? `<text y="28">${esc(under)}</text>` : ""}</g>`
+  };
+}
+function exonKeySvg(x, y) {
+  return {
+    width: SWATCH_PX + 5 + 4 * LABEL_CHAR_PX,
+    markup: `<g transform="translate(${x} ${y})" ${FONT}><rect x="1" y="4" width="${SWATCH_PX - 2}" height="10" rx="4" fill="none" stroke="${EXON_COLOR}" stroke-width="2"/><text x="${SWATCH_PX + 5}" y="13">exon</text></g>`
+  };
+}
+function walkKeySvg(id, x, y, walk, label, reference) {
+  const key = walkKey(walk, reference);
+  return keySvg(
+    id,
+    x,
+    y,
+    encodingStops(walk.encoding),
+    label,
+    key.delta + key.outside + key.reversed,
+    key.scale
+  );
+}
+function screenPath(d, t) {
+  return d.replaceAll(
+    /([ML])(-?[\d.e-]+),(-?[\d.e-]+)/g,
+    (_, cmd, x, y) => `${cmd}${+(Number(x) * t.scaleX + t.translateX).toFixed(1)},${+(Number(y) * t.scaleY + t.translateY).toFixed(1)}`
+  );
+}
+function chip(x, y, w, name, note) {
+  return `<rect x="${x - w / 2}" y="${y - LABEL_PX - LABEL_PAD + 2}" width="${w}" height="${LABEL_PX + LABEL_PAD * 2 - 2}" rx="3" fill="#fff" fill-opacity="0.85" stroke="${EXON_COLOR}"/><text x="${x}" y="${y}" font-family="Helvetica, Arial, sans-serif" font-size="${LABEL_PX}" fill="${GENE_INK}" text-anchor="middle"><tspan font-style="italic" font-weight="600">${esc(name)}</tspan>${note ? esc(note) : ""}</text>`;
+}
+function figureSvg(graph, layout, o = {}) {
+  const width = o.width ?? 1200;
+  const room = o.height ?? 800;
+  const region = o.region;
+  const rampDomain = o.colorDomain ?? region;
+  const rows = o.walkRows;
+  const bounds = drawingBounds(layout, {
+    region: o.fitToDrawing ? void 0 : region,
+    extent: rows && layout.extent ? walkRowsExtent(rows) : void 0
+  });
+  const pixelRows = layout.pixelRows ?? false;
+  const nodeById = new Map(graph.nodes.map((node) => [node.id, node]));
+  const colorScheme = resolveColorScheme(o.colorScheme ?? "auto", graph);
+  const referenceRamp = colorScheme === "reference-position" && !layout.tubeMap ? computeReferenceRamp(graph, rampDomain) : void 0;
+  const rampInterval = referenceRamp && {
+    start: referenceRamp.start,
+    end: referenceRamp.start + referenceRamp.span
+  };
+  const deletions = layout.tubeMap ? [] : deletionEdges(graph);
+  const layers = o.walks ?? [];
+  const walkRamp = layers.some((l) => l.color?.field === "reference") ? referenceRamp ?? computeReferenceRamp(graph, rampDomain) : void 0;
+  const lift = layers.length > 0 && !layout.tubeMap ? walkLift(graph, layers, walkRamp) : void 0;
+  const facet = facetSettingOf(o.facet);
+  const panels = facet.field && lift && lift.walks.length > 1 ? facetLifts(graph, lift, layers, walkRamp) : void 0;
+  const labels = new Map(
+    (graph.paths?.length ? pathLegend(graph.paths) : []).map((p) => [
+      p.name,
+      p.label
+    ])
+  );
+  const labelOf = (name) => labels.get(name) ?? name;
+  const referenceName = o.referenceName ?? referenceLabel(graph, region);
+  const reference = lift?.referenceDomain && {
+    ...lift.referenceDomain,
+    name: referenceName
+  };
+  const contigThickness = o.contigThickness ?? 6;
+  const nodeWidth = o.nodeWidth ?? "depth";
+  const pins = o.genes?.length && !layout.tubeMap && !rows ? genePins(graph, o.genes, layout.nodePositions) : [];
+  const ink = nodeInk(graph, nodeById, contigThickness, nodeWidth);
+  let masks = 0;
+  function overlays(highlight, t, w, h) {
+    const out = [];
+    const outlines = exonOutlineTree(
+      exonStretches(pins, ink.halfWidthPx, highlight, (d) => screenPath(d, t)),
+      { id: `exons${masks++}`, width: w, height: h }
+    );
+    if (outlines) {
+      out.push(serializeEl(outlines));
+    }
+    const screen = (p) => ({
+      x: p.x * t.scaleX + t.translateX,
+      y: p.y * t.scaleY + t.translateY
+    });
+    const frame = { width: w, height: h };
+    for (const { item: pin, x, y, w: cw, text } of placeLabels(
+      geneLabelCandidates(
+        pins,
+        screen,
+        contigThickness,
+        nodesUnderBox(layout.nodePositions, t)
+      ),
+      frame,
+      occupancy(frame)
+    )) {
+      const pinY = screen(pin.at).y + contigThickness / 2;
+      out.push(
+        `<line x1="${x}" x2="${x}" y1="${y - LABEL_PX - 2}" y2="${pinY}" stroke="${GENE_INK}" stroke-width="0.8" stroke-opacity="0.6"/>`,
+        chip(x, y, cw, pin.gene.name, text.slice(pin.gene.name.length))
+      );
+    }
+    if (rows) {
+      out.push(
+        serializeEl(
+          walkRowsTree(
+            rows,
+            { ...t, width: w, height: h },
+            {
+              ramp: rampInterval,
+              rowGenes: o.rowGenes
+            }
+          )
+        )
+      );
+    }
+    const rowLabels = rows ? [rows.reference, ...rows.rows].map((r, i) => ({
+      label: r.label,
+      y: i * ROW_HEIGHT_PX
+    })) : layout.rowLabels ?? [];
+    for (const { label, y } of rowLabels) {
+      const sy = y * t.scaleY + t.translateY;
+      if (sy >= 0 && sy <= h) {
+        out.push(
+          `<text x="6" y="${sy + 4}" ${FONT} stroke="#fff" stroke-width="3" paint-order="stroke">${esc(label)}</text>`
+        );
+      }
+    }
+    return out.join("");
+  }
+  function drawing(highlight, w, h) {
+    const fit = fitTransform(
+      bounds,
+      w,
+      h,
+      pixelRows,
+      panels ? {
+        padLeft: FACET_PAD_PX,
+        padTop: FACET_PAD_PX,
+        padRight: FACET_PAD_PX,
+        padBottom: FACET_PAD_PX
+      } : {}
+    );
+    if (!fit) {
+      return "";
+    }
+    const axis = axisScaleOf(fit.scale, pixelRows);
+    const { canvas, markup } = svgCanvas(w, h);
+    const renderer = new Canvas2DRenderer(canvas);
+    renderer.uploadGeometry(
+      buildGeometry({
+        nodePositions: rows ? {} : layout.nodePositions,
+        graph,
+        nodeById,
+        colorScheme,
+        contigThickness,
+        connectorThickness: o.connectorThickness ?? 2,
+        drawPaths: false,
+        nodeWidth,
+        highlight,
+        axis,
+        referenceRamp,
+        deletions: new Map(deletions.map((d) => [d.edgeIndex, d.bypassed])),
+        deletionRoutes: layout.deletionRoutes,
+        stranded: layout.stranded,
+        hiddenEdges: new Set(
+          o.showDeletionEdges ? [] : deletions.map((d) => d.edgeIndex)
+        )
+      })
+    );
+    const t = {
+      scaleX: axis.scaleX,
+      scaleY: axis.scaleY,
+      translateX: fit.translateX,
+      translateY: fit.translateY
+    };
+    renderer.updateTransform({ ...t, dpr: 1 });
+    renderer.render([1, 1, 1, 1]);
+    return markup() + overlays(highlight, t, w, h);
+  }
+  const parts = [];
+  let height;
+  if (panels) {
+    const place = facetCells(
+      panels.map((p) => p.walks[0].name),
+      facet.field || "walk",
+      facet.domain
+    );
+    const grid = facetGrid({
+      count: place.count,
+      bounds,
+      pixelRows,
+      width,
+      room,
+      columns: place.columns ?? facet.columns
+    });
+    panels.forEach((panel, i) => {
+      const cell = place.cells[i];
+      const x = cell % grid.columns * (grid.width + FACET_GAP_PX);
+      const y = Math.floor(cell / grid.columns) * (grid.height + FACET_TITLE_PX + FACET_GAP_PX);
+      const walk = panel.walks[0];
+      parts.push(
+        walkKeySvg(`key${i}`, x + 6, y + 2, walk, labelOf(walk.name), reference).markup,
+        `<svg x="${x}" y="${y + FACET_TITLE_PX}" width="${grid.width}" height="${grid.height}">${drawing(panel, grid.width, grid.height)}</svg>`
+      );
+    });
+    height = grid.total;
+  } else {
+    let x = 6;
+    const push = (key) => {
+      parts.push(key.markup);
+      x += key.width + KEY_GAP_PX;
+    };
+    if (lift) {
+      lift.walks.forEach((walk, i) => {
+        push(walkKeySvg(`key${i}`, x, 2, walk, labelOf(walk.name), reference));
+      });
+      push(
+        keySvg(
+          "faded",
+          x,
+          2,
+          [{ offset: 0, color: FADED }],
+          "",
+          `not on ${lift.walks.length === 1 ? labelOf(lift.walks[0].name) : "these walks"}`,
+          void 0,
+          0.3
+        )
+      );
+    }
+    if (rows) {
+      const key = walkRowsKeyTree(
+        walkRowsKey(rows, {
+          ramp: rampInterval,
+          genes: o.rowGenes?.size ? o.rowGeneGaps : void 0
+        }),
+        x,
+        2,
+        "rows-key"
+      );
+      push({ width: key.width, markup: serializeEl(key.tree) });
+    } else if (!lift && referenceRamp) {
+      push(
+        keySvg(
+          "ramp",
+          x,
+          2,
+          encodingStops({ field: "reference", scheme: "rainbow" }),
+          referenceName ? `${referenceName} position` : "Reference position",
+          "",
+          rangeText(
+            referenceName,
+            referenceRamp.start,
+            referenceRamp.start + referenceRamp.span
+          )
+        )
+      );
+    }
+    if (pins.some((pin) => pin.exonsByNode.length > 0)) {
+      push(exonKeySvg(x, 2));
+    }
+    const header = parts.length > 0 ? FACET_TITLE_PX : 0;
+    const usable = width - 2 * FIT_PADDING;
+    const drawn = pixelRows || !(bounds.w > 0) ? bounds.h : bounds.h * usable / bounds.w;
+    const h = Math.max(
+      160,
+      Math.min(room - header, Math.ceil(drawn + 2 * FIT_PADDING))
+    );
+    parts.push(
+      `<svg y="${header}" width="${width}" height="${h}">${drawing(lift, width, h)}</svg>`
+    );
+    height = header + h;
+  }
+  const strip = o.walkStrip;
+  if (strip && !rows && !layout.tubeMap) {
+    const frame = walkStripFrame(strip.rows, { width });
+    const key = walkRowsKeyTree(
+      walkRowsKey(strip.rows, {
+        ramp: rampInterval,
+        genes: stripGeneGaps(frame, strip.rowGenes, strip.rowGeneGaps)
+      }),
+      6,
+      height + frame.height,
+      "strip-key"
+    );
+    parts.push(
+      `<line x1="0" x2="${width}" y1="${height + 0.5}" y2="${height + 0.5}" stroke="#ddd"/>`,
+      `<svg y="${height}" width="${width}" height="${frame.height}">${serializeEl(
+        walkRowsTree(strip.rows, frame, {
+          ramp: rampInterval,
+          rowGenes: strip.rowGenes,
+          idPrefix: "strip"
+        })
+      )}${serializeEl(
+        walkStripLabelsTree(
+          strip.rows,
+          frame,
+          new Set(layers.map((l) => l.walk))
+        )
+      )}</svg>`,
+      serializeEl(key.tree)
+    );
+    height += frame.height + STRIP_KEY_PX;
+  }
+  const metadata = JSON.stringify({
+    generator: `@jbrowse/bandage-core@${version}`,
+    ...o.spec === void 0 ? {} : { spec: o.spec }
+  });
+  return `<svg xmlns="http://www.w3.org/2000/svg" width="${width}" height="${height}" viewBox="0 0 ${width} ${height}"><metadata>${esc(metadata)}</metadata><rect width="${width}" height="${height}" fill="#fff"/>${parts.join("")}</svg>
+`;
+}
+
+export {
+  figureSvg
+};

package/dist/chunks/chunk-6JEWNXCQ.js

@@ -0,0 +1,90 @@
+// src/layout/drawnScale.ts
+var MEAN_NODE_LENGTH = 40;
+var MIN_TOTAL_GRAPH_LENGTH = 500;
+var BANDAGE_MINIMUM_NODE_LENGTH = 5;
+function drawnNodeLength(opts, length) {
+  return Math.max(
+    opts.nodeLengthPerMegabase * length / 1e6,
+    opts.minimumNodeLength
+  );
+}
+function bandageAutoScale(graph, minNodeLength = BANDAGE_MINIMUM_NODE_LENGTH) {
+  const totalLength = graph.nodes.reduce((sum, n) => sum + n.length, 0);
+  const megabases = totalLength / 1e6;
+  const target = Math.max(
+    graph.nodes.length * MEAN_NODE_LENGTH,
+    MIN_TOTAL_GRAPH_LENGTH
+  );
+  return {
+    nodeLengthPerMegabase: megabases > 0 ? target / megabases : 1e4,
+    minimumNodeLength: Math.max(BANDAGE_MINIMUM_NODE_LENGTH, minNodeLength),
+    edgeLength: 5,
+    nodeSegmentLength: 20
+  };
+}
+var PROPORTIONAL_LENGTH = { power: 1, effect: 1 };
+function isProportional(law) {
+  return law.power === 1 && law.effect === 1;
+}
+function drawnLengthFor(graph, law) {
+  const count = graph.nodes.length;
+  const totalLength = graph.nodes.reduce((sum, n) => sum + n.length, 0);
+  const meanBp = count > 0 ? totalLength / count : 0;
+  const meanDrawn = count > 0 ? Math.max(count * MEAN_NODE_LENGTH, MIN_TOTAL_GRAPH_LENGTH) / count : MEAN_NODE_LENGTH;
+  return (bp) => {
+    if (meanBp <= 0) {
+      return meanDrawn;
+    }
+    const relative = (bp / meanBp) ** law.power;
+    return Math.max(
+      meanDrawn * ((relative - 1) * law.effect + 1),
+      BANDAGE_MINIMUM_NODE_LENGTH
+    );
+  };
+}
+var LAYOUT_LENGTH_PRECISION = 1e3;
+var PROPORTIONAL_SPREAD = {
+  law: PROPORTIONAL_LENGTH,
+  minNodeLength: 0
+};
+function layoutScaling(graph, spread = PROPORTIONAL_SPREAD) {
+  const { law, minNodeLength } = spread;
+  const opts = bandageAutoScale(graph, minNodeLength);
+  if (isProportional(law)) {
+    return { nodes: graph.nodes, opts };
+  }
+  const drawn = drawnLengthFor(graph, law);
+  return {
+    nodes: graph.nodes.map((node) => ({
+      ...node,
+      length: Math.round(drawn(node.length) * LAYOUT_LENGTH_PRECISION)
+    })),
+    opts: {
+      ...opts,
+      nodeLengthPerMegabase: 1e6 / LAYOUT_LENGTH_PRECISION,
+      // Bandage's own floor only. A law and a raised floor are alternatives
+      // rather than a stack: the law has already lifted the small end, and a
+      // floor on top of it would flatten exactly what it just spread.
+      minimumNodeLength: BANDAGE_MINIMUM_NODE_LENGTH
+    }
+  };
+}
+function drawnLengthOf(graph, spread = PROPORTIONAL_SPREAD) {
+  if (isProportional(spread.law)) {
+    const opts = bandageAutoScale(graph, spread.minNodeLength);
+    return (bp) => drawnNodeLength(opts, bp);
+  }
+  return drawnLengthFor(graph, spread.law);
+}
+
+export {
+  MEAN_NODE_LENGTH,
+  drawnNodeLength,
+  bandageAutoScale,
+  PROPORTIONAL_LENGTH,
+  isProportional,
+  drawnLengthFor,
+  PROPORTIONAL_SPREAD,
+  layoutScaling,
+  drawnLengthOf
+};

package/dist/chunks/chunk-6SBUFFTB.js

@@ -0,0 +1,97 @@
+// src/facetGrid.ts
+var FACET_GAP_PX = 8;
+var FACET_TITLE_PX = 34;
+var FACET_PAD_PX = 12;
+var MIN_FACET_PANEL_PX = 60;
+function facetGrid({
+  count,
+  bounds,
+  pixelRows,
+  width,
+  room,
+  columns
+}) {
+  function tile(across) {
+    const rows = Math.ceil(count / across);
+    const panelWidth = Math.floor(
+      (width - (across - 1) * FACET_GAP_PX) / across
+    );
+    const panelRoom = (room - rows * FACET_TITLE_PX - (rows - 1) * FACET_GAP_PX) / rows;
+    const fitX = (panelWidth - 2 * FACET_PAD_PX) / bounds.w;
+    const fitY = bounds.h > 0 ? (panelRoom - 2 * FACET_PAD_PX) / bounds.h : Infinity;
+    const scale = pixelRows ? fitX : Math.min(fitX, fitY);
+    const drawn = pixelRows ? bounds.h : bounds.h * scale;
+    const height = Math.floor(
+      Math.max(
+        MIN_FACET_PANEL_PX,
+        Math.min(drawn + 2 * FACET_PAD_PX, panelRoom)
+      )
+    );
+    return {
+      columns: across,
+      width: panelWidth,
+      height,
+      scale,
+      total: rows * (height + FACET_TITLE_PX) + (rows - 1) * FACET_GAP_PX
+    };
+  }
+  if (columns !== void 0) {
+    return tile(Math.max(1, Math.min(count, Math.round(columns))));
+  }
+  let best = tile(1);
+  for (let across = 2; across <= count; across++) {
+    const grid = tile(across);
+    if (grid.scale > best.scale) {
+      best = grid;
+    }
+  }
+  return best;
+}
+function facetSettingOf(facet) {
+  const raw = typeof facet === "string" ? { field: facet } : facet ?? {};
+  const field = raw.field === "walk" || raw.field === "sample" ? raw.field : "";
+  return {
+    field,
+    domain: [...raw.domain ?? []],
+    ...raw.columns === void 0 ? {} : { columns: raw.columns }
+  };
+}
+function domainFirst(names, domain) {
+  const rank = new Map(domain.map((name, i) => [name, i]));
+  const listed = (name) => rank.get(name) ?? domain.length;
+  return names.map((name, i) => ({ name, i })).sort((a, b) => listed(a.name) - listed(b.name) || a.i - b.i).map(({ name }) => name);
+}
+function facetCells(names, by, domain = []) {
+  const wrapOrder = domainFirst(names, domain);
+  const wrap = {
+    columns: void 0,
+    count: names.length,
+    cells: names.map((name) => wrapOrder.indexOf(name))
+  };
+  if (by === "walk") {
+    return wrap;
+  }
+  const places = names.map((name) => {
+    const [sample, haplotype, contig] = name.split("#");
+    const n = Number(haplotype);
+    return contig !== void 0 && Number.isInteger(n) && n >= 0 ? { sample, column: Math.max(0, n - 1) } : void 0;
+  });
+  const rows = domainFirst(
+    [...new Set(places.flatMap((p) => p ? [p.sample] : []))],
+    domain
+  );
+  const columns = Math.max(1, ...places.map((p) => p ? p.column + 1 : 1));
+  const cells = places.map(
+    (p) => p ? rows.indexOf(p.sample) * columns + p.column : -1
+  );
+  return cells.includes(-1) || new Set(cells).size < cells.length ? wrap : { columns, count: rows.length * columns, cells };
+}
+
+export {
+  FACET_GAP_PX,
+  FACET_TITLE_PX,
+  FACET_PAD_PX,
+  facetGrid,
+  facetSettingOf,
+  facetCells
+};