@jbrowse/bandage-core 0.1.16 → 0.1.18

package/README.md

@@ -9,11 +9,13 @@ npm install @jbrowse/bandage-core
 ```
 
 - GFA and rGFA text in (`loadGraph`)
-- Layouts: Bandage's FMMM engine as WASM (`loadBandage`, `forceLayout`), variant
-  map, ordered, anchored, sample rows, walk rows, tube map
+- Layouts: Bandage's FMMM engine as WASM (`loadBandage`, `forceLayout`),
+  ordered, anchored, sample rows, walk rows, tube map
 - A Canvas2D renderer (`buildGeometry`, `Canvas2DRenderer`), hit testing and
   label placement
 - Bubbles, deletion edges, path colors, gbz-base windows cut to GFA
+- Walks lifted out of the drawing (`walkLift`), one facet panel per walk
+  (`facetLifts`, `facetGrid`) and each walk's key in words (`walkKey`)
 - Which assembly a backbone lies on (`graphBackbone`, `backboneAssembly`,
   `assemblyWalk`), and the genes on it: `featuresOnBackbone` renames an
   assembly's genes onto the backbone's refNames, and `genePins` pins only those

package/dist/index.js

@@ -979,9 +979,15 @@ function fittedTranslateY(bounds, usableHeight, yScale, padTop = FIT_PADDING) {
   const leftoverY = usableHeight - bounds.h * yScale;
   return padTop - bounds.minY * yScale + Math.max(0, leftoverY) / 2;
 }
-function fitTransform(bounds, paneWidth, paneHeight, pixelRows, { minScale = 0, padLeft = FIT_PADDING, padTop = FIT_PADDING } = {}) {
-  const usableWidth = paneWidth - padLeft - FIT_PADDING;
-  const usableHeight = paneHeight - padTop - FIT_PADDING;
+function fitTransform(bounds, paneWidth, paneHeight, pixelRows, {
+  minScale = 0,
+  padLeft = FIT_PADDING,
+  padTop = FIT_PADDING,
+  padRight = FIT_PADDING,
+  padBottom = FIT_PADDING
+} = {}) {
+  const usableWidth = paneWidth - padLeft - padRight;
+  const usableHeight = paneHeight - padTop - padBottom;
   if (usableWidth <= 0 || usableHeight <= 0 || !(bounds.w > 0 || !pixelRows && bounds.h > 0)) {
     return void 0;
   }
@@ -2855,10 +2861,11 @@ var EDGE_DEFAULT_COLOR = packAbgr2(119, 119, 119, 217);
 var EDGE_PATH_FALLBACK_COLOR = packAbgr2(136, 136, 136, 217);
 var EDGE_DELETION_COLOR = packAbgr2(24, 24, 28, 240);
 var DELETION_THICKNESS_FACTOR = 2.2;
+var LIFT_BACKDROP_COLOR = packAbgr2(160, 160, 160, 255);
 var FADED_ALPHA = 0.18;
 var DELETION_DASH_PX = 11;
 var MIN_PATH_STRIPE_PX = 1.2;
-var MIN_WALK_LANE_PX = 3;
+var MIN_WALK_LANE_PX = 4;
 var MIN_SCALE_FOR_OFFSET = 1e-6;
 var ARROW_LENGTH_BASE_PX = 7;
 var ARROW_LENGTH_PER_EDGE_PX = 3;
@@ -3445,13 +3452,13 @@ function buildGeometry(options) {
     if (viewportBounds && !isPolylineInBounds(segments, viewportBounds)) {
       continue;
     }
-    const own = getNodeColor(
+    const faded = highlight !== void 0 && !highlight.nodeIds.has(nodeId);
+    const own = faded ? LIFT_BACKDROP_COLOR : getNodeColor(
       node,
       nodeIndexMap.get(nodeId) ?? 0,
       colorScheme,
       colorRange
     );
-    const faded = highlight !== void 0 && !highlight.nodeIds.has(nodeId);
     const color = faded ? fadeAbgr(own, FADED_ALPHA) : own;
     const width = nodeWidthPx(node, contigThickness, nodeWidth2, depthNorm);
     const nodeThickness = width / 2;
@@ -4081,13 +4088,14 @@ var OVERHANG_PX = 5;
 function referenceStripBlocks(graph, {
   colorScheme,
   referenceRamp,
-  walkNodes
+  walkNodes,
+  walkColors
 }) {
   const range = { ...computeColorSchemeRange(graph), referenceRamp };
   const out = [];
   graph.nodes.forEach((node, index) => {
     if (isBackbone(node)) {
-      const own = getNodeColor(node, index, colorScheme, range);
+      const own = walkNodes ? walkColors?.get(node.id) ?? LIFT_BACKDROP_COLOR : getNodeColor(node, index, colorScheme, range);
       out.push({
         node: node.id,
         bp0: node.stable.start,
@@ -5243,81 +5251,79 @@ function drawTubeMapConnectors(ctx, connectors, bottom, {
 // src/walkEncoding.ts
 import { packAbgr as packAbgr3 } from "@jbrowse/core/util/colorBits";
 var WALK_FIELDS = [
-  {
-    value: "progress",
-    label: "Progress along the walk",
-    legend: "pale where the walk starts, deep where it ends"
-  },
-  {
-    value: "reference",
-    label: "Reference position",
-    legend: "along the reference left to right, charcoal off it"
-  },
-  {
-    value: "strand",
-    label: "Strand against the reference",
-    legend: "pale where the walk runs as the reference does, deep where reversed"
-  },
-  {
-    value: "visits",
-    label: "Visits",
-    legend: "pale where the walk passes once, deep four times or more"
-  }
+  { value: "progress", label: "Progress along the walk" },
+  { value: "walk", label: "One colour for the walk" },
+  { value: "reference", label: "Reference position" }
 ];
 var WALK_SCHEMES = [
-  { value: "rainbow", label: "Rainbow" },
-  { value: "blues", label: "Blues", hue: 215 },
-  { value: "reds", label: "Reds", hue: 0 },
-  { value: "greens", label: "Greens", hue: 130 },
-  { value: "oranges", label: "Oranges", hue: 30 },
-  { value: "purples", label: "Purples", hue: 280 },
-  { value: "greys", label: "Greys" }
-];
-var DEFAULT_FAMILIES = [
-  "blues",
-  "reds",
-  "greens",
-  "oranges",
-  "purples"
+  { value: "grey", label: "Grey to black", ends: ["#a3a3a3", "#151515"] },
+  { value: "blue", label: "Cyan to navy", ends: ["#6ee0f0", "#0b2c7a"] },
+  { value: "red", label: "Yellow to red", ends: ["#ffd24a", "#b3121b"] },
+  { value: "purple", label: "Pink to plum", ends: ["#f5a3d8", "#5e1a6e"] },
+  { value: "green", label: "Lime to forest", ends: ["#b6e36c", "#0b5d3b"] },
+  { value: "rainbow", label: "Rainbow" }
 ];
-function resolveEncoding(layer, reference, picked) {
-  return {
-    field: layer.color?.field ?? (reference ? "reference" : "progress"),
-    scheme: layer.color?.scheme ?? (reference ? "rainbow" : DEFAULT_FAMILIES[picked % DEFAULT_FAMILIES.length])
-  };
+var FAMILIES = ["blue", "red", "purple", "green"];
+var isField = (v) => WALK_FIELDS.some((f) => f.value === v);
+var isScheme = (v) => WALK_SCHEMES.some((s) => s.value === v);
+function resolveEncoding(layer, reference, picked, alone = true) {
+  const { field: askedField, scheme: askedScheme } = layer.color ?? {};
+  const field = isField(askedField) ? askedField : alone ? "progress" : "walk";
+  const family = reference ? "grey" : FAMILIES[picked % FAMILIES.length];
+  const scheme = isScheme(askedScheme) ? askedScheme === "rainbow" && field !== "reference" ? family : askedScheme : family;
+  return { field, scheme };
+}
+var BASE_T = 0.5;
+var toLinear = (c) => c <= 0.04045 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;
+var toGamma = (c) => c <= 31308e-7 ? c * 12.92 : 1.055 * c ** (1 / 2.4) - 0.055;
+function oklab(hex) {
+  const [r, g, b] = [1, 3, 5].map(
+    (i) => toLinear(Number.parseInt(hex.slice(i, i + 2), 16) / 255)
+  );
+  const l = Math.cbrt(0.4122214708 * r + 0.5363325363 * g + 0.0514459929 * b);
+  const m = Math.cbrt(0.2119034982 * r + 0.6806995451 * g + 0.1073969566 * b);
+  const s = Math.cbrt(0.0883024619 * r + 0.2817188376 * g + 0.6299787005 * b);
+  return [
+    0.2104542553 * l + 0.793617785 * m - 0.0040720468 * s,
+    1.9779984951 * l - 2.428592205 * m + 0.4505937099 * s,
+    0.0259040371 * l + 0.7827717662 * m - 0.808675766 * s
+  ];
 }
-var PALE = 0.82;
-var DEEP = 0.28;
-function schemeHsl(scheme, t) {
+function oklabToRgb([L, a, b]) {
+  const l = (L + 0.3963377774 * a + 0.2158037573 * b) ** 3;
+  const m = (L - 0.1055613458 * a - 0.0638541728 * b) ** 3;
+  const s = (L - 0.0894841775 * a - 1.291485548 * b) ** 3;
+  return [
+    4.0767416621 * l - 3.3077115913 * m + 0.2309699292 * s,
+    -1.2684380046 * l + 2.6097574011 * m - 0.3413193965 * s,
+    -0.0041960863 * l - 0.7034186147 * m + 1.707614701 * s
+  ].map((c) => toGamma(Math.max(0, Math.min(1, c))) * 255);
+}
+function schemeRgb(scheme, t) {
   const x = Math.max(0, Math.min(1, t));
-  if (scheme === "rainbow") {
-    return { h: x * REFERENCE_RAMP_MAX_HUE, s: 0.7, l: 0.5 };
-  }
   const family = WALK_SCHEMES.find((s) => s.value === scheme);
-  const l = PALE + (DEEP - PALE) * x;
-  return family && "hue" in family ? { h: family.hue, s: 0.75, l } : { h: 0, s: 0, l };
+  if (!family || !("ends" in family)) {
+    return hslToRgb(x * REFERENCE_RAMP_MAX_HUE, 0.7, 0.5).map((c) => c * 255);
+  }
+  const from = oklab(family.ends[0]);
+  const to = oklab(family.ends[1]);
+  return oklabToRgb(from.map((v, i) => v + (to[i] - v) * x));
 }
 function schemeCss(scheme, t) {
-  const { h, s, l } = schemeHsl(scheme, t);
-  return `hsl(${h}, ${s * 100}%, ${l * 100}%)`;
+  const [r, g, b] = schemeRgb(scheme, t).map(Math.round);
+  return `rgb(${r}, ${g}, ${b})`;
 }
 function schemeColor(scheme, t) {
-  const { h, s, l } = schemeHsl(scheme, t);
-  const [r, g, b] = hslToRgb(h, s, l);
-  return packAbgr3(
-    Math.round(r * 255),
-    Math.round(g * 255),
-    Math.round(b * 255),
-    255
-  );
+  const [r, g, b] = schemeRgb(scheme, t).map(Math.round);
+  return packAbgr3(r, g, b, 255);
+}
+function encodedColor({ field, scheme }, t) {
+  return field === "walk" ? schemeColor(scheme, BASE_T) : t === void 0 ? NO_VALUE_COLOR : schemeColor(scheme, t);
 }
 var NO_VALUE_COLOR = REFERENCE_RAMP_ALT_COLOR;
-var STRAND_T = { same: 0.2, reversed: 0.95 };
 function encodingSwatchCss({ field, scheme }) {
-  if (field === "strand") {
-    const same = schemeCss(scheme, STRAND_T.same);
-    const reversed = schemeCss(scheme, STRAND_T.reversed);
-    return `linear-gradient(to right, ${same} 50%, ${reversed} 50%)`;
+  if (field === "walk") {
+    return schemeCss(scheme, BASE_T);
   }
   const stops = Array.from({ length: 7 }, (_, i) => {
     const t = i / 6;
@@ -5325,9 +5331,6 @@ function encodingSwatchCss({ field, scheme }) {
   });
   return `linear-gradient(to right, ${stops.join(", ")})`;
 }
-function fieldLegend(field) {
-  return WALK_FIELDS.find((f) => f.value === field).legend;
-}
 
 // src/walkHighlight.ts
 function referenceOf(graph) {
@@ -5364,9 +5367,16 @@ function walkHighlight(graph, name) {
     before += length;
   }
   const reference = referenceOf(graph);
+  const originName = pathOrigin(name).name;
+  const origin = graph.anchorPaths?.find((a) => a.name === originName && a.length === bp) ?? graph.anchorPaths?.find((a) => a.name === originName);
   return {
     name,
     reference: reference === path,
+    range: origin ? {
+      contig: path.contig ?? panSNContig(origin.name),
+      start: origin.start,
+      end: origin.start + origin.length
+    } : void 0,
     nodeIds: new Set(path.nodeIds),
     edgeIndexes,
     progress,
@@ -5375,37 +5385,39 @@ function walkHighlight(graph, name) {
     referenceBp: reference && reference !== path ? reference.nodeIds.reduce((sum, id) => sum + lengthOf(id), 0) : void 0
   };
 }
-function laneColors(graph, walk, { field, scheme }, ramp) {
-  const colors = /* @__PURE__ */ new Map();
+function laneColors(graph, walk, encoding, ramp) {
   const byId = new Map(graph.nodes.map((n) => [n.id, n]));
-  const walkPath = pathOrigin(walk.name).name;
-  const reference = referenceOf(graph);
-  const referencePath = reference ? pathOrigin(reference.name).name : void 0;
-  const path = graph.paths.find((p) => p.name === walk.name);
-  const visits = /* @__PURE__ */ new Map();
-  for (const id of path.nodeIds) {
-    visits.set(id, (visits.get(id) ?? 0) + 1);
-  }
-  const strandOf = (segment, of) => graph.pathVisits?.get(segment)?.find((v) => v.path === of)?.strand;
+  const colors = /* @__PURE__ */ new Map();
   for (const [id, progress] of walk.progress) {
     const node = byId.get(id);
-    let t;
-    if (field === "progress") {
-      t = progress;
-    } else if (field === "visits") {
-      t = (Math.min(visits.get(id) ?? 1, 4) - 1) / 3;
-    } else if (field === "reference") {
-      const mid = ramp?.midpoints.get(id);
-      t = ramp && mid !== void 0 && !(node?.stable && node.stable.rank > 0) ? (mid - ramp.start) / ramp.span : void 0;
-    } else if (node) {
-      const own = strandOf(node.name, walkPath);
-      const theirs = strandOf(node.name, referencePath);
-      t = own && theirs ? own === theirs ? STRAND_T.same : STRAND_T.reversed : void 0;
-    }
-    colors.set(id, t === void 0 ? NO_VALUE_COLOR : schemeColor(scheme, t));
+    const mid = ramp?.midpoints.get(id);
+    const t = encoding.field === "progress" ? progress : ramp && mid !== void 0 && !(node?.stable && node.stable.rank > 0) ? (mid - ramp.start) / ramp.span : void 0;
+    colors.set(id, encodedColor(encoding, t));
   }
   return colors;
 }
+function reversedNodes(graph, walk) {
+  const reference = referenceOf(graph);
+  const reversed = /* @__PURE__ */ new Set();
+  let bp = 0;
+  if (!reference || walk.reference) {
+    return { reversed, bp };
+  }
+  const walkPath = pathOrigin(walk.name).name;
+  const referencePath = pathOrigin(reference.name).name;
+  const byId = new Map(graph.nodes.map((n) => [n.id, n]));
+  for (const id of walk.progress.keys()) {
+    const node = byId.get(id);
+    const visits = node ? graph.pathVisits?.get(node.name) : void 0;
+    const own = visits?.find((v) => v.path === walkPath)?.strand;
+    const theirs = visits?.find((v) => v.path === referencePath)?.strand;
+    if (own && theirs && own !== theirs) {
+      reversed.add(id);
+      bp += node.length;
+    }
+  }
+  return { reversed, bp };
+}
 function walkLift(graph, layers, ramp) {
   const seen = /* @__PURE__ */ new Set();
   const lifted = layers.filter((layer) => !seen.has(layer.walk) && seen.add(layer.walk)).flatMap((layer) => {
@@ -5420,22 +5432,120 @@ function walkLift(graph, layers, ramp) {
     const encoding = resolveEncoding(
       layer,
       walk.reference,
-      walk.reference ? 0 : picked++
+      walk.reference ? 0 : picked++,
+      lifted.length === 1
     );
+    const { reversed, bp } = reversedNodes(graph, walk);
     return {
       ...walk,
       encoding,
-      colors: laneColors(graph, walk, encoding, ramp)
+      colors: laneColors(graph, walk, encoding, ramp),
+      reversed,
+      reversedBp: bp
     };
   });
+  return liftOf(walks, ramp);
+}
+var FACET_COLOR = { field: "progress", scheme: "red" };
+function facetLifts(graph, lift, layers, ramp) {
+  return lift.walks.map((walk) => {
+    const stated = layers.find((l) => l.walk === walk.name)?.color;
+    const encoding = resolveEncoding(
+      { walk: walk.name, color: { ...FACET_COLOR, ...stated } },
+      walk.reference,
+      0
+    );
+    return liftOf(
+      [
+        {
+          ...walk,
+          encoding,
+          colors: laneColors(graph, walk, encoding, ramp)
+        }
+      ],
+      ramp
+    );
+  });
+}
+function liftOf(walks, ramp) {
   return {
     walks,
+    referenceDomain: ramp ? { start: ramp.start, end: ramp.start + ramp.span } : void 0,
     nodeIds: new Set(walks.flatMap((w) => [...w.nodeIds])),
     edgeIndexes: new Set(walks.flatMap((w) => [...w.edgeIndexes])),
     names: new Set(walks.map((w) => w.name))
   };
 }
 
+// src/walkKey.ts
+function rangeText(contig, start, end) {
+  const s = Math.round(start);
+  const e = Math.round(end);
+  return `${contig ? `${contig}:` : ""}${s.toLocaleString()}-${e.toLocaleString()} (${formatBp(e - s)})`;
+}
+function walkKey(walk, reference) {
+  const { field } = walk.encoding;
+  const own = walk.range ? rangeText(walk.range.contig, walk.range.start, walk.range.end) : void 0;
+  const scale = field === "progress" ? own : field === "reference" && reference ? rangeText(reference.name, reference.start, reference.end) : void 0;
+  return {
+    delta: walk.referenceBp === void 0 || walk.bp === walk.referenceBp ? "" : ` ${walk.bp > walk.referenceBp ? "+" : "\u2212"}${formatBp(Math.abs(walk.bp - walk.referenceBp))}`,
+    reversed: walk.reversedBp > 0 ? `, ${formatBp(walk.reversedBp)} reversed` : "",
+    shades: field !== "walk",
+    scale,
+    hover: scale === own ? void 0 : own
+  };
+}
+
+// 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;
+}
+
 // src/bubbles/bubbleLine.ts
 var SATURATED_PATH_COUNT = 2147483647;
 
@@ -6253,6 +6363,9 @@ export {
   BUBBLE_SPREADS,
   COLOR_SCHEMES,
   Canvas2DRenderer,
+  FACET_GAP_PX,
+  FACET_PAD_PX,
+  FACET_TITLE_PX,
   FIT_PADDING,
   FORCE_LAYOUT_LABEL,
   HALO_FACTOR,
@@ -6292,8 +6405,9 @@ export {
   encodingSwatchCss,
   engineKey,
   engineRequest,
+  facetGrid,
+  facetLifts,
   featuresOnBackbone,
-  fieldLegend,
   findHoveredEdge,
   findHoveredNode,
   fitTransform,
@@ -6341,6 +6455,7 @@ export {
   tubeX,
   viewportOf,
   walkHighlight,
+  walkKey,
   walkLift,
   walkRows,
   walkRowsExtent,

package/dist/types/facetGrid.d.ts

@@ -0,0 +1,21 @@
+export declare const FACET_GAP_PX = 8;
+export declare const FACET_TITLE_PX = 34;
+export declare const FACET_PAD_PX = 12;
+export interface FacetGrid {
+    columns: number;
+    width: number;
+    height: number;
+    scale: number;
+    total: number;
+}
+export declare function facetGrid({ count, bounds, pixelRows, width, room, columns, }: {
+    count: number;
+    bounds: {
+        w: number;
+        h: number;
+    };
+    pixelRows: boolean;
+    width: number;
+    room: number;
+    columns?: number;
+}): FacetGrid;

package/dist/types/index.d.ts

@@ -32,9 +32,12 @@ export type { Connector, ReferenceNode } from './tubeMap/connectors.js';
 export type { TubeMapColumn, TubeMapDrawing } from './layout/tubeMapLayout.js';
 export { deletionEdges } from './deletionEdges.js';
 export type { DeletionEdge } from './deletionEdges.js';
-export { walkHighlight, walkLift } from './walkHighlight.js';
+export { facetLifts, walkHighlight, walkLift } from './walkHighlight.js';
+export { walkKey } from './walkKey.js';
+export { FACET_GAP_PX, FACET_PAD_PX, FACET_TITLE_PX, facetGrid, } from './facetGrid.js';
+export type { FacetGrid } from './facetGrid.js';
 export type { LiftedWalk, WalkLift } from './walkHighlight.js';
-export { WALK_FIELDS, WALK_SCHEMES, encodingSwatchCss, fieldLegend, resolveEncoding, schemeCss, } from './walkEncoding.js';
+export { WALK_FIELDS, WALK_SCHEMES, encodingSwatchCss, resolveEncoding, schemeCss, } from './walkEncoding.js';
 export type { WalkEncoding, WalkField, WalkLayer, WalkScheme, } from './walkEncoding.js';
 export { pathColorsLegible, pathLegend } from './pathColors.js';
 export { bubblesFromGraph } from './bubbles/bubblesFromGraph.js';

package/dist/types/pipeline.d.ts

@@ -60,10 +60,12 @@ export declare function fitTransform(bounds: {
     minY: number;
     w: number;
     h: number;
-}, paneWidth: number, paneHeight: number, pixelRows: boolean, { minScale, padLeft, padTop }?: {
+}, paneWidth: number, paneHeight: number, pixelRows: boolean, { minScale, padLeft, padTop, padRight, padBottom, }?: {
     minScale?: number | undefined;
     padLeft?: number | undefined;
     padTop?: number | undefined;
+    padRight?: number | undefined;
+    padBottom?: number | undefined;
 }): {
     scale: number;
     translateX: number;

package/dist/types/referenceStrip.d.ts

@@ -9,10 +9,11 @@ export interface StripBlock {
     bp1: number;
     color: string;
 }
-export declare function referenceStripBlocks(graph: Graph, { colorScheme, referenceRamp, walkNodes, }: {
+export declare function referenceStripBlocks(graph: Graph, { colorScheme, referenceRamp, walkNodes, walkColors, }: {
     colorScheme: ResolvedColorScheme;
     referenceRamp?: ReferenceRamp;
     walkNodes?: ReadonlySet<string>;
+    walkColors?: ReadonlyMap<string, number>;
 }): StripBlock[];
 export interface BpFrame {
     scale: number;

package/dist/types/renderer/GeometryBuilder.d.ts

@@ -4,6 +4,7 @@ import type { Graph, GraphNode, NodeSegment } from '../types.js';
 import type { WalkLift } from '../walkHighlight.js';
 import type { RenderBatch } from './types.js';
 import type { AxisScale, BezierCurve } from '../util/geometry.js';
+export declare const LIFT_BACKDROP_COLOR: number;
 export declare const FADED_ALPHA = 0.18;
 export interface BuildOptions {
     nodePositions: Record<string, NodeSegment[]>;

package/dist/types/walkEncoding.d.ts

@@ -1,47 +1,37 @@
 export declare const WALK_FIELDS: readonly [{
     readonly value: "progress";
     readonly label: "Progress along the walk";
-    readonly legend: "pale where the walk starts, deep where it ends";
+}, {
+    readonly value: "walk";
+    readonly label: "One colour for the walk";
 }, {
     readonly value: "reference";
     readonly label: "Reference position";
-    readonly legend: "along the reference left to right, charcoal off it";
-}, {
-    readonly value: "strand";
-    readonly label: "Strand against the reference";
-    readonly legend: "pale where the walk runs as the reference does, deep where reversed";
-}, {
-    readonly value: "visits";
-    readonly label: "Visits";
-    readonly legend: "pale where the walk passes once, deep four times or more";
 }];
 export type WalkField = (typeof WALK_FIELDS)[number]['value'];
 export declare const WALK_SCHEMES: readonly [{
-    readonly value: "rainbow";
-    readonly label: "Rainbow";
-}, {
-    readonly value: "blues";
-    readonly label: "Blues";
-    readonly hue: 215;
+    readonly value: "grey";
+    readonly label: "Grey to black";
+    readonly ends: readonly ["#a3a3a3", "#151515"];
 }, {
-    readonly value: "reds";
-    readonly label: "Reds";
-    readonly hue: 0;
+    readonly value: "blue";
+    readonly label: "Cyan to navy";
+    readonly ends: readonly ["#6ee0f0", "#0b2c7a"];
 }, {
-    readonly value: "greens";
-    readonly label: "Greens";
-    readonly hue: 130;
+    readonly value: "red";
+    readonly label: "Yellow to red";
+    readonly ends: readonly ["#ffd24a", "#b3121b"];
 }, {
-    readonly value: "oranges";
-    readonly label: "Oranges";
-    readonly hue: 30;
+    readonly value: "purple";
+    readonly label: "Pink to plum";
+    readonly ends: readonly ["#f5a3d8", "#5e1a6e"];
 }, {
-    readonly value: "purples";
-    readonly label: "Purples";
-    readonly hue: 280;
+    readonly value: "green";
+    readonly label: "Lime to forest";
+    readonly ends: readonly ["#b6e36c", "#0b5d3b"];
 }, {
-    readonly value: "greys";
-    readonly label: "Greys";
+    readonly value: "rainbow";
+    readonly label: "Rainbow";
 }];
 export type WalkScheme = (typeof WALK_SCHEMES)[number]['value'];
 export interface WalkEncoding {
@@ -52,19 +42,10 @@ export interface WalkLayer {
     walk: string;
     color?: Partial<WalkEncoding>;
 }
-export declare function resolveEncoding(layer: WalkLayer, reference: boolean, picked: number): WalkEncoding;
-export declare function schemeHsl(scheme: WalkScheme, t: number): {
-    h: number;
-    s: number;
-    l: number;
-};
+export declare function resolveEncoding(layer: WalkLayer, reference: boolean, picked: number, alone?: boolean): WalkEncoding;
+export declare function schemeRgb(scheme: WalkScheme, t: number): number[];
 export declare function schemeCss(scheme: WalkScheme, t: number): string;
 export declare function schemeColor(scheme: WalkScheme, t: number): number;
+export declare function encodedColor({ field, scheme }: WalkEncoding, t?: number): number;
 export declare const NO_VALUE_COLOR: number;
-export declare const NO_VALUE_CSS: string;
-export declare const STRAND_T: {
-    same: number;
-    reversed: number;
-};
 export declare function encodingSwatchCss({ field, scheme }: WalkEncoding): string;
-export declare function fieldLegend(field: WalkField): "pale where the walk starts, deep where it ends" | "along the reference left to right, charcoal off it" | "pale where the walk runs as the reference does, deep where reversed" | "pale where the walk passes once, deep four times or more";

package/dist/types/walkHighlight.d.ts

@@ -10,16 +10,28 @@ export interface WalkHighlight {
     steps: number;
     bp: number;
     referenceBp?: number;
+    range?: {
+        contig: string;
+        start: number;
+        end: number;
+    };
 }
 export interface LiftedWalk extends WalkHighlight {
     encoding: WalkEncoding;
     colors: Map<string, number>;
+    reversed: Set<string>;
+    reversedBp: number;
 }
 export interface WalkLift {
     walks: LiftedWalk[];
+    referenceDomain?: {
+        start: number;
+        end: number;
+    };
     nodeIds: Set<string>;
     edgeIndexes: Set<number>;
     names: Set<string>;
 }
 export declare function walkHighlight(graph: Graph, name: string): WalkHighlight | undefined;
 export declare function walkLift(graph: Graph, layers: readonly WalkLayer[], ramp?: ReferenceRamp): WalkLift | undefined;
+export declare function facetLifts(graph: Graph, lift: WalkLift, layers: readonly WalkLayer[], ramp?: ReferenceRamp): WalkLift[];

package/dist/types/walkKey.d.ts

@@ -0,0 +1,12 @@
+import type { LiftedWalk } from './walkHighlight.js';
+export declare function walkKey(walk: LiftedWalk, reference?: {
+    name?: string;
+    start: number;
+    end: number;
+}): {
+    delta: string;
+    reversed: string;
+    shades: boolean;
+    scale: string | undefined;
+    hover: string | undefined;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jbrowse/bandage-core",
-  "version": "0.1.16",
+  "version": "0.1.18",
   "description": "Pangenome graph layout and drawing with no host: GFA in, the Bandage force-directed engine and reference-anchored layouts, a Canvas2D renderer, hit testing and labels out",
   "license": "GPL-3.0-or-later",
   "repository": {