@lvl99dotcom/paintcanvas 0.0.0-stage → 0.2.0

package/dist/lib/brushes/StrokeEngine/index.js

@@ -0,0 +1,324 @@
+import { randomSeed, seededRandom } from "../../utils/random/index.js";
+import { createOffscreenCanvas } from "../../classes/Layer/index.js";
+import StrokeSampler from "../StrokeSampler/index.js";
+import StrokePath from "../StrokePath/index.js";
+import { pointInput, snapStamp, stampParams } from "../params/index.js";
+// src/lib/brushes/StrokeEngine/index.ts
+/** Extra pixels added around each stamp's bounds so anti-aliased edges are included */
+var STAMP_MARGIN = 2;
+/**
+* Grow a rectangle to include another (the first may be empty).
+*
+* @example
+* unionRect({ x: 0, y: 0, width: 10, height: 10 }, { x: 20, y: 5, width: 5, height: 5 });
+* // { x: 0, y: 0, width: 25, height: 10 }
+*/
+var unionRect = (a, b) => {
+	if (!a) return b;
+	const x = Math.min(a.x, b.x);
+	const y = Math.min(a.y, b.y);
+	return {
+		x,
+		y,
+		width: Math.max(a.x + a.width, b.x + b.width) - x,
+		height: Math.max(a.y + a.height, b.y + b.height) - y
+	};
+};
+/**
+* Snap a rectangle outwards to whole pixels and clip it to the canvas. Returns undefined if nothing is left.
+*/
+var clipRect = (rect, width, height) => {
+	const x = Math.max(0, Math.floor(rect.x));
+	const y = Math.max(0, Math.floor(rect.y));
+	const right = Math.min(width, Math.ceil(rect.x + rect.width));
+	const bottom = Math.min(height, Math.ceil(rect.y + rect.height));
+	return right > x && bottom > y ? {
+		x,
+		y,
+		width: right - x,
+		height: bottom - y
+	} : void 0;
+};
+/** How the stroke buffer is merged into the layer, or null if the stroke cannot change it */
+var compositeOperation = (mode, alphaLock) => {
+	if (mode === "erase") return alphaLock ? null : "destination-out";
+	return alphaLock ? "source-atop" : "source-over";
+};
+/** Event dispatched just before a finished stroke is written into its layer */
+var BEFORE_COMMIT_EVENT = "beforecommit";
+/** Event dispatched when a stroke starts */
+var STROKE_BEGIN_EVENT = "strokebegin";
+/** Event dispatched when a stroke ends: written into its layer, or cancelled */
+var STROKE_END_EVENT = "strokeend";
+/**
+* Draws brush and eraser strokes.
+*
+* Stamps are drawn at full strength into a stroke buffer, so overlapping stamps within one stroke do not build up opacity.
+* The buffer is merged into the layer with the stroke's opacity (the preset's `alpha`):
+* - Brush: painted over the layer (or only onto existing pixels when the layer's alpha lock is on).
+* - Eraser: removes the buffer's shape from the layer (does nothing when alpha lock is on).
+* - With a mask, the buffer is first cut to the mask, so the stroke only applies inside it.
+*
+* While drawing, `preview` provides the layer with the stroke merged in, to draw instead of the layer. The stroke is written into the layer when it ends.
+*
+* Dispatches a `change` event whenever the preview changes, and when a stroke is committed or cancelled. Dispatches a
+* `beforecommit` event (with `StrokeCommitDetail`) just before a stroke that changes its layer is written into it, so
+* the area can be recorded for undo. Dispatches `strokebegin` when a stroke starts and `strokeend` when it's committed or
+* cancelled.
+*
+* @example
+* engine.begin(options, { x: 10, y: 10, pressure: 0.5 }, event.timeStamp);
+* engine.move({ x: 20, y: 12 }, event.timeStamp);
+* engine.end({ x: 25, y: 15 }, event.timeStamp);
+*/
+var StrokeEngine = class extends EventTarget {
+	/** Canvas width in pixels */
+	width;
+	/** Canvas height in pixels */
+	height;
+	createCanvas;
+	bufferCanvas;
+	workingCanvas;
+	maskedCanvas;
+	active;
+	/** Area of the preview changed since `takeChangedArea` was last called */
+	changedArea;
+	/** Whether strokes record their points and stamps for the debug overlay */
+	debugEnabled = false;
+	/** Points recorded and stamps placed by the current or last stroke (only while `debugEnabled`) */
+	debugTrace = {
+		points: [],
+		stamps: []
+	};
+	constructor(width, height, createCanvas = createOffscreenCanvas) {
+		super();
+		this.width = width;
+		this.height = height;
+		this.createCanvas = createCanvas;
+	}
+	/**
+	* The area of the canvas whose preview changed since this was last called (stamps placed, or a stroke cancelled or
+	* written into its layer), to redraw only that area; undefined if nothing changed.
+	*/
+	takeChangedArea() {
+		const area = this.changedArea;
+		this.changedArea = void 0;
+		return area;
+	}
+	/** Whether a stroke is in progress */
+	get drawing() {
+		return this.active !== void 0;
+	}
+	/** The layer with the stroke in progress merged in, to draw in its place; undefined when not drawing */
+	get preview() {
+		return this.active && this.workingCanvas ? {
+			layer: this.active.options.layer,
+			image: this.workingCanvas
+		} : void 0;
+	}
+	/** The stroke buffer (created on first use) */
+	get buffer() {
+		this.bufferCanvas ??= this.createCanvas(this.width, this.height);
+		return this.bufferCanvas;
+	}
+	/** The preview canvas (created on first use) */
+	get working() {
+		this.workingCanvas ??= this.createCanvas(this.width, this.height);
+		return this.workingCanvas;
+	}
+	/**
+	* Turn recording of stroke points and stamps (for the debug overlay) on or off.
+	*/
+	setDebug(enabled) {
+		this.debugEnabled = enabled;
+		this.debugTrace.points = [];
+		this.debugTrace.stamps = [];
+		this.dispatchEvent(new Event("change"));
+	}
+	/**
+	* Record a sampled point for the debug overlay.
+	*/
+	trace(point) {
+		if (point && this.debugEnabled) this.debugTrace.points.push(point);
+		return point;
+	}
+	/**
+	* Start a stroke at the pointer-down point. Cancels any stroke already in progress.
+	*/
+	begin(options, point, time) {
+		this.cancel();
+		const seed = options.seed ?? randomSeed();
+		this.active = {
+			options,
+			seed,
+			random: options.random ?? seededRandom(seed),
+			points: [{
+				...point,
+				time
+			}],
+			sampler: new StrokeSampler(options.preset.sampleRate),
+			path: new StrokePath(options.preset.smoothingType, options.preset.spacing)
+		};
+		this.dispatchEvent(new Event(STROKE_BEGIN_EVENT));
+		const ctx = this.working.getContext("2d");
+		ctx.globalCompositeOperation = "copy";
+		ctx.drawImage(options.layer.canvas, 0, 0);
+		ctx.globalCompositeOperation = "source-over";
+		this.debugTrace.points = [];
+		this.debugTrace.stamps = [];
+		this.place(this.active.path.add(this.trace(this.active.sampler.start(point, time))));
+	}
+	/**
+	* Continue the stroke as the pointer moves. Points are recorded at the preset's sample rate.
+	*/
+	move(point, time) {
+		const active = this.active;
+		if (!active) return;
+		active.points.push({
+			...point,
+			time
+		});
+		const recorded = this.trace(active.sampler.move(point, time));
+		if (recorded) this.place(active.path.add(recorded));
+	}
+	/**
+	* Finish the stroke at the pointer-up point and write it into the layer.
+	*/
+	end(point, time) {
+		const active = this.active;
+		if (!active) return;
+		active.points.push({
+			...point,
+			time
+		});
+		const recorded = this.trace(active.sampler.end(point, time));
+		const stamps = recorded ? active.path.add(recorded) : [];
+		this.place([...stamps, ...active.path.finish()]);
+		this.commit(active);
+	}
+	/**
+	* Abandon the stroke in progress without changing the layer.
+	*/
+	cancel() {
+		const active = this.active;
+		if (!active) return;
+		this.clearBuffer(active.dirty);
+		if (active.dirty) this.changedArea = unionRect(this.changedArea, active.dirty);
+		this.active = void 0;
+		this.dispatchEvent(new Event(STROKE_END_EVENT));
+		this.dispatchEvent(new Event("change"));
+	}
+	/**
+	* Stamp the shape at each point into the buffer, then refresh the preview where it changed.
+	*/
+	place(points) {
+		const active = this.active;
+		if (points.length === 0) return;
+		if (this.debugEnabled) this.debugTrace.stamps.push(...points);
+		const { preset, size, tip, colour, mode, isPen } = active.options;
+		const { random } = active;
+		const ctx = this.buffer.getContext("2d");
+		const stampPreset = {
+			...preset,
+			alpha: 1
+		};
+		let changed;
+		for (const point of points) {
+			const varied = stampParams(stampPreset, size, pointInput(point, isPen), random);
+			const { x, y, params } = preset.snapToPixelGrid ? snapStamp(point.x, point.y, varied) : {
+				x: point.x,
+				y: point.y,
+				params: varied
+			};
+			tip.stamp(ctx, x, y, params, mode === "erase" ? "#000000" : colour);
+			const reach = Math.hypot(params.width, params.height) / 2 + STAMP_MARGIN;
+			changed = unionRect(changed, {
+				x: x + params.offsetX - reach,
+				y: y + params.offsetY - reach,
+				width: reach * 2,
+				height: reach * 2
+			});
+		}
+		const area = changed && clipRect(changed, this.width, this.height);
+		if (!area) return;
+		active.dirty = unionRect(active.dirty, area);
+		this.changedArea = unionRect(this.changedArea, area);
+		this.mergeInto(this.working, active, area, true);
+		this.dispatchEvent(new Event("change"));
+	}
+	/**
+	* Merge the buffer into a target canvas within an area. For the preview, the area is first reset to the layer's pixels.
+	*/
+	mergeInto(target, active, area, resetFromLayer) {
+		const { layer, preset, mode } = active.options;
+		const ctx = target.getContext("2d");
+		const { x, y, width, height } = area;
+		ctx.save();
+		if (resetFromLayer) {
+			ctx.clearRect(x, y, width, height);
+			ctx.drawImage(layer.canvas, x, y, width, height, x, y, width, height);
+		}
+		const operation = compositeOperation(mode, layer.alphaLock);
+		if (operation) {
+			ctx.globalAlpha = Math.max(0, Math.min(1, preset.alpha ?? 1));
+			ctx.globalCompositeOperation = operation;
+			ctx.drawImage(this.strokeImage(active, area), x, y, width, height, x, y, width, height);
+		}
+		ctx.restore();
+	}
+	/**
+	* The stroke buffer, cut to the mask within an area when a mask is active (partially masked areas let partial paint through).
+	*/
+	strokeImage(active, area) {
+		const mask = active.options.mask;
+		if (!mask) return this.buffer;
+		this.maskedCanvas ??= this.createCanvas(this.width, this.height);
+		const ctx = this.maskedCanvas.getContext("2d");
+		const { x, y, width, height } = area;
+		ctx.save();
+		ctx.globalCompositeOperation = "copy";
+		ctx.drawImage(this.buffer, x, y, width, height, x, y, width, height);
+		ctx.globalCompositeOperation = "destination-in";
+		ctx.drawImage(mask, x, y, width, height, x, y, width, height);
+		ctx.restore();
+		return this.maskedCanvas;
+	}
+	/**
+	* Write the finished stroke into its layer and reset for the next stroke.
+	*/
+	commit(active) {
+		const { layer, mode, preset, size, colour, isPen } = active.options;
+		if (active.dirty) {
+			if (compositeOperation(mode, layer.alphaLock)) {
+				const stroke = {
+					mode,
+					preset,
+					size,
+					colour,
+					isPen,
+					seed: active.seed,
+					points: active.points
+				};
+				this.dispatchEvent(new CustomEvent(BEFORE_COMMIT_EVENT, { detail: {
+					layer,
+					area: active.dirty,
+					stroke
+				} }));
+			}
+			this.mergeInto(active.options.layer.canvas, active, active.dirty, false);
+			this.clearBuffer(active.dirty);
+			this.changedArea = unionRect(this.changedArea, active.dirty);
+		}
+		this.active = void 0;
+		this.dispatchEvent(new Event(STROKE_END_EVENT));
+		this.dispatchEvent(new Event("change"));
+	}
+	/**
+	* Clear an area of the stroke buffer.
+	*/
+	clearBuffer(area) {
+		if (!area) return;
+		this.buffer.getContext("2d").clearRect(area.x, area.y, area.width, area.height);
+	}
+};
+export { BEFORE_COMMIT_EVENT, STROKE_BEGIN_EVENT, STROKE_END_EVENT, clipRect, StrokeEngine as default, unionRect };

