@jbrowse/render-core 5.0.0-beta.3 → 5.0.0-beta.7

package/esm/marks/markHit.d.ts

@@ -0,0 +1,32 @@
+import type { MarkHit, MarkShape } from './types.ts';
+/** One instance's ink measured against a cursor — a `MarkHit` before it is one. */
+export type InkHit = Omit<MarkHit, 'index'>;
+/**
+ * Where a rect's ink sits nearest `(xPx, yPx)`, and how far: the point itself
+ * where the cursor is inside, else the nearest point on the edge.
+ */
+export declare function inkOnRect(xPx: number, yPx: number, left: number, top: number, width: number, height: number): InkHit;
+/** The same for a mark with no extent to clamp into. */
+export declare function inkAtPoint(xPx: number, yPx: number, x: number, y: number): InkHit;
+/**
+ * The nearest of `candidates` by where each one's ink is, or undefined when
+ * none beats `maxDistSq`.
+ *
+ * This is the whole of every shape's `hitNearest` but the geometry: `inkAt`
+ * answers where instance `i` put ink and how far that is, and this keeps the
+ * closest. Only a STRICTLY nearer candidate replaces the best, so on a tie the
+ * first wins — which is what makes a caller that iterates back to front get the
+ * mark on top, and it is a rule that used to be spelled out five times over.
+ *
+ * `inkAt` may answer `undefined` for an instance that drew nothing at all, as
+ * against one that drew somewhere far away: a bar clipped out of its band has
+ * no ink to be near.
+ */
+export declare function nearestInk(candidates: Iterable<number>, maxDistSq: number, inkAt: (index: number) => InkHit | undefined): MarkHit | undefined;
+/**
+ * The hit test a shape's `ink` implies: the nearest of its boxes, edges
+ * included, so a point inside one answers it at distance 0.
+ */
+export declare function inkHitNearest<C, P>(ink: NonNullable<MarkShape<C, P>['ink']>): NonNullable<MarkShape<C, P>['hitNearest']>;
+/** A shape's own `hitNearest`, else the one its `ink` implies, else none. */
+export declare function shapeHitNearest<C, P>(shape: MarkShape<C, P>): MarkShape<C, P>['hitNearest'];

package/esm/marks/markHit.js

@@ -0,0 +1,61 @@
+/**
+ * Where a rect's ink sits nearest `(xPx, yPx)`, and how far: the point itself
+ * where the cursor is inside, else the nearest point on the edge.
+ */
+export function inkOnRect(xPx, yPx, left, top, width, height) {
+    const x = Math.min(Math.max(xPx, left), left + width);
+    const y = Math.min(Math.max(yPx, top), top + height);
+    const dx = xPx - x;
+    const dy = yPx - y;
+    return { x, y, distSq: dx * dx + dy * dy };
+}
+/** The same for a mark with no extent to clamp into. */
+export function inkAtPoint(xPx, yPx, x, y) {
+    const dx = xPx - x;
+    const dy = yPx - y;
+    return { x, y, distSq: dx * dx + dy * dy };
+}
+/**
+ * The nearest of `candidates` by where each one's ink is, or undefined when
+ * none beats `maxDistSq`.
+ *
+ * This is the whole of every shape's `hitNearest` but the geometry: `inkAt`
+ * answers where instance `i` put ink and how far that is, and this keeps the
+ * closest. Only a STRICTLY nearer candidate replaces the best, so on a tie the
+ * first wins — which is what makes a caller that iterates back to front get the
+ * mark on top, and it is a rule that used to be spelled out five times over.
+ *
+ * `inkAt` may answer `undefined` for an instance that drew nothing at all, as
+ * against one that drew somewhere far away: a bar clipped out of its band has
+ * no ink to be near.
+ */
+export function nearestInk(candidates, maxDistSq, inkAt) {
+    let best;
+    let bestDistSq = maxDistSq;
+    for (const index of candidates) {
+        const ink = inkAt(index);
+        if (ink && ink.distSq < bestDistSq) {
+            bestDistSq = ink.distSq;
+            // Field by field, not `{ index, ...ink }`, which is both slower and one
+            // shape away from minting a hidden class per ink source and making every
+            // downstream `hit.x` read polymorphic.
+            best = { index, x: ink.x, y: ink.y, distSq: ink.distSq };
+        }
+    }
+    return best;
+}
+/**
+ * The hit test a shape's `ink` implies: the nearest of its boxes, edges
+ * included, so a point inside one answers it at distance 0.
+ */
+export function inkHitNearest(ink) {
+    return (channels, block, frame, params, xPx, yPx, candidates, maxDistSq) => nearestInk(candidates, maxDistSq, i => {
+        const r = ink(channels, block, frame, params, i);
+        return r && inkOnRect(xPx, yPx, r.left, r.top, r.width, r.height);
+    });
+}
+/** A shape's own `hitNearest`, else the one its `ink` implies, else none. */
+export function shapeHitNearest(shape) {
+    return (shape.hitNearest ??
+        (shape.ink ? inkHitNearest(shape.ink.bind(shape)) : undefined));
+}

