@msb235/blits 0.13.0 → 0.15.0

package/dist/fill.js

@@ -1,11 +1,13 @@
+import { runBounded } from './bound.js';
 import { foldNumber, lerpNumber } from './channels.js';
 import { passAt, phaseAt, same, silent, weighed } from './clock.js';
 import { flush } from './columns.js';
 import { crowdsUpTo, freshen } from './crowd.js';
 import { open as openRecord, shut as shutRecord } from './everyone.js';
 import { unband } from './fold.js';
-import { foldLocus, gatherLocus } from './gather.js';
+import { foldRole, gatherRole, runRole } from './gather.js';
 import { runKeys } from './keyfill.js';
+import { keepProbed } from './lane.js';
 import { reach } from './meet.js';
 import { absent } from './numbers.js';
 import { AT, NOTHING, readKeys, seg, segment, shifted } from './patch.js';
@@ -15,6 +17,8 @@ import { rested } from './turns.js';
 // V8 reads a local const as a constant, where it reads an import from its module on every call.
 const open = openRecord;
 const shut = shutRecord;
+/** The last `Arg.MARK` handed out, by every mix's lanes, so no two placings share one. */
+let marks = 0;
 /** The least prime at least `n`, and 1 below 2. */
 function primeFrom(n) {
     if (n < 2)
@@ -34,6 +38,7 @@ export function fillAll(lanes, now, version) {
     flush(lanes);
     const host = lanes.host;
     lanes.filling = true;
+    const lookups = lanes.lookups;
     try {
         lanes.fills++;
         lanes.owed.begin(lanes.fills);
@@ -84,17 +89,21 @@ export function fillAll(lanes, now, version) {
         if (busy) {
             for (const ch of lanes.laned)
                 rested(ch, size);
-            for (const g of lanes.loci)
-                gatherLocus(lanes, g);
+            for (const g of lanes.roles)
+                gatherRole(lanes, g);
             for (const lane of lanes.lanes) {
                 if (lane.idle)
                     continue;
-                if (lanes.crowds.length > 0)
+                if (lanes.crowds.length > 0) {
+                    lanes.arg[6 /* Arg.MARK */] = Number.NaN;
                     crowdsUpTo(lanes, lane.voice.id);
+                }
                 lanes.run(lane);
             }
-            if (lanes.crowds.length > 0)
+            if (lanes.crowds.length > 0) {
+                lanes.arg[6 /* Arg.MARK */] = Number.NaN;
                 crowdsUpTo(lanes, Number.POSITIVE_INFINITY);
+            }
             for (const c of lanes.crowds)
                 if (!c.idle) {
                     c.bareFill = lanes.fills;
@@ -111,6 +120,7 @@ export function fillAll(lanes, now, version) {
         }
         lanes.moved = reading.moved;
         lanes.inputs = reading.inputs;
+        lanes.holds = lanes.lookups !== lookups;
     }
     finally {
         lanes.filling = false;
@@ -162,10 +172,7 @@ export function rest(lanes, lane) {
             continue;
         reach(lanes, slot, 1);
         // A probe read this subject from the last fill, which this lane's weight stays from.
-        if (lanes.per[slot * 6 /* Per.SLOT */ + 5 /* Per.LANE_FILL */] === lanes.fills - 1) {
-            const o = p * 8 /* Row.STRIDE */;
-            data[o + 3 /* Row.PROBED */] = data[o + 2 /* Row.WEIGHT */];
-        }
+        keepProbed(data, p * 8 /* Row.STRIDE */, lanes.per, slot * 6 /* Per.SLOT */, lanes.fills);
     }
 }
 export function wake(lanes, lane) {
@@ -205,6 +212,7 @@ export function parting(voice, slot) {
     return subject === absent ? 1 : this.host.parting(voice, subject);
 }
 export function subjectAt(slot) {
+    this.lookups++;
     let subject = this.subjects[slot];
     if (subject === undefined) {
         subject = this.numbers.subject(slot);
@@ -217,6 +225,7 @@ export function subjectAt(slot) {
 export function reset(lane) {
     const voice = lane.voice;
     lane.placed = false;
+    this.arg[6 /* Arg.MARK */] = Number.NaN;
     lane.read = false;
     lane.weighed = false;
     // With no fade in or out the envelope is 1 for every subject, which is what it would return.
@@ -232,11 +241,16 @@ export function run(lane) {
     const voice = lane.voice;
     if (voice.state === 'pending' || voice.state === 'done')
         return;
-    if (lane.group !== null) {
-        foldLocus(this, lane, lane.group);
+    const g = lane.group;
+    if (g !== null) {
+        if (!g.inline)
+            foldRole(this, lane, g);
+        else if (lane === g.members[0])
+            runRole(this, g);
         return;
     }
     this.reset(lane);
+    lane.ran = this.fills;
     if (lane.motion !== undefined && !voice.keeping) {
         runMotion(this, lane, lane.motion);
         return;
@@ -251,6 +265,10 @@ export function run(lane) {
         this.runEveryone(lane);
         return;
     }
+    if (voice.bound !== null) {
+        runBounded(this, lane, voice.bound);
+        return;
+    }
     for (let p = 0; p < list.length; p++) {
         this.one(lane, p, list[p]);
         // Its patch just made kept state: no further call this fill, the general path makes them.
@@ -281,7 +299,7 @@ export function runEveryone(lane) {
 /**
  * One subject's contribution from a lane's voice. True where the voice gave the subject a delta,
  * as the general path's `contribution` does where it returns one, which is what makes a voice in a
- * locus one of its members for the subject.
+ * role one of its members for the subject.
  */
 export function one(lane, p, slot) {
     const host = this.host;
@@ -290,9 +308,7 @@ export function one(lane, p, slot) {
     const arg = this.arg;
     const data = lane.data;
     const o = p * 8 /* Row.STRIDE */;
-    // A probe read this subject from the last fill: keep the weight it read for `weightOf`.
-    if (this.per[slot * 6 /* Per.SLOT */ + 5 /* Per.LANE_FILL */] === this.fills - 1)
-        data[o + 3 /* Row.PROBED */] = data[o + 2 /* Row.WEIGHT */];
+    keepProbed(data, o, this.per, slot * 6 /* Per.SLOT */, this.fills);
     if (this.lately >= 0 && this.unread(slot))
         return false;
     const delay = data[o + 0 /* Row.DELAY */];
@@ -319,6 +335,8 @@ export function one(lane, p, slot) {
         lane.placedAt = elapsed;
         lane.phase = phaseAt(elapsed, voice.duration, voice.passes);
         lane.pass = passAt(elapsed, voice.duration, voice.passes);
+        arg[6 /* Arg.MARK */] = ++marks;
+        lane.mark = arg[6 /* Arg.MARK */];
     }
     const since = data[o + 1 /* Row.SINCE */];
     if (!lane.flat && (!lane.weighed || !same(since, lane.weighedSince))) {
@@ -352,6 +370,14 @@ export function one(lane, p, slot) {
             lane.readAt = elapsed;
             this.gather(lane, lane.delta);
         }
+        // A signal is handed the gap since the subject's last read, which this read is, as it is on
+        // the general path; the record's delta is not this read's, so a probe reads it again.
+        if (typeof voice.spec.weight === 'function') {
+            const rec = lane.records[p];
+            rec.probed = this.now;
+            rec.seeks = voice.seeks;
+            rec.delta = null;
+        }
         if (w > 0) {
             arg[0 /* Arg.WEIGHT */] = w;
             this.fold(lane, slot);
@@ -359,8 +385,9 @@ export function one(lane, p, slot) {
         return true;
     }
     const rec = lane.records[p];
-    // The general path makes a voice's first call for a subject, where it first sees it play.
-    if (Number.isNaN(rec.probed)) {
+    // The general path makes a voice's first call for a subject, where it first sees it play, or a
+    // probe meeting the voice makes it here, or the fill of a lane that took every subject.
+    if (Number.isNaN(rec.probed) && !this.meeting && !lane.every) {
         this.late.push(slot);
         return false;
     }
@@ -399,7 +426,7 @@ export function foldKeys(voice, chans, slot) {
         const a = seg.a;
         const b = seg.b;
         const u = seg.eased;
-        if (ch.scalar || !ch.plain) {
+        if (ch.scalar || !ch.plain || !ch.straight) {
             this.foldInto(ch, slot, voice.lerps[i](a, b, u));
             continue;
         }
@@ -440,8 +467,13 @@ export function call(voice, chans, rec, slot) {
             this.foldDelta(chans, slot, rec.delta);
         return true;
     }
-    if (silent(voice, w))
+    if (silent(voice, w)) {
+        // As `contribution` leaves a silent read, so the next one is handed the same `dt`.
+        rec.delta = null;
+        rec.probed = this.now;
+        rec.seeks = voice.seeks;
         return false;
+    }
     const kept = reading.kept;
     host.ready(voice, subject, rec);
     if (this.keeps)

package/dist/fit.d.ts

@@ -1,18 +1,18 @@
 /**
- * How hard a claim on time holds when it meets another: the weaker gives way.
+ * How hard a claim on time holds when it meets another. The weaker gives way.
  *
  * @category score
  */
 export type Strength = 'weak' | 'strong' | 'required';
 /**
- * How a span lays its children out: each after the one before has ended, partway through it, or
- * all at once.
+ * How a span lays its children out. Each after the one before has ended, partway through it, or all
+ * at once.
  *
  * @category score
  */
 export type Order = 'queue' | 'stagger' | 'together';
 /**
- * One child of a span as a fit sees it: what is left of it, and the ways it may give way.
+ * One child of a span as a fit sees it. What is left of it, and the ways it may give way.
  *
  * @category score
  */
@@ -25,13 +25,16 @@ export interface Claim {
     faster: number;
     /** How many times slower it may play; 1 for no slower. */
     slower: number;
-    /** Whether it may run alongside the one before it where the span's order would not have it. */
+    /**
+     * Whether it may run alongside the one before it. It may where the span's order would not have
+     * it.
+     */
     overlap: boolean;
     /** Whether it may jump to its end instead of playing. */
     ballast: boolean;
     priority: Strength;
     /**
-     * Span ms from now before which it may not start, from its `earliest`; absent for none. Below 0
+     * Span ms from now before which it may not start. From its `earliest`; absent for none. Below 0
      * where it has passed, which places the child there.
      */
     floor?: number;
@@ -52,9 +55,9 @@ export interface SpanClaim {
     share: number;
 }
 /**
- * What a fit decides, per child in the order given: a rate over its own, and whether it is
- * skipped. `share` is how far through the one before a child that may overlap starts, and `allow`
- * the span ms the span may run past its budget.
+ * What a fit decides for each child. A rate over its own, and whether it is skipped, per child in
+ * the order given. `share` is how far through the one before a child that may overlap starts, and
+ * `allow` the span ms the span may run past its budget.
  *
  * @category score
  */
@@ -65,7 +68,8 @@ export interface FitPlan {
     allow: number;
 }
 /**
- * A strategy for fitting a span's children into its budget: from the plan so far to a new one.
+ * A strategy for fitting a span's children into its budget. It goes from the plan so far to a new
+ * one.
  *
  * @category score
  */
@@ -73,23 +77,31 @@ export type Fit = (span: SpanClaim, kids: readonly Claim[], plan: FitPlan) => Fi
 /** How far through the one before a child starts under each order, before any fit. */
 export declare function shareOf(order: Order, stagger: number): number;
 /**
- * The plan before any fit: every child at its own rate, played, in the span's order.
+ * The plan before any fit. Every child at its own rate, played, in the span's order.
  *
  * @category score
  */
 export declare function plain(span: SpanClaim, kids: readonly Claim[]): FitPlan;
 /**
- * Where a plan puts each child, span ms from now, and how long they take together. A playing child
- * is where it is, at 0; each pending one starts its share through the one before it, or at its
- * floor where that is later. A floor already past places a child before now, so it starts partway
- * through; one without a floor starts no sooner than now.
+ * Where `layout` puts a span's children.
  *
  * @category score
  */
-export declare function layout(span: SpanClaim, kids: readonly Claim[], plan: FitPlan): {
+export interface Layout {
+    /** Where each child starts, span ms from now, in the order given. */
     at: number[];
+    /** How long they take together, span ms from now. */
     length: number;
-};
+}
+/**
+ * Where a plan puts each child, and how long they take together. Times are span ms from now. A
+ * playing child is where it is, at 0; each pending one starts its share through the one before it,
+ * or at its floor where that is later. A floor already past places a child before now, so it starts
+ * partway through; one without a floor starts no sooner than now.
+ *
+ * @category score
+ */
+export declare function layout(span: SpanClaim, kids: readonly Claim[], plan: FitPlan): Layout;
 /**
  * Moves every child's rate by one factor toward the budget, before the span's fit: faster where
  * they run past it, each no faster than its `faster` allows, and slower where they leave room in
@@ -97,8 +109,8 @@ export declare function layout(span: SpanClaim, kids: readonly Claim[], plan: Fi
  */
 export declare function rescale(span: SpanClaim, kids: readonly Claim[], plan: FitPlan): FitPlan;
 /**
- * Starts children that may overlap sooner after the one before, toward all at once, until they
- * fit.
+ * Starts children that may overlap sooner, until they fit. Each moves closer after the one before,
+ * toward all at once.
  *
  * @category score
  */
@@ -116,13 +128,20 @@ export declare function shed(): Fit;
  */
 export declare function conclude(): Fit;
 /**
- * Lets the span run past its budget: up to `cap` times it, or without limit.
+ * What `overrun` and `lax` take.
  *
  * @category score
  */
-export declare function overrun(opts?: {
+export interface OverrunOptions {
+    /** The most the span may run, as a multiple of its budget. Default: no limit. */
     cap?: number;
-}): Fit;
+}
+/**
+ * Lets the span run past its budget. Up to `cap` times it, or without limit.
+ *
+ * @category score
+ */
+export declare function overrun(opts?: OverrunOptions): Fit;
 /**
  * Tries each fit in turn, handing the plan on, and stops once the children fit.
  *
@@ -130,13 +149,12 @@ export declare function overrun(opts?: {
  */
 export declare function pipe(...fits_: readonly Fit[]): Fit;
 /**
- * Every way of giving way after the span's retiming, overrunning only once the rest are spent.
+ * Every way of giving way, overrunning only once the rest are spent. It applies after the span's
+ * retiming.
  *
  * @category score
  */
-export declare function lax(opts?: {
-    cap?: number;
-}): Fit;
+export declare function lax(opts?: OverrunOptions): Fit;
 /** The fit a span takes without one of its own. */
 export declare const defaultFit: Fit;
 /**

package/dist/fit.js

@@ -3,7 +3,7 @@ export function shareOf(order, stagger) {
     return order === 'queue' ? 1 : order === 'together' ? 0 : stagger;
 }
 /**
- * The plan before any fit: every child at its own rate, played, in the span's order.
+ * The plan before any fit. Every child at its own rate, played, in the span's order.
  *
  * @category score
  */
@@ -16,10 +16,10 @@ export function plain(span, kids) {
     };
 }
 /**
- * Where a plan puts each child, span ms from now, and how long they take together. A playing child
- * is where it is, at 0; each pending one starts its share through the one before it, or at its
- * floor where that is later. A floor already past places a child before now, so it starts partway
- * through; one without a floor starts no sooner than now.
+ * Where a plan puts each child, and how long they take together. Times are span ms from now. A
+ * playing child is where it is, at 0; each pending one starts its share through the one before it,
+ * or at its floor where that is later. A floor already past places a child before now, so it starts
+ * partway through; one without a floor starts no sooner than now.
  *
  * @category score
  */
@@ -87,8 +87,8 @@ export function rescale(span, kids, plan) {
     return fits(span, kids, at(f)) ? at(f) : at(Math.max(1, f - 1e-9));
 }
 /**
- * Starts children that may overlap sooner after the one before, toward all at once, until they
- * fit.
+ * Starts children that may overlap sooner, until they fit. Each moves closer after the one before,
+ * toward all at once.
  *
  * @category score
  */
@@ -130,7 +130,7 @@ export function conclude() {
     return (_span, kids, plan) => ({ ...plan, skip: kids.map(() => true) });
 }
 /**
- * Lets the span run past its budget: up to `cap` times it, or without limit.
+ * Lets the span run past its budget. Up to `cap` times it, or without limit.
  *
  * @category score
  */
@@ -158,7 +158,8 @@ export function pipe(...fits_) {
     };
 }
 /**
- * Every way of giving way after the span's retiming, overrunning only once the rest are spent.
+ * Every way of giving way, overrunning only once the rest are spent. It applies after the span's
+ * retiming.
  *
  * @category score
  */

package/dist/fling.d.ts

@@ -0,0 +1,66 @@
+import type { Moving, Value } from './motion.js';
+/**
+ * A pointer's recent path, for the velocity it is let go at.
+ *
+ * @category fling
+ */
+export interface Track<V extends Value = number> {
+    /** Where it was at `t`, ms; samples must come in time order. */
+    add(t: number, x: V): void;
+    /**
+     * Units per second at `at`, default the latest sample: the least-squares slope of the samples
+     * within `ms` of the latest, or zero once the latest is more than `stop` ms before `at`, or with
+     * fewer than two samples.
+     */
+    velocity(at?: number): V;
+    clear(): void;
+}
+/**
+ * Tracks a pointer's velocity from its samples, with no listeners of its own: anything that can give
+ * a time and a position can feed it.
+ *
+ * @category fling
+ */
+export declare function track<V extends Value = number>(opts?: {
+    /** How far back the slope reads, ms. Default 100. */
+    ms?: number;
+    /** How long a pointer can sit still before letting go and still fling, ms. Default 40. */
+    stop?: number;
+}): Track<V>;
+/** The part of a pointer event `fling` reads. */
+export interface PointerLike {
+    pointerId: number;
+    clientX: number;
+    clientY: number;
+    timeStamp: number;
+}
+/** Anything pointer events come from: an element, or a stand-in for one. */
+export interface PointerTarget {
+    addEventListener(type: string, fn: (e: PointerLike) => void): void;
+    removeEventListener(type: string, fn: (e: PointerLike) => void): void;
+    setPointerCapture?(pointerId: number): void;
+}
+/**
+ * Drags `subject` of a motion patch, usually a `glide`, by pointer on `target`, and flings it on
+ * release at the pointer's velocity: a press stops it where it is, each move `set`s it under the
+ * pointer, and letting go `push`es it. Past the edge of a glide's `bounds` it follows less and less
+ * of the drag, never more than `give` past. One pointer at a time; a canceled one lets go at rest.
+ * Returns the function that removes its listeners.
+ *
+ * @category fling
+ */
+export declare function fling<I, O, V extends Value = number>(target: PointerTarget, motion: Pick<Moving<I, O, V>, 'read' | 'set' | 'push'> & {
+    bounds?(subject: I): readonly [min: V, max: V] | undefined;
+}, subject: I, opts?: {
+    /** Which pointer axes it follows: `'xy'` moves a subject on two axes. Default `'y'`. */
+    axis?: 'x' | 'y' | 'xy';
+    /** Units per pixel of pointer travel; -1 scrolls content against the drag. Default 1. */
+    scale?: number;
+    /**
+     * How far past an edge of the glide's bounds a drag can carry the subject, in its units; 0
+     * holds it at the edge. Default 120.
+     */
+    give?: number;
+    ms?: number;
+    stop?: number;
+}): () => void;

package/dist/fling.js

@@ -0,0 +1,162 @@
+/**
+ * Tracks a pointer's velocity from its samples, with no listeners of its own: anything that can give
+ * a time and a position can feed it.
+ *
+ * @category fling
+ */
+export function track(opts = {}) {
+    const span = opts.ms ?? 100;
+    const stop = opts.stop ?? 40;
+    if (!(span > 0) || !(stop >= 0))
+        throw new RangeError('blits: a track takes a positive ms and a stop of 0 or more');
+    const ts = [];
+    const xs = [];
+    let scalar = true;
+    return {
+        add(t, x) {
+            scalar = typeof x === 'number';
+            ts.push(t);
+            xs.push(typeof x === 'number' ? [x] : [...x]);
+            let drop = 0;
+            while (t - ts[drop] > span)
+                drop++;
+            if (drop > 0) {
+                ts.splice(0, drop);
+                xs.splice(0, drop);
+            }
+        },
+        velocity(at) {
+            const n = ts.length;
+            const axes = n === 0 ? 1 : xs[0].length;
+            const out = new Array(axes).fill(0);
+            const last = ts[n - 1];
+            if (n >= 2 && !((at ?? last) - last > stop)) {
+                let mt = 0;
+                for (const t of ts)
+                    mt += t;
+                mt /= n;
+                let tt = 0;
+                for (const t of ts)
+                    tt += (t - mt) ** 2;
+                if (tt > 0)
+                    for (let k = 0; k < axes; k++) {
+                        let mx = 0;
+                        for (const x of xs)
+                            mx += x[k];
+                        mx /= n;
+                        let tx = 0;
+                        for (let i = 0; i < n; i++)
+                            tx += (ts[i] - mt) * (xs[i][k] - mx);
+                        out[k] = (tx / tt) * 1000;
+                    }
+            }
+            return (scalar ? out[0] : out);
+        },
+        clear() {
+            ts.length = 0;
+            xs.length = 0;
+        },
+    };
+}
+/** How much of a drag past an edge the subject follows, right at the edge. */
+const PULL = 0.55;
+/** How far a drag `d` past an edge carries the subject, never as far as `give`. */
+const resist = (d, give) => give > 0 ? give * (1 - 1 / ((PULL * d) / give + 1)) : 0;
+/** The drag past an edge that carries the subject `r` past it, as `resist` maps it. */
+const unresist = (r, give) => {
+    const held = Math.min(r, give * 0.99);
+    return give > 0 ? (give * held) / (PULL * (give - held)) : 0;
+};
+/**
+ * Drags `subject` of a motion patch, usually a `glide`, by pointer on `target`, and flings it on
+ * release at the pointer's velocity: a press stops it where it is, each move `set`s it under the
+ * pointer, and letting go `push`es it. Past the edge of a glide's `bounds` it follows less and less
+ * of the drag, never more than `give` past. One pointer at a time; a canceled one lets go at rest.
+ * Returns the function that removes its listeners.
+ *
+ * @category fling
+ */
+export function fling(target, motion, subject, opts = {}) {
+    const axis = opts.axis ?? 'y';
+    const scale = opts.scale ?? 1;
+    const give = opts.give ?? 120;
+    if (!(give >= 0))
+        throw new RangeError('blits: a fling takes a give of 0 or more');
+    let lo;
+    let hi;
+    /** Where the drag `x` puts the subject, past an edge carried by `resist`. */
+    const held = (x) => lo === undefined || hi === undefined
+        ? x
+        : x.map((xi, k) => {
+            const a = lo[k];
+            const b = hi[k];
+            return xi < a ? a - resist(a - xi, give) : xi > b ? b + resist(xi - b, give) : xi;
+        });
+    /** The drag that puts the subject at `x`, as `held` maps it. */
+    const dragged = (x) => lo === undefined || hi === undefined
+        ? x
+        : x.map((xi, k) => {
+            const a = lo[k];
+            const b = hi[k];
+            return xi < a ? a - unresist(a - xi, give) : xi > b ? b + unresist(xi - b, give) : xi;
+        });
+    const path = track(opts);
+    let id;
+    let from = [];
+    let p0 = [];
+    const at = (e) => axis === 'x' ? [e.clientX] : axis === 'y' ? [e.clientY] : [e.clientX, e.clientY];
+    const value = (x) => (axis === 'xy' ? x : x[0]);
+    const flat = (v) => (typeof v === 'number' ? [v] : [...v]);
+    const zero = () => value(from.map(() => 0));
+    const down = (e) => {
+        if (id !== undefined)
+            return;
+        const now = motion.read(subject);
+        if (now === undefined)
+            return;
+        id = e.pointerId;
+        target.setPointerCapture?.(id);
+        const edges = motion.bounds?.(subject);
+        lo = edges === undefined ? undefined : flat(edges[0]);
+        hi = edges === undefined ? undefined : flat(edges[1]);
+        const here = flat(now.value);
+        from = dragged(here);
+        p0 = at(e);
+        motion.push(subject, zero());
+        // The push alone would spring a subject caught past an edge back; a set there holds it.
+        motion.set(subject, value(here));
+        path.clear();
+        path.add(e.timeStamp, here);
+    };
+    const move = (e) => {
+        if (e.pointerId !== id)
+            return;
+        const x = held(at(e).map((p, k) => from[k] + (p - p0[k]) * scale));
+        motion.set(subject, value(x));
+        path.add(e.timeStamp, x);
+    };
+    const up = (e) => {
+        if (e.pointerId !== id)
+            return;
+        id = undefined;
+        motion.push(subject, value(path.velocity(e.timeStamp)));
+    };
+    const cancel = (e) => {
+        if (e.pointerId !== id)
+            return;
+        id = undefined;
+        motion.push(subject, zero());
+    };
+    const on = [
+        ['pointerdown', down],
+        ['pointermove', move],
+        ['pointerup', up],
+        ['pointercancel', cancel],
+    ];
+    for (const [type, fn] of on)
+        target.addEventListener(type, fn);
+    return () => {
+        for (const [type, fn] of on)
+            target.removeEventListener(type, fn);
+    };
+}