package/dist/lib/brushes/StrokePath/index.d.ts

@@ -0,0 +1,53 @@
+import { SmoothingType, type BrushStrokePoint } from "../types";
+/** Largest allowed spacing between stamps, in pixels */
+export declare const MAX_SPACING = 200;
+/** Default spacing between stamps, in pixels */
+export declare const DEFAULT_SPACING = 5;
+/** Length in pixels of the straight pieces curves are split into */
+export declare const CURVE_STEP = 1;
+/**
+ * Distance between stamps for a preset's spacing: 0–200 px, where 0 means a stamp at every pixel.
+ *
+ * @example
+ * stampStep(0); // 1
+ * stampStep(500); // 200
+ */
+export declare const stampStep: (spacing: number | undefined) => number;
+/**
+ * Builds a stroke's line from its recorded points and places stamps along it, `spacing` pixels apart. Works incrementally while drawing:
+ * each new point returns the stamps that can now be placed.
+ *
+ * Smoothing:
+ * - Linear (and None): straight lines between points.
+ * - BezierQuad: quadratic curves through the midpoints between points (no lag).
+ * - BezierCubic: cubic curves whose handles follow the direction of movement before and after each point (lags one point until the next arrives).
+ *
+ * @example
+ * const path = new StrokePath(SmoothingType.Linear, 5);
+ * path.add({ x: 0, y: 0 }); // [{ x: 0, y: 0 }]
+ * path.add({ x: 10, y: 0 }); // [{ x: 5, y: 0 }, { x: 10, y: 0 }]
+ * path.finish(); // []
+ */
+export default class StrokePath {
+    /** Pixels between stamps */
+    readonly step: number;
+    private readonly smoothing;
+    private readonly points;
+    /** End of the line built so far */
+    private tip?;
+    /** Distance along the line until the next stamp */
+    private untilNext;
+    constructor(smoothing?: SmoothingType, spacing?: number);
+    /**
+     * Add a recorded point. Returns the stamps placed along the line this point completes (the first point always gets a stamp).
+     */
+    add(point: BrushStrokePoint): BrushStrokePoint[];
+    /**
+     * Finish the stroke: returns stamps for the last part of the line that was waiting for more points.
+     */
+    finish(): BrushStrokePoint[];
+    /**
+     * Extend the line through the given points and return stamps placed every `step` pixels along it.
+     */
+    private walk;
+}