package/esm/marks/markInk.d.ts

@@ -0,0 +1,14 @@
+import type { RenderBlock } from '../renderBlock.ts';
+import type { InkRect, Mark, MarkFrame } from './types.ts';
+/** One instance of one mark in a display's list, as a highlight names it. */
+export interface MarkInstance {
+    mark: number;
+    index: number;
+}
+/**
+ * The boxes a set of instances painted this frame: each mark's `ink` for the
+ * instances a display names in each region, clipped to the block's column the
+ * way the painter was. What a highlight guide draws, so a display says WHICH
+ * instances are lit and nothing about where they are.
+ */
+export declare function inkOfInstances<TRegion, TState extends MarkFrame>(marks: readonly Mark<TRegion, TState>[], blocks: readonly RenderBlock[], regionOf: (displayedRegionIndex: number) => TRegion | undefined, state: TState, instancesOf: (displayedRegionIndex: number) => Iterable<MarkInstance> | undefined): InkRect[];

package/esm/marks/markInk.js

@@ -0,0 +1,34 @@
+/**
+ * The boxes a set of instances painted this frame: each mark's `ink` for the
+ * instances a display names in each region, clipped to the block's column the
+ * way the painter was. What a highlight guide draws, so a display says WHICH
+ * instances are lit and nothing about where they are.
+ */
+export function inkOfInstances(marks, blocks, regionOf, state, instancesOf) {
+    const rects = [];
+    for (const block of blocks) {
+        const region = regionOf(block.displayedRegionIndex);
+        const instances = region && instancesOf(block.displayedRegionIndex);
+        if (!instances) {
+            continue;
+        }
+        const x0 = Math.min(block.screenStartPx, block.screenEndPx);
+        const x1 = Math.max(block.screenStartPx, block.screenEndPx);
+        for (const { mark, index } of instances) {
+            const r = marks[mark]?.ink?.(region, block, state, index);
+            if (r) {
+                const left = Math.max(r.left, x0);
+                const right = Math.min(r.left + r.width, x1);
+                if (right >= left) {
+                    rects.push({
+                        left,
+                        top: r.top,
+                        width: right - left,
+                        height: r.height,
+                    });
+                }
+            }
+        }
+    }
+    return rects;
+}

package/esm/marks/markPlan.d.ts

@@ -0,0 +1,25 @@
+import type { Mark, MarkFrame, PlannedPass } from './types.ts';
+/**
+ * A mark list resolved against one frame's state: the marks whose `enabled`
+ * said yes, in list order, and the passes they draw.
+ *
+ * `drawMarks` asks every mark's gate, lens and staged compare per block, which
+ * is the right shape for a display that stages its uniforms through the marks
+ * — and at 120 section blocks a frame it is the whole cost the pileup measured
+ * and declined (`benches/pileupUniformWrite.bench.ts` has the table). A
+ * display that writes the uniforms itself, once per section, has nothing left
+ * for the per-block walk to decide: `planMarks` answers the frame question
+ * once, `drawPlannedPasses` issues a `drawPass` per planned mark against
+ * whatever the caller staged, and `marks` is the painter's list.
+ */
+export interface MarkPlan<TRegion, TState extends MarkFrame> {
+    readonly marks: readonly Mark<TRegion, TState>[];
+    readonly passes: readonly PlannedPass[];
+}
+/**
+ * Resolve which marks draw this frame. Throws for an enabled mark the plan
+ * form cannot carry — one with a `band` or a `paintsBlock` — since a plan
+ * neither scissors nor asks the block anything, and dropping the gate silently
+ * would draw on the GPU what Canvas2D declines.
+ */
+export declare function planMarks<TRegion, TState extends MarkFrame>(marks: readonly Mark<TRegion, TState>[], state: TState): MarkPlan<TRegion, TState>;

package/esm/marks/markPlan.js

@@ -0,0 +1,20 @@
+/**
+ * Resolve which marks draw this frame. Throws for an enabled mark the plan
+ * form cannot carry — one with a `band` or a `paintsBlock` — since a plan
+ * neither scissors nor asks the block anything, and dropping the gate silently
+ * would draw on the GPU what Canvas2D declines.
+ */
+export function planMarks(marks, state) {
+    const enabled = [];
+    const passes = [];
+    for (const mark of marks) {
+        if (!mark.enabled || mark.enabled(state)) {
+            if (!mark.planned) {
+                throw new Error(`mark ${mark.pass.id} declares a band or a block gate, which a frame plan does not carry; draw it through drawMarks`);
+            }
+            enabled.push(mark);
+            passes.push(mark.planned);
+        }
+    }
+    return { marks: enabled, passes };
+}

package/esm/marks/markRamp.d.ts

@@ -0,0 +1,43 @@
+import type { MarkRamp, MarkValueScaleType } from './types.ts';
+/**
+ * A colour channel as a shape reads it: `color`, the packed ABGR the worker
+ * resolved, or `colorValue`, the raw values a frame's {@link MarkRamp} turns
+ * into colours here. A shape reading a ramp declares both optional and asks
+ * {@link colorBits} for the GPU and {@link paintColors} for Canvas2D.
+ */
+export interface ColorChannel {
+    color?: Uint32Array;
+    colorValue?: Float32Array;
+    /** The Canvas2D bake, memoized on the payload; nothing else writes it. */
+    rampBake?: RampBake;
+}
+interface RampBake {
+    min: number;
+    max: number;
+    log: boolean;
+    lut: Uint8Array;
+    colors: Uint32Array;
+}
+/** `scoreScale`'s scale-type code for a declared value scale. */
+export declare function valueScaleTypeCode(scale: MarkValueScaleType | undefined): 0 | 1;
+/** `markColor.slang`'s three uniforms for a frame's ramp, or for none. */
+export declare function rampUniforms(ramp: MarkRamp | undefined): {
+    rampMode: number;
+    rampMin: number;
+    rampMax: number;
+};
+/**
+ * The 4-byte instance lane, for the packer. Under a ramp it is the value's
+ * float32 bits viewed as the `uint` the attribute declares — the reinterpret
+ * `markColor.slang`'s `asfloat` undoes, and the reason a ramp adds no lane.
+ */
+export declare function colorBits(c: ColorChannel): ArrayLike<number>;
+/**
+ * The packed colours a painter fills with. Under a ramp the values are baked
+ * against the domain once and kept on the payload, so a repaint at an
+ * unchanged domain — every pan and every hover — walks no values and the
+ * painters' fill batching still sees runs of one colour. The bake reruns when
+ * the domain, the scale type or the ramp's bytes move.
+ */
+export declare function paintColors(c: ColorChannel, count: number, ramp: MarkRamp | undefined): ArrayLike<number>;
+export {};

package/esm/marks/markRamp.js