package/dist/lib/brushes/StrokePath/index.js

@@ -0,0 +1,161 @@
+import { SmoothingType } from "../types/index.js";
+// src/lib/brushes/StrokePath/index.ts
+/** Largest allowed spacing between stamps, in pixels */
+var MAX_SPACING = 200;
+/** Default spacing between stamps, in pixels */
+var DEFAULT_SPACING = 5;
+/** Length in pixels of the straight pieces curves are split into */
+var CURVE_STEP = 1;
+/**
+* Distance between stamps for a preset's spacing: 0–200 px, where 0 means a stamp at every pixel.
+*
+* @example
+* stampStep(0); // 1
+* stampStep(500); // 200
+*/
+var stampStep = (spacing) => Math.max(1, Math.min(200, spacing ?? 5));
+/**
+* Interpolate between two stroke points: position, pressure and tilt.
+*/
+var mix = (a, b, t) => {
+	const value = (from, to) => from === void 0 || to === void 0 ? from ?? to : from + (to - from) * t;
+	const point = {
+		x: a.x + (b.x - a.x) * t,
+		y: a.y + (b.y - a.y) * t
+	};
+	const pressure = value(a.pressure, b.pressure);
+	const tiltX = value(a.tiltX, b.tiltX);
+	const tiltY = value(a.tiltY, b.tiltY);
+	if (pressure !== void 0) point.pressure = pressure;
+	if (tiltX !== void 0) point.tiltX = tiltX;
+	if (tiltY !== void 0) point.tiltY = tiltY;
+	return point;
+};
+/** Distance between two points */
+var distance = (a, b) => Math.hypot(b.x - a.x, b.y - a.y);
+/**
+* Split a curve into short straight pieces about `CURVE_STEP` pixels long.
+*
+* @param at - position on the curve for t from 0 to 1
+* @param approxLength - rough curve length, used to choose how many pieces
+*/
+var flatten = (at, approxLength) => {
+	const pieces = Math.max(1, Math.ceil(approxLength / 1));
+	const points = [];
+	for (let i = 1; i <= pieces; i++) points.push(at(i / pieces));
+	return points;
+};
+/**
+* Quadratic Bézier from `a` to `b` with control point `c`. Pressure and tilt blend from `a` to `b`.
+*/
+var quadratic = (a, c, b) => flatten((t) => {
+	const point = mix(a, b, t);
+	const u = 1 - t;
+	point.x = u * u * a.x + 2 * u * t * c.x + t * t * b.x;
+	point.y = u * u * a.y + 2 * u * t * c.y + t * t * b.y;
+	return point;
+}, distance(a, c) + distance(c, b));
+/**
+* Cubic Bézier from `a` to `b` with handles `c1` and `c2`. Pressure and tilt blend from `a` to `b`.
+*/
+var cubic = (a, c1, c2, b) => flatten((t) => {
+	const point = mix(a, b, t);
+	const u = 1 - t;
+	point.x = u * u * u * a.x + 3 * u * u * t * c1.x + 3 * u * t * t * c2.x + t * t * t * b.x;
+	point.y = u * u * u * a.y + 3 * u * u * t * c1.y + 3 * u * t * t * c2.y + t * t * t * b.y;
+	return point;
+}, distance(a, c1) + distance(c1, c2) + distance(c2, b));
+/**
+* The curve between `p1` and `p2` whose handles follow the direction of movement from `p0` to `p2` and from `p1` to `p3` (Catmull–Rom).
+*/
+var catmullRom = (p0, p1, p2, p3) => cubic(p1, {
+	x: p1.x + (p2.x - p0.x) / 6,
+	y: p1.y + (p2.y - p0.y) / 6
+}, {
+	x: p2.x - (p3.x - p1.x) / 6,
+	y: p2.y - (p3.y - p1.y) / 6
+}, p2);
+/**
+* Builds a stroke's line from its recorded points and places stamps along it, `spacing` pixels apart. Works incrementally while drawing:
+* each new point returns the stamps that can now be placed.
+*
+* Smoothing:
+* - Linear (and None): straight lines between points.
+* - BezierQuad: quadratic curves through the midpoints between points (no lag).
+* - BezierCubic: cubic curves whose handles follow the direction of movement before and after each point (lags one point until the next arrives).
+*
+* @example
+* const path = new StrokePath(SmoothingType.Linear, 5);
+* path.add({ x: 0, y: 0 }); // [{ x: 0, y: 0 }]
+* path.add({ x: 10, y: 0 }); // [{ x: 5, y: 0 }, { x: 10, y: 0 }]
+* path.finish(); // []
+*/
+var StrokePath = class {
+	/** Pixels between stamps */
+	step;
+	smoothing;
+	points = [];
+	/** End of the line built so far */
+	tip;
+	/** Distance along the line until the next stamp */
+	untilNext = 0;
+	constructor(smoothing = SmoothingType.Linear, spacing) {
+		this.smoothing = smoothing;
+		this.step = stampStep(spacing);
+	}
+	/**
+	* Add a recorded point. Returns the stamps placed along the line this point completes (the first point always gets a stamp).
+	*/
+	add(point) {
+		const points = this.points;
+		points.push(point);
+		const n = points.length;
+		if (n === 1) {
+			this.tip = point;
+			this.untilNext = this.step;
+			return [point];
+		}
+		const prev = points[n - 2];
+		switch (this.smoothing) {
+			case SmoothingType.BezierQuad: return n === 2 ? this.walk([mix(prev, point, .5)]) : this.walk(quadratic(this.tip, prev, mix(prev, point, .5)));
+			case SmoothingType.BezierCubic:
+				if (n === 2) return [];
+				return this.walk(catmullRom(points[n - 4] ?? points[n - 3], points[n - 3], prev, point));
+			default: return this.walk([point]);
+		}
+	}
+	/**
+	* Finish the stroke: returns stamps for the last part of the line that was waiting for more points.
+	*/
+	finish() {
+		const points = this.points;
+		const n = points.length;
+		const last = points[n - 1];
+		if (!last || n < 2) return [];
+		switch (this.smoothing) {
+			case SmoothingType.BezierQuad: return this.walk([last]);
+			case SmoothingType.BezierCubic: return this.walk(catmullRom(points[n - 3] ?? points[n - 2], points[n - 2], last, last));
+			default: return [];
+		}
+	}
+	/**
+	* Extend the line through the given points and return stamps placed every `step` pixels along it.
+	*/
+	walk(points) {
+		const stamps = [];
+		for (const next of points) {
+			const from = this.tip;
+			const length = distance(from, next);
+			let travelled = 0;
+			while (length - travelled >= this.untilNext) {
+				travelled += this.untilNext;
+				stamps.push(mix(from, next, travelled / length));
+				this.untilNext = this.step;
+			}
+			this.untilNext -= length - travelled;
+			this.tip = next;
+		}
+		return stamps;
+	}
+};
+export { CURVE_STEP, DEFAULT_SPACING, MAX_SPACING, StrokePath as default, stampStep };