@@ -0,0 +1,68 @@
+import { RAMP_LINEAR, RAMP_LOG, RAMP_NONE, } from '../shaders/markColor.generated.js';
+import { SCALE_TYPE_LOG } from '../shaders/scoreScale.generated.js';
+import { normalizeScore } from '../shaders/scoreScale.js.generated.js';
+const NO_COLORS = new Uint32Array(0);
+/** `scoreScale`'s scale-type code for a declared value scale. */
+export function valueScaleTypeCode(scale) {
+    return scale === 'log' ? SCALE_TYPE_LOG : 0;
+}
+/** `markColor.slang`'s three uniforms for a frame's ramp, or for none. */
+export function rampUniforms(ramp) {
+    return ramp
+        ? {
+            rampMode: ramp.scale === 'log' ? RAMP_LOG : RAMP_LINEAR,
+            rampMin: ramp.domain[0],
+            rampMax: ramp.domain[1],
+        }
+        : { rampMode: RAMP_NONE, rampMin: 0, rampMax: 1 };
+}
+/**
+ * The 4-byte instance lane, for the packer. Under a ramp it is the value's
+ * float32 bits viewed as the `uint` the attribute declares — the reinterpret
+ * `markColor.slang`'s `asfloat` undoes, and the reason a ramp adds no lane.
+ */
+export function colorBits(c) {
+    const { colorValue } = c;
+    return colorValue
+        ? new Uint32Array(colorValue.buffer, colorValue.byteOffset, colorValue.length)
+        : (c.color ?? NO_COLORS);
+}
+/**
+ * The packed colours a painter fills with. Under a ramp the values are baked
+ * against the domain once and kept on the payload, so a repaint at an
+ * unchanged domain — every pan and every hover — walks no values and the
+ * painters' fill batching still sees runs of one colour. The bake reruns when
+ * the domain, the scale type or the ramp's bytes move.
+ */
+export function paintColors(c, count, ramp) {
+    const { colorValue } = c;
+    if (!ramp || !colorValue) {
+        return c.color ?? NO_COLORS;
+    }
+    const [min, max] = ramp.domain;
+    const log = ramp.scale === 'log';
+    const { lut } = ramp;
+    const bake = c.rampBake;
+    if (bake &&
+        bake.min === min &&
+        bake.max === max &&
+        bake.log === log &&
+        bake.lut === lut &&
+        bake.colors.length >= count) {
+        return bake.colors;
+    }
+    const entries = lut.length / 4;
+    const colors = new Uint32Array(count);
+    for (let i = 0; i < count; i++) {
+        const t = normalizeScore(colorValue[i], min, max, log ? SCALE_TYPE_LOG : 0, 1);
+        const o = Math.round(t * (entries - 1)) * 4;
+        colors[i] =
+            ((lut[o + 3] << 24) |
+                (lut[o + 2] << 16) |
+                (lut[o + 1] << 8) |
+                lut[o]) >>>
+                0;
+    }
+    c.rampBake = { min, max, log, lut, colors };
+    return colors;
+}

package/esm/marks/pointMark.d.ts

@@ -1,4 +1,5 @@
-import type { MarkShape } from './types.ts';
+import type { ColorChannel } from './markRamp.ts';
+import type { MarkRamp, MarkShape, MarkValueScaleType } from './types.ts';
 /**
  * The `point` shape's channels: a glyph per instance at `x`, on the `y` scale,
  * widening to a bar where `x2 - x` is wider than the glyph.
@@ -7,17 +8,20 @@ import type { MarkShape } from './types.ts';
  * one array holds SNPs (`x2 === x + 1`) and structural variants together, and
  * the shader, the painter and the hit test all take the same branch off it.
  */
-export interface PointChannels {
+export interface PointChannels extends ColorChannel {
     x: Uint32Array;
     x2: Uint32Array;
     y: Float32Array;
-    color: Uint32Array;
     glyph: Uint8Array;
     count: number;
 }
 export interface PointParams {
-    /** `[min, max]` of the linear scale `y` is read through. */
+    /** `[min, max]` `y` is read through. */
     domain: [number, number];
+    /** How that domain is read; linear when absent. */
+    scaleType?: MarkValueScaleType;
+    /** The quantitative colour scale, for a point whose colour is a ramp. */
+    ramp?: MarkRamp;
     /** Glyph diameter in CSS px. */
     diameterPx: number;
 }

package/esm/marks/pointMark.js

@@ -1,15 +1,18 @@
 import { bpRangeXTuple } from '../blockClipUtils.js';
 import { getDpr, makeBpMapper } from '../canvas2dUtils.js';
 import * as shader from '../shaders/pointMark.generated.js';
-import { valueToYPx } from '../shaders/pointMark.js.generated.js';
+import { pointDrawsBar, valueToYPxScaled, } from '../shaders/pointMark.js.generated.js';
 import { slangPass } from '../slangPass.js';
 import { abgrToCssRgba } from './colorFill.js';
-import { appendGlyph } from './glyphPaint.js';
+import { appendGlyph, glyphBox } from './glyphPaint.js';
+import { inkAtPoint, inkOnRect, nearestInk } from './markHit.js';
+import { colorBits, paintColors, rampUniforms, valueScaleTypeCode, } from './markRamp.js';
+import { blockPx } from './spanMark.js';
 export const pointMark = {
     id: 'point',
     pass: {
         ...slangPass({ id: 'point', mod: shader }),
-        pack: c => shader.packInstances(c, c.count),
+        pack: c => shader.packInstances({ ...c, color: colorBits(c) }, c.count),
     },
     writeUniforms(scratch, clip, block, frame, params) {
         shader.writeUniforms(scratch, {
@@ -17,6 +20,8 @@ export const pointMark = {
             canvasHeight: frame.canvasHeight,
             domainMin: params.domain[0],
             domainMax: params.domain[1],
+            valueScaleType: valueScaleTypeCode(params.scaleType),
+            ...rampUniforms(params.ramp),
             zero: 0,
             // viewportWidth and radiusPx stay in CSS units to match canvasHeight:
             // mixing a DPR-scaled radius with a CSS-scaled height draws vertically
@@ -27,15 +32,17 @@ export const pointMark = {
         });
     },
     paintBlock(ctx, channels, block, frame, params) {
-        const { x, x2, y, color, glyph, count } = channels;
+        const { x, x2, y, glyph, count } = channels;
         if (count === 0) {
             return;
         }
+        const color = paintColors(channels, count, params.ramp);
         const { diameterPx, domain } = params;
         const r = diameterPx / 2;
         const canvasHeight = frame.canvasHeight;
         const domainMin = domain[0];
         const domainMax = domain[1];
+        const st = valueScaleTypeCode(params.scaleType);
         // The per-block closure, not the six-argument `bpToScreenPx`: that spelling
         // re-derives the region span and the block width at every call, and this
         // loop makes two calls per instance. Measured at 1.67x on 100K points.
@@ -55,9 +62,9 @@ export const pointMark = {
             }
             const xStart = bpToPx(x[i]);
             const xEnd = bpToPx(x2[i]);
-            const yPx = valueToYPx(y[i], domainMin, domainMax, canvasHeight);
+            const yPx = valueToYPxScaled(y[i], domainMin, domainMax, canvasHeight, st);
             const widthPx = Math.abs(xEnd - xStart);
-            if (widthPx > diameterPx) {
+            if (pointDrawsBar(widthPx, r)) {
                 ctx.rect(Math.min(xStart, xEnd), yPx - r, widthPx, diameterPx);
             }
             else {
@@ -66,6 +73,25 @@ export const pointMark = {
         }
         ctx.fill();
     },
+    // A bar is the rect the painter fills, unpadded on every side; a glyph is
+    // the box `appendGlyph` paints inside.
+    ink(channels, block, frame, params, i) {
+        const { x, x2, y, glyph } = channels;
+        const { diameterPx, domain } = params;
+        const xStart = blockPx(block, x[i]);
+        const xEnd = blockPx(block, x2[i]);
+        const cy = valueToYPxScaled(y[i], domain[0], domain[1], frame.canvasHeight, valueScaleTypeCode(params.scaleType));
+        const lo = Math.min(xStart, xEnd);
+        const hi = Math.max(xStart, xEnd);
+        const r = diameterPx / 2;
+        return pointDrawsBar(hi - lo, r)
+            ? { left: lo, top: cy - r, width: hi - lo, height: diameterPx }
+            : glyphBox(glyph[i], xStart, cy, diameterPx);
+    },
+    // Its own rather than the one `ink` implies, for the glyph: a dense plot
+    // stacks glyphs whose boxes all contain the cursor at distance 0, and the
+    // one under the cursor is the nearest CENTRE, which no box can say. A bar
+    // is grabbed anywhere inside the rect it fills, as the derived test would.
     hitNearest(channels, block, frame, params, xPx, yPx, candidates, maxDistSq) {
         const { x, x2, y } = channels;
         const bpToPx = makeBpMapper(block);
@@ -73,26 +99,16 @@ export const pointMark = {
         const domainMin = domain[0];
         const domainMax = domain[1];
         const canvasHeight = frame.canvasHeight;
-        let best;
-        let bestDistSq = maxDistSq;
-        for (const i of candidates) {
+        const st = valueScaleTypeCode(params.scaleType);
+        return nearestInk(candidates, maxDistSq, i => {
             const xStart = bpToPx(x[i]);
             const xEnd = bpToPx(x2[i]);
-            // The bar branch, in the same words the shader and the painter take it:
-            // a mark with extent is grabbed at the nearest point along its span, a
-            // glyph at its centre.
+            const cy = valueToYPxScaled(y[i], domainMin, domainMax, canvasHeight, st);
             const lo = Math.min(xStart, xEnd);
             const hi = Math.max(xStart, xEnd);
-            const ptX = hi - lo > diameterPx ? Math.max(lo, Math.min(xPx, hi)) : xStart;
-            const ptY = valueToYPx(y[i], domainMin, domainMax, canvasHeight);
-            const dx = xPx - ptX;
-            const dy = yPx - ptY;
-            const distSq = dx * dx + dy * dy;
-            if (distSq < bestDistSq) {
-                bestDistSq = distSq;
-                best = { index: i, x: ptX, y: ptY, distSq };
-            }
-        }
-        return best;
+            return pointDrawsBar(hi - lo, diameterPx / 2)
+                ? inkOnRect(xPx, yPx, lo, cy - diameterPx / 2, hi - lo, diameterPx)
+                : inkAtPoint(xPx, yPx, xStart, cy);
+        });
     },
 };

package/esm/marks/spanMark.d.ts

@@ -1,3 +1,4 @@
+import type { RenderBlock } from '../renderBlock.ts';
 import type { MarkShape } from './types.ts';
 /**
  * The `span` shape's channels: a coloured rectangle from `x` to `x2` on the
@@ -7,6 +8,12 @@ export interface SpanChannels {
     x: Uint32Array;
     x2: Uint32Array;
     row: Uint32Array;
+    /**
+     * Packed ABGR, resolved in the worker — a span's colour has no ramp arm.
+     * `rowRect`'s uniform struct is shared with four other consumers, and a
+     * sampler on it would move all of them for a channel no config asks for
+     * on a span (ADR-113).
+     */
     color: Uint32Array;
     count: number;
 }
@@ -42,4 +49,5 @@ export interface SpanParams {
     /** Rows-area scroll offset in CSS px; 0 for a canvas sized to its content. */
     scrollTop: number;
 }
+export declare function blockPx(block: RenderBlock, bp: number): number;
 export declare const spanMark: MarkShape<SpanChannels, SpanParams>;

package/esm/marks/spanMark.js

@@ -1,9 +1,15 @@
 import { bpRangeXTuple } from '../blockClipUtils.js';
-import { makeBpMapper, spanLeft } from '../canvas2dUtils.js';
+import { bpToScreenPx, makeBpMapper, spanLeft } from '../canvas2dUtils.js';
 import { drawnRowHeightPx, rowBandOffsetPx, } from '../shaders/rowRect.js.generated.js';
 import * as shader from '../shaders/spanMark.generated.js';
 import { slangPass } from '../slangPass.js';
 import { makeAbgrFill } from './colorFill.js';
+// Per instance rather than through `makeBpMapper`: `ink` is asked one
+// instance at a time, and a closure per ask is the allocation the mapper
+// exists to hoist out of a loop.
+export function blockPx(block, bp) {
+    return bpToScreenPx(bp, block.start, block.end, block.screenStartPx, block.screenEndPx, block.reversed);
+}
 export const spanMark = {
     id: 'span',
     pass: {
@@ -40,32 +46,19 @@ export const spanMark = {
             ctx.fillRect(spanLeft(xa, xb, width), offset + rowHeight * row[i] - scrollTop, width + seamPx, h);
         }
     },
-    hitNearest(channels, block, _frame, params, xPx, yPx, candidates, maxDistSq) {
+    ink(channels, block, _frame, params, i) {
         const { x, x2, row } = channels;
         const { rowHeight, rowProportion, minWidthPx, scrollTop } = params;
-        const h = drawnRowHeightPx(rowHeight, rowProportion);
-        const offset = rowBandOffsetPx(rowHeight, rowProportion);
-        const bpToPx = makeBpMapper(block);
-        let best;
-        let bestDistSq = maxDistSq;
-        for (const i of candidates) {
-            const xa = bpToPx(x[i]);
-            const xb = bpToPx(x2[i]);
-            const width = Math.max(minWidthPx, Math.abs(xb - xa));
-            const left = spanLeft(xa, xb, width);
-            const top = offset + rowHeight * row[i] - scrollTop;
-            // the rect `paintBlock` fills, less `seamPx`, which is painter-only
-            // overdraw; distance 0 inside it, else to its nearest edge
-            const nx = Math.min(Math.max(xPx, left), left + width);
-            const ny = Math.min(Math.max(yPx, top), top + h);
-            const dx = xPx - nx;
-            const dy = yPx - ny;
-            const distSq = dx * dx + dy * dy;
-            if (distSq < bestDistSq) {
-                bestDistSq = distSq;
-                best = { index: i, x: nx, y: ny, distSq };
-            }
-        }
-        return best;
+        const xa = blockPx(block, x[i]);
+        const xb = blockPx(block, x2[i]);
+        const width = Math.max(minWidthPx, Math.abs(xb - xa));
+        return {
+            left: spanLeft(xa, xb, width),
+            top: rowBandOffsetPx(rowHeight, rowProportion) +
+                rowHeight * row[i] -
+                scrollTop,
+            width,
+            height: drawnRowHeightPx(rowHeight, rowProportion),
+        };
     },
 };