package/dist/lib/brushes/StrokeSampler/index.d.ts

@@ -0,0 +1,55 @@
+import type { BrushStrokePoint } from "../types";
+/** Shortest allowed sample rate in milliseconds */
+export declare const MIN_SAMPLE_RATE = 5;
+/** Longest allowed sample rate in milliseconds */
+export declare const MAX_SAMPLE_RATE = 400;
+/** Default sample rate in milliseconds */
+export declare const DEFAULT_SAMPLE_RATE = 5;
+/**
+ * Clamp a preset's sample rate to 5–400 ms.
+ *
+ * @example
+ * clampSampleRate(1000); // 400
+ */
+export declare const clampSampleRate: (rate: number | undefined) => number;
+/**
+ * Records a stroke's points over time: the first point (pointer down), then a point at most every `sampleRate` milliseconds while the pointer moves, and the last point (pointer up).
+ * No points are recorded while the pointer is still, even if it is held down.
+ *
+ * @example
+ * const sampler = new StrokeSampler(50);
+ * sampler.start({ x: 0, y: 0 }, 0);
+ * sampler.move({ x: 5, y: 0 }, 20); // undefined (too soon)
+ * sampler.move({ x: 9, y: 0 }, 60); // recorded
+ * sampler.end({ x: 12, y: 0 }, 70); // recorded
+ */
+export default class StrokeSampler {
+    /** Milliseconds between recorded points */
+    readonly sampleRate: number;
+    /** Points recorded so far */
+    readonly points: BrushStrokePoint[];
+    private lastTime;
+    constructor(sampleRate?: number);
+    /** The most recently recorded point */
+    get last(): BrushStrokePoint | undefined;
+    /**
+     * Begin a stroke at the pointer-down point. Always recorded.
+     */
+    start(point: BrushStrokePoint, time: number): BrushStrokePoint;
+    /**
+     * Offer a point while the pointer moves. Returns it if recorded: enough time has passed and the pointer has moved.
+     */
+    move(point: BrushStrokePoint, time: number): BrushStrokePoint | undefined;
+    /**
+     * Finish the stroke at the pointer-up point. Returns it if recorded (it differs from the last recorded position).
+     */
+    end(point: BrushStrokePoint, time: number): BrushStrokePoint | undefined;
+    /**
+     * Check whether a point is at a different position from the last recorded point.
+     */
+    private hasMoved;
+    /**
+     * Record a point.
+     */
+    private record;
+}

package/dist/lib/brushes/StrokeSampler/index.js

@@ -0,0 +1,75 @@
+// src/lib/brushes/StrokeSampler/index.ts
+/** Shortest allowed sample rate in milliseconds */
+var MIN_SAMPLE_RATE = 5;
+/** Longest allowed sample rate in milliseconds */
+var MAX_SAMPLE_RATE = 400;
+/** Default sample rate in milliseconds */
+var DEFAULT_SAMPLE_RATE = 5;
+/**
+* Clamp a preset's sample rate to 5–400 ms.
+*
+* @example
+* clampSampleRate(1000); // 400
+*/
+var clampSampleRate = (rate) => Math.max(5, Math.min(400, rate ?? 5));
+/**
+* Records a stroke's points over time: the first point (pointer down), then a point at most every `sampleRate` milliseconds while the pointer moves, and the last point (pointer up).
+* No points are recorded while the pointer is still, even if it is held down.
+*
+* @example
+* const sampler = new StrokeSampler(50);
+* sampler.start({ x: 0, y: 0 }, 0);
+* sampler.move({ x: 5, y: 0 }, 20); // undefined (too soon)
+* sampler.move({ x: 9, y: 0 }, 60); // recorded
+* sampler.end({ x: 12, y: 0 }, 70); // recorded
+*/
+var StrokeSampler = class {
+	/** Milliseconds between recorded points */
+	sampleRate;
+	/** Points recorded so far */
+	points = [];
+	lastTime = 0;
+	constructor(sampleRate) {
+		this.sampleRate = clampSampleRate(sampleRate);
+	}
+	/** The most recently recorded point */
+	get last() {
+		return this.points.at(-1);
+	}
+	/**
+	* Begin a stroke at the pointer-down point. Always recorded.
+	*/
+	start(point, time) {
+		this.points.length = 0;
+		return this.record(point, time);
+	}
+	/**
+	* Offer a point while the pointer moves. Returns it if recorded: enough time has passed and the pointer has moved.
+	*/
+	move(point, time) {
+		if (time - this.lastTime < this.sampleRate || !this.hasMoved(point)) return void 0;
+		return this.record(point, time);
+	}
+	/**
+	* Finish the stroke at the pointer-up point. Returns it if recorded (it differs from the last recorded position).
+	*/
+	end(point, time) {
+		return this.hasMoved(point) ? this.record(point, time) : void 0;
+	}
+	/**
+	* Check whether a point is at a different position from the last recorded point.
+	*/
+	hasMoved(point) {
+		const last = this.last;
+		return !last || last.x !== point.x || last.y !== point.y;
+	}
+	/**
+	* Record a point.
+	*/
+	record(point, time) {
+		this.points.push(point);
+		this.lastTime = time;
+		return point;
+	}
+};
+export { DEFAULT_SAMPLE_RATE, MAX_SAMPLE_RATE, MIN_SAMPLE_RATE, clampSampleRate, StrokeSampler as default };