@logomarks/core 0.1.11 → 0.2.1

package/src/forms/ref.js

@@ -0,0 +1,246 @@
+/**
+ * Four constructions from the reference sheets, as small helpers a generator composes (constructions only; no mark's
+ * geometry lives here):
+ *
+ * - rotation ("Bold · Rotational"): turns() sets one unit round a centre n times; cyclic() puts each copy in front of the
+ *   one before it (a cyclic overlap on any unit), every crossing parted by the gap;
+ * - stripes ("Bold · Stripes"): stripeBands() draws stripes as bands between two edge functions of x, so a stripe can
+ *   ripple or taper; stripesAlong() bends them with mitred corners, widths held square to each run; evenBands() spaces
+ *   n stripes evenly across a span and thinning() with a fixed gap, their widths easing from one end to the other;
+ * - guilloche ("Line · Guilloche"): waveRing() is the closed curve the bold guilloche strands run along (the kit's
+ *   weave() parts them over and under);
+ * - speed italics ("Letters · Speed"): italic() slants a glyph built upright, wedge() is the one sharp notch, and the
+ *   slab capitals (SPEED_GLYPHS, on SPEED_BOX) take the speed slit (slit()) through speed().
+ *
+ * From the Logomarks tools (refparts.mjs, batch 237; the speed capitals shared from batch 240).
+ */
+import { C, poly, rect, rot, mapPts, U, D, grown, closedCurve, mitreBand as band, mitreOffset as mitreOff } from '../geometry/index.js';
+
+/* ---------- rotation ---------- */
+
+/**
+ * n copies of a shape turned evenly round (cx, cy), the first turned deg0: a list, not yet united.
+ *
+ * @param {import('../geometry/types.js').Geom} g The unit.
+ * @param {number} n How many.
+ * @param {number} [deg0=0] The first copy's turn (degrees).
+ * @param {number} [cx=C] The centre.
+ * @param {number} [cy=C] The centre.
+ * @returns {import('../geometry/types.js').Geom[]} The copies.
+ */
+export const turns = (g, n, deg0 = 0, cx = C, cy = C) => [...Array(n)].map((_, k) => rot(g, deg0 + (360 * k) / n, cx, cy));
+
+/**
+ * A cyclic overlap: every unit cut free by the next one round, so each lies in front of one neighbour and behind the
+ * other (no real stack does that, which is the move); every crossing is parted by g.
+ *
+ * @param {readonly import('../geometry/types.js').Geom[]} units The units, in order round.
+ * @param {number} g The gap.
+ * @returns {import('../geometry/types.js').Shape} The overlap.
+ */
+export const cyclic = (units, g) => U(...units.map((u, k) => D(u, grown(units[(k + 1) % units.length], g))));
+
+/**
+ * A chevron: two arms w wide meeting at a sharp apex at the origin, opening `spread` degrees, pointing along +x, each
+ * arm L long (measured along its outer edge). Move and turn it into place.
+ *
+ * @param {number} L The arms' length.
+ * @param {number} w Their width.
+ * @param {number} spread The opening (degrees).
+ * @returns {import('../geometry/types.js').Polygon} The chevron.
+ */
+export function chevron(L, w, spread) {
+	const h = (spread / 2) * (Math.PI / 180), s = w / Math.sin(h);
+	const arm = (k) => [-L * Math.cos(h), k * L * Math.sin(h)];
+	const a = arm(1), b = arm(-1), tipIn = [-s, 0];
+	const inner = (p) => [p[0] - s, p[1]];
+	return poly([[0, 0], b, inner(b), tipIn, inner(a), a]);
+}
+
+/* ---------- stripes ---------- */
+
+/**
+ * Stripes as bands: each entry [top, bottom], each a number or a function of x (y down), sampled every dx across the
+ * canvas and beyond, so a region clips them.
+ *
+ * @param {readonly (readonly (number | ((x: number) => number))[])[]} list The stripes' [top, bottom] edges.
+ * @param {{ x0?: number, x1?: number, dx?: number }} [o] Where the sampling starts (−80) and ends (592), and its step (4).
+ * @returns {import('../geometry/types.js').Shape} The stripes.
+ */
+export function stripeBands(list, { x0 = -80, x1 = 592, dx = 4 } = {}) {
+	const at = (f, x) => (typeof f === 'function' ? f(x) : f), xs = [];
+	for (let x = x0; x <= x1 + 1e-9; x += dx) xs.push(x);
+	return U(...list.map(([t, b]) => poly([...xs.map((x) => [x, at(t, x)]), ...xs.slice().reverse().map((x) => [x, at(b, x)])])));
+}
+
+/**
+ * n even stripes across [a, b] with a gap gs between them.
+ *
+ * @param {number} n How many.
+ * @param {number} a Where they start.
+ * @param {number} b Where they end.
+ * @param {number} gs The gap between two.
+ * @returns {[number, number][]} Each stripe's [top, bottom].
+ */
+export const evenBands = (n, a, b, gs) => { const w = (b - a - (n - 1) * gs) / n; return [...Array(n)].map((_, k) => [a + k * (w + gs), a + k * (w + gs) + w]); };
+
+/**
+ * n stripes across [a, b] with a fixed gap gs, their widths in the ratio r0 : r1 from the first to the last (linear).
+ *
+ * @param {number} n How many.
+ * @param {number} a Where they start.
+ * @param {number} b Where they end.
+ * @param {number} gs The gap between two.
+ * @param {number} r0 The first stripe's share.
+ * @param {number} r1 The last stripe's share.
+ * @returns {[number, number][]} Each stripe's [top, bottom].
+ */
+export function thinning(n, a, b, gs, r0, r1) {
+	const ws = [...Array(n)].map((_, k) => r0 + ((r1 - r0) * k) / (n - 1)), k = (b - a - (n - 1) * gs) / ws.reduce((s, v) => s + v, 0);
+	let y = a; return ws.map((v) => { const out = [y, y + v * k]; y += v * k + gs; return out; });
+}
+
+/**
+ * n stripes w wide along a polyline, `pitch` apart measured square to every run (corners mitred), so a stripe that
+ * bends keeps its width and every gap through the bend.
+ *
+ * @param {readonly import('../geometry/types.js').Point[]} pts The polyline.
+ * @param {number} n How many stripes.
+ * @param {number} w Their width.
+ * @param {number} pitch Centre to centre.
+ * @returns {import('../geometry/types.js').Shape} The stripes.
+ */
+export const stripesAlong = (pts, n, w, pitch) => U(...[...Array(n)].map((_, k) => band(mitreOff(pts, (k - (n - 1) / 2) * pitch), w)));
+
+/**
+ * A stripe list shifted by f(x), so every stripe follows one wave or one pulse.
+ *
+ * @param {readonly (readonly number[])[]} list The stripes' [top, bottom].
+ * @param {(x: number) => number} f The shift.
+ * @returns {((x: number) => number)[][]} The stripes as edge functions, for stripeBands().
+ */
+export const shifted = (list, f) => list.map(([t, b]) => [(x) => t + f(x), (x) => b + f(x)]);
+
+/**
+ * Stripes in a turned frame: drawn level, then turned deg about the centre.
+ *
+ * @param {readonly (readonly (number | ((x: number) => number))[])[]} list The stripes' [top, bottom] edges.
+ * @param {number} deg The turn (degrees).
+ * @param {{ x0?: number, x1?: number, dx?: number }} [o] stripeBands()'s options.
+ * @returns {import('../geometry/types.js').Shape} The stripes.
+ */
+export const turned = (list, deg, o) => rot(stripeBands(list, o), deg);
+
+/* ---------- guilloche curves ---------- */
+
+/**
+ * A ring whose radius waves k times round: r = R + A·cos(k·t + ph), sampled at n points.
+ *
+ * @param {number} R The mean radius.
+ * @param {number} A The wave's amplitude.
+ * @param {number} k Waves round.
+ * @param {number} [ph=0] The phase.
+ * @param {number} [n=480] Points.
+ * @param {number} [cx=C] The centre.
+ * @param {number} [cy=C] The centre.
+ * @returns {import('../geometry/types.js').Point[]} The ring.
+ */
+export const waveRing = (R, A, k, ph = 0, n = 480, cx = C, cy = C) => closedCurve((t) => { const r = R + A * Math.cos(k * t + ph); return [cx + r * Math.cos(t), cy + r * Math.sin(t)]; }, n);
+
+/* ---------- speed italics ---------- */
+
+/**
+ * A glyph drawn upright, slanted deg degrees (tops lean right) about the line y = cy.
+ *
+ * @param {import('../geometry/types.js').Geom} g The glyph.
+ * @param {number} [deg=17] The slant.
+ * @param {number} [cy=C] The line it slants about.
+ * @returns {import('../geometry/types.js').Geom} The slanted glyph.
+ */
+export const italic = (g, deg = 17, cy = C) => { const t = Math.tan((deg * Math.PI) / 180); return mapPts(g, ([x, y]) => [x + (cy - y) * t, y]); };
+
+/**
+ * A sharp notch: the triangle from the edge points a and b to the tip t, set `out` past the edge so it cuts clean.
+ *
+ * @param {readonly number[]} a One edge point.
+ * @param {readonly number[]} b The other.
+ * @param {import('../geometry/types.js').Point} t The tip.
+ * @param {number} [out=6] How far past the edge it starts.
+ * @returns {import('../geometry/types.js').Polygon} The notch.
+ */
+export const wedge = (a, b, t, out = 6) => {
+	const m = [(a[0] + b[0]) / 2, (a[1] + b[1]) / 2], v = [m[0] - t[0], m[1] - t[1]], L = Math.hypot(...v);
+	const o = [(v[0] / L) * out, (v[1] / L) * out]; return poly([[a[0] + o[0], a[1] + o[1]], [b[0] + o[0], b[1] + o[1]], t]);
+};
+
+/* ---------- speed slab capitals ---------- */
+// Heavy slab capitals built upright on a 368 × 400 box (M 432 wide; stems 112, bars 92, sharp corners, flat terminals; S
+// has its two outer turns chamfered so it never reads as a 5), slanted 17°, each with ONE speed slit: a sharp wedge cut
+// in from the trailing (left) edge of one stroke, rising slightly forward.
+
+/** The speed capitals' box: cap line T0, baseline B0, left edge L0, right edge R0, stem SW and bar BW. */
+export const SPEED_BOX = { T0: 56, B0: 456, L0: 72, R0: 440, SW: 112, BW: 92 };
+const { T0, B0, L0, R0, SW, BW } = SPEED_BOX;
+
+/**
+ * A bar from y0 to y1, across the speed box unless told.
+ *
+ * @param {number} y0 Its top.
+ * @param {number} y1 Its bottom.
+ * @param {number} [x0] Its left (the box's).
+ * @param {number} [x1] Its right (the box's).
+ * @returns {import('../geometry/types.js').Polygon} The bar.
+ */
+export const hz = (y0, y1, x0 = L0, x1 = R0) => rect(x0, y0, x1 - x0, y1 - y0);
+
+/**
+ * An upright from x0 to x1, the speed box's full height unless told.
+ *
+ * @param {number} x0 Its left.
+ * @param {number} x1 Its right.
+ * @param {number} [y0] Its top (the cap line).
+ * @param {number} [y1] Its bottom (the baseline).
+ * @returns {import('../geometry/types.js').Polygon} The upright.
+ */
+export const vt = (x0, x1, y0 = T0, y1 = B0) => rect(x0, y0, x1 - x0, y1 - y0);
+
+/**
+ * The speed slit: a wedge `bw` wide where it enters at a, its sharp tip `len` further along `dir`.
+ *
+ * @param {readonly number[]} a Where it enters.
+ * @param {number} len How far the tip runs.
+ * @param {number} [dir=-8] Its direction (degrees, y down).
+ * @param {number} [bw=46] Its width at the entry.
+ * @returns {import('../geometry/types.js').Polygon} The slit.
+ */
+export const slit = (a, len, dir = -8, bw = 46) => {
+	const r = (dir * Math.PI) / 180, n = [(-Math.sin(r) * bw) / 2, (Math.cos(r) * bw) / 2];
+	return wedge([a[0] + n[0], a[1] + n[1]], [a[0] - n[0], a[1] - n[1]], [a[0] + Math.cos(r) * len, a[1] + Math.sin(r) * len]);
+};
+
+/**
+ * A speed letter: the glyph less its slit, slanted 17°.
+ *
+ * @param {import('../geometry/types.js').Geom} glyph The upright glyph.
+ * @param {import('../geometry/types.js').Geom} cut Its slit.
+ * @returns {import('../geometry/types.js').Geom} The letter.
+ */
+export const speed = (glyph, cut) => italic(D(glyph, cut), 17);
+
+/** The speed slab capitals (N M Z K X S R A), each a function returning the upright glyph on SPEED_BOX. */
+export const SPEED_GLYPHS = {
+	N: () => U(vt(L0, L0 + SW), vt(R0 - SW, R0), poly([[L0, T0], [L0 + SW + 18, T0], [R0, B0 - 150], [R0, B0], [R0 - SW - 18, B0], [L0, T0 + 150]])),
+	M: () => poly([[40, T0], [150, T0], [C, 262], [362, T0], [472, T0], [472, B0], [368, B0], [368, 232], [C + 30, B0], [C - 30, B0], [144, 232], [144, B0], [40, B0]]),
+	Z: () => U(hz(T0, T0 + BW), hz(B0 - BW, B0), poly([[R0 - 140, T0 + BW], [R0, T0 + BW], [L0 + 140, B0 - BW], [L0, B0 - BW]])),
+	K: () => {
+		const a = [L0 + SW - 10, 372], b = [R0, T0], p = (t) => [a[0] + (b[0] - a[0]) * t, a[1] + (b[1] - a[1]) * t];
+		return U(vt(L0, L0 + SW), poly([[L0 + SW - 10, 236], [R0 - 128, T0], [R0, T0], a]), poly([p(0.3), p(0.62), [R0, B0], [R0 - 126, B0]]));
+	},
+	X: () => U(poly([[L0, T0], [L0 + 124, T0], [R0, B0], [R0 - 124, B0]]), poly([[R0 - 124, T0], [R0, T0], [L0 + 124, B0], [L0, B0]])),
+	S: () => D(U(hz(T0, T0 + BW), vt(L0, L0 + SW, T0, 302), hz(210, 302), vt(R0 - SW, R0, 210, B0), hz(B0 - BW, B0)), poly([[L0 - 1, T0 - 1], [L0 + 76, T0 - 1], [L0 - 1, T0 + 76]]), poly([[R0 + 1, B0 + 1], [R0 - 76, B0 + 1], [R0 + 1, B0 - 76]])),
+	R: () => U(vt(L0, L0 + SW), hz(T0, T0 + BW), vt(R0 - SW, R0, T0, 314), hz(222, 314), poly([[R0 - SW - 70, 314], [R0 - SW + 44, 314], [R0, B0], [R0 - 120, B0]])),
+	A: () => {
+		const out = poly([[166, T0], [346, T0], [R0, B0], [L0, B0]]), inner = poly([[226, T0 + BW], [286, T0 + BW], [312, 290], [200, 290]]), foot = poly([[178, 372], [334, 372], [358, B0 + 4], [154, B0 + 4]]);
+		return D(out, inner, foot);
+	},
+};

package/src/forms/shatter.d.ts

@@ -0,0 +1,40 @@
+import type { Geom, Point, Ring, Shape } from '../geometry/types.js';
+
+/** A rail: s in 0…1 to a point. */
+export type Rail = (s: number) => Point;
+/** A shard of a strip: its ring, its place along the strip and the rail its long side lies on. */
+export interface Shard {
+	r: Ring;
+	s: number;
+	base: 'inner' | 'outer';
+	c?: Point;
+}
+/** A shard's shrink, turn and move. */
+export interface ShardMove {
+	k?: number;
+	deg?: number;
+	d?: readonly number[];
+}
+
+/** A rail along a polyline, by arc length. */
+export function rail(pts: readonly Point[]): Rail;
+/** The run of a closed outline from the vertex nearest p to the vertex nearest q. */
+export function outlineRun(ring: readonly Point[], p: readonly number[], q: readonly number[]): Point[];
+/** The two rails of a band w wide along a centreline, mitred: [left, right]. */
+export function bandRails(pts: readonly Point[], w: number): [Rail, Rail];
+/** The triangular shards of a band between two rails, smaller down the strip. */
+export function shardStrip(inner: Rail, outer: Rail, o?: { n?: number; ratio?: number; jit?: number; rng?: () => number; arcN?: number }): Shard[];
+/** A shard inset by half a gap, its tips cleared. */
+export function inset(r: readonly Point[], g: number): Ring | undefined;
+/** The form less the band, cut back half a gap along the crack. */
+export function cutBack(shape: Geom, inner: Rail, outer: Rail, i0: readonly number[], g: number, k?: number): Shape;
+/** The shards moved off the body, each pushed on until it is g clear. */
+export function drift(body: Geom, shards: readonly Shard[], o: { move: (p: Shard & { c: Point }) => ShardMove; g: number; step?: number; min: number }): Geom[];
+/** A move spreading the shards out from a point. */
+export function spread(from: readonly number[], grow: readonly number[], shrink?: number, turn?: number): (p: Shard & { c: Point }) => ShardMove;
+/** A form breaking on one side into drifting shards. */
+export function breakOff(shape: Geom, inner: Rail, outer: Rail, o: { n?: number; ratio?: number; jit?: number; all?: boolean; move: (p: Shard & { c: Point }) => ShardMove; g: number; min?: number }): Shape;
+/** The house recipe: breakOff() spread from the centre, as a build of the gap. */
+export function houseBreak(shape: Geom, inner: Rail, outer: Rail, o?: { from?: readonly number[]; grow?: readonly number[]; shrink?: number; turn?: number; n?: number; ratio?: number; jit?: number; all?: boolean; min?: number }): (g: number) => Shape;
+/** The point k of the way from p to q. */
+export function lerpAt(p: readonly number[], q: readonly number[], k: number): Point;

package/src/forms/shatter.js

@@ -0,0 +1,341 @@
+/**
+ * Shatter: a solid form whose one side breaks into a few angular shards that drift off, smaller as they go, every part a
+ * house gap from the next. The shards are irregular triangles from a seeded strip (so seed Math.random per mark), not a
+ * grid of squares. A mark is made by `breakOff()`:
+ *
+ * 1. `shardStrip(inner, outer, o)`: the zone that breaks off is a band between two rails, the inner one (the crack, or a
+ *    ring's inside) and the outer one (the form's own outline), each a function of s in 0…1 (`rail()`, `bandRails()`).
+ *    Nodes go down both rails in turn, seeded and stepping down in size, and every three in a row make a triangle: a strip
+ *    of shards that tiles the band, the outer side of each still on the form's outline, so the eye completes the form.
+ * 2. `cutBack()`: the body is the form less the band, cut back half a gap along the crack by a mitred band (its edge stays
+ *    sharp); every shard is inset half a gap (`inset()`), so the strip starts as a mosaic with every part a gap apart.
+ * 3. `drift(body, shards, o)`: each shard is turned, shrunk about its centre and moved by its place along the strip
+ *    (`spread()`: out from a point inside the form), nearest the body first, and pushed on along its move until it is a
+ *    gap clear of the body and of every shard before it. A mark keeps no shard under 28 across once fitted.
+ *
+ * From the Logomarks tools (shatterparts.mjs, batch 231, "Bold · Shatter", and batch 241).
+ */
+import { U, D, I, poly, mapPts, bar, soften, mitreBand as mitred, mitreOffset as mitreOff } from '../geometry/index.js';
+
+/** @typedef {import('../geometry/types.js').Point} Point */
+/** @typedef {import('../geometry/types.js').Ring} Ring */
+/** @typedef {import('../geometry/types.js').Polygon} Polygon */
+/** @typedef {import('../geometry/types.js').Shape} Shape */
+/** @typedef {import('../geometry/types.js').Geom} Geom */
+/** @typedef {(s: number) => Point} Rail */
+
+/**
+ * A shard of a strip.
+ *
+ * @typedef {object} Shard
+ * @property {Ring} r Its ring.
+ * @property {number} s Its place along the strip, 0…1.
+ * @property {'inner' | 'outer'} base The rail its long side lies on.
+ * @property {Point} [c] Its centre (drift() adds it).
+ */
+
+/**
+ * A shard's move in drift().
+ *
+ * @typedef {object} ShardMove
+ * @property {number} [k] Its shrink about its centre (1: none).
+ * @property {number} [deg] Its turn, degrees.
+ * @property {readonly number[]} [d] Its move [dx, dy].
+ */
+
+/* ---------- measures ---------- */
+
+/**
+ * The pieces of a shape as single polygons ([outer, ...holes]).
+ *
+ * @param {Geom} s The shape.
+ * @returns {Shape} The polygons.
+ */
+const polys = (s) => (s.length && typeof s[0][0][0] === 'number' ? [s] : s);
+
+/**
+ * The area of a ring.
+ *
+ * @param {readonly Point[]} r The ring.
+ * @returns {number} Its area.
+ */
+const area = (r) => Math.abs(r.reduce((s, p, i) => { const q = r[(i + 1) % r.length]; return s + p[0] * q[1] - q[0] * p[1]; }, 0) / 2);
+
+/**
+ * The centre of mass of a ring.
+ *
+ * @param {readonly Point[]} r The ring.
+ * @returns {Point} Its centroid.
+ */
+const centroid = (r) => {
+	let a = 0, x = 0, y = 0;
+	r.forEach((p, i) => { const q = r[(i + 1) % r.length], c = p[0] * q[1] - q[0] * p[1]; a += c; x += (p[0] + q[0]) * c; y += (p[1] + q[1]) * c; });
+	return [x / (3 * a), y / (3 * a)];
+};
+
+/**
+ * A ring's width across its narrowest: over the edges every vertex lies behind (its hull edges), the least of each edge's
+ * greatest reach. A triangle's shortest altitude.
+ *
+ * @param {readonly Point[]} r The ring.
+ * @returns {number} The width.
+ */
+const minWidth = (r) => {
+	let best = Infinity;
+	r.forEach((p, i) => {
+		const q = r[(i + 1) % r.length], L = Math.hypot(q[0] - p[0], q[1] - p[1]); if (L < 1e-6) return;
+		let lo = 0, hi = 0; for (const v of r) { const d = ((q[0] - p[0]) * (v[1] - p[1]) - (q[1] - p[1]) * (v[0] - p[0])) / L; lo = Math.min(lo, d); hi = Math.max(hi, d); }
+		if (lo > -0.5 || hi < 0.5) best = Math.min(best, Math.max(-lo, hi));
+	});
+	return best;
+};
+
+/**
+ * The distance from the point p to the segment ab.
+ *
+ * @param {readonly number[]} p The point.
+ * @param {readonly number[]} a The segment's start.
+ * @param {readonly number[]} b Its end.
+ * @returns {number} The distance.
+ */
+const segDist = (p, a, b) => {
+	const dx = b[0] - a[0], dy = b[1] - a[1], L2 = dx * dx + dy * dy, t = L2 ? Math.max(0, Math.min(1, ((p[0] - a[0]) * dx + (p[1] - a[1]) * dy) / L2)) : 0;
+	return Math.hypot(p[0] - a[0] - t * dx, p[1] - a[1] - t * dy);
+};
+
+/**
+ * The gap between two shapes: 0 when they touch or overlap, else the least vertex-to-edge distance either way.
+ *
+ * @param {Geom} a One shape.
+ * @param {Geom} b The other.
+ * @returns {number} The gap.
+ */
+const gapBetween = (a, b) => {
+	if (I(a, b).length) return 0; let best = Infinity;
+	const rings = (s) => polys(s).flat();
+	for (const ra of rings(a)) for (const rb of rings(b)) for (const [P, Q] of [[ra, rb], [rb, ra]]) for (const p of P) for (let i = 0; i < Q.length; i++) best = Math.min(best, segDist(p, Q[i], Q[(i + 1) % Q.length]));
+	return best;
+};
+
+/* ---------- rails ---------- */
+
+/**
+ * The point t of the way from a to b.
+ *
+ * @param {readonly number[]} a From.
+ * @param {readonly number[]} b To.
+ * @param {number} t How far.
+ * @returns {Point} The point.
+ */
+const lerp = (a, b, t) => [a[0] + (b[0] - a[0]) * t, a[1] + (b[1] - a[1]) * t];
+
+/**
+ * A rail along a polyline, by arc length: s in 0…1 to a point.
+ *
+ * @param {readonly Point[]} pts The polyline.
+ * @returns {Rail} The rail.
+ */
+export const rail = (pts) => {
+	const L = pts.slice(1).map((p, i) => Math.hypot(p[0] - pts[i][0], p[1] - pts[i][1])), tot = L.reduce((a, b) => a + b, 0);
+	return (s) => { let d = Math.max(0, Math.min(1, s)) * tot; for (let i = 0; i < L.length; i++) { if (d <= L[i] || i === L.length - 1) return lerp(pts[i], pts[i + 1], Math.min(1, d / L[i])); d -= L[i]; } };
+};
+
+/**
+ * The run of a closed outline from the vertex nearest p, forward, to the vertex nearest q.
+ *
+ * @param {readonly Point[]} ring The outline.
+ * @param {readonly number[]} p Where the run starts.
+ * @param {readonly number[]} q Where it ends.
+ * @returns {Point[]} The run.
+ */
+export const outlineRun = (ring, p, q) => {
+	const near = (t) => ring.reduce((b, v, i) => (Math.hypot(v[0] - t[0], v[1] - t[1]) < Math.hypot(ring[b][0] - t[0], ring[b][1] - t[1]) ? i : b), 0);
+	const i = near(p), j = near(q), out = []; for (let k = i; ; k = (k + 1) % ring.length) { out.push(ring[k]); if (k === j) break; } return out;
+};
+
+/**
+ * The two rails of a band w wide along a centreline, offset by mitres.
+ *
+ * @param {readonly Point[]} pts The centreline.
+ * @param {number} w The band's width.
+ * @returns {[Rail, Rail]} The left rail (y down), then the right.
+ */
+export const bandRails = (pts, w) => [rail(mitreOff(pts, w / 2)), rail(mitreOff(pts, -w / 2))];
+
+/**
+ * The place s on a rail nearest a point (to 1/400).
+ *
+ * @param {Rail} f The rail.
+ * @param {readonly number[]} p The point.
+ * @returns {number} The place.
+ */
+const closest = (f, p) => { let best = 0, d = Infinity; for (let q = 0; q <= 400; q++) { const v = f(q / 400), e = Math.hypot(v[0] - p[0], v[1] - p[1]); if (e < d) { d = e; best = q / 400; } } return best; };
+
+/* ---------- the strip ---------- */
+
+/**
+ * The shards of a band between two rails. n + 2 nodes alternate down the rails (outer first, at s = 0), each step `ratio`
+ * times the last, so the shards get smaller down the strip, and each inner node is jittered by up to `jit` of its step;
+ * the last two sit at s = 1 on both rails. Every three nodes in a row make a triangle, its rail sides following the rails'
+ * curves (`arcN` points), so the strip tiles the band; a triangle with no area (where the rails meet) is dropped.
+ *
+ * @param {Rail} inner The inner rail.
+ * @param {Rail} outer The outer rail.
+ * @param {{ n?: number, ratio?: number, jit?: number, rng?: () => number, arcN?: number }} [o] Shards (6), the step
+ *   ratio (0.85), the jitter (0.3), the random source (Math.random) and the points along each rail side (80).
+ * @returns {Shard[]} The shards.
+ */
+export const shardStrip = (inner, outer, { n = 6, ratio = 0.85, jit = 0.3, rng = Math.random, arcN = 80 } = {}) => {
+	const steps = [...Array(n)].map((_, i) => ratio ** i), tot = steps.reduce((a, b) => a + b, 0), p = [0];
+	steps.forEach((d, i) => p.push(i === n - 1 ? 1 : p.at(-1) + d / tot)); p.push(1);
+	for (let j = 1; j < n; j++) p[j] += (rng() - 0.5) * 2 * jit * (steps[j - 1] / tot) * 0.5;
+	const ns = p.map((s, j) => ({ rail: j % 2 ? inner : outer, s }));
+	const run = (rail, s0, s1) => [...Array(arcN + 1)].map((_, q) => rail(s0 + ((s1 - s0) * q) / arcN));
+	return [...Array(n)].map((_, i) => { const [a, b, c] = ns.slice(i, i + 3); return { r: [...run(a.rail, a.s, c.s), b.rail(b.s)], s: (a.s + b.s + c.s) / 3, base: i % 2 ? 'inner' : 'outer' }; })
+		.filter((q) => area(q.r) > 1);
+};
+
+/**
+ * A shard shrunk in by half a gap all round, each straight side's band run on 3g past its corners so an acute tip leaves
+ * no needle (a rail's short arc steps are not run on: on a hollow arc that would groove the shard), then opened by 3
+ * (soften) to clear any hairline left where an arc meets a side.
+ *
+ * @param {readonly Point[]} r The shard's ring.
+ * @param {number} g The gap.
+ * @returns {Ring | undefined} The inset ring (its largest piece), or nothing if it vanishes.
+ */
+export const inset = (r, g) => polys(D(poly(r), ...r.flatMap((p, i) => {
+	const q = r[(i + 1) % r.length], L = Math.hypot(q[0] - p[0], q[1] - p[1]);
+	if (L < 1e-6) return []; const e = L > 30 ? (3 * g) / L : 0, u = [(q[0] - p[0]) * e, (q[1] - p[1]) * e];
+	return [bar([p[0] - u[0], p[1] - u[1]], [q[0] + u[0], q[1] + u[1]], g)];
+})))
+	.map((pg) => polys(soften([pg[0]], 0, 3))[0]?.[0]).filter(Boolean).sort((a, b) => area(b) - area(a))[0];
+
+/**
+ * The body: the form less the band between the rails, cut back by half a gap along the crack. The crack runs from the
+ * outer rail's start to the first inner node `i0`, down the inner rail, and back out to the outer rail's end (where the
+ * rails part there), run on 40 past both ends so it cuts cleanly through the outline; it is a mitred band g wide, so its
+ * edge stays sharp. Slivers of form under 400 in area are dropped.
+ *
+ * @param {Geom} shape The form.
+ * @param {Rail} inner The inner rail.
+ * @param {Rail} outer The outer rail.
+ * @param {readonly number[]} i0 The first inner node.
+ * @param {number} g The gap.
+ * @param {number} [k=60] Points along each rail run.
+ * @returns {Shape} The body.
+ */
+export const cutBack = (shape, inner, outer, i0, g, k = 60) => {
+	const at = (f, s0, s1) => [...Array(k + 1)].map((_, q) => f(s0 + ((s1 - s0) * q) / k));
+	const o1 = outer(1), in1 = inner(1); let crack = [outer(0), ...at(inner, closest(inner, i0), 1)];
+	if (Math.hypot(o1[0] - in1[0], o1[1] - in1[1]) > 1) crack.push(o1);
+	crack = crack.filter((p, i) => !i || Math.hypot(p[0] - crack[i - 1][0], p[1] - crack[i - 1][1]) > 0.5);
+	const on = (a, b) => { const L = Math.hypot(b[0] - a[0], b[1] - a[1]); return [b[0] + ((b[0] - a[0]) / L) * 40, b[1] + ((b[1] - a[1]) / L) * 40]; };
+	const zone = poly([...crack, ...at(outer, 1, 0)]);
+	// the zone's outer side is a chord of a curved outline, so drop the hairline slivers of form it leaves outside the crack
+	return polys(D(shape, zone, mitred([on(crack[1], crack[0]), ...crack, on(crack.at(-2), crack.at(-1))], g))).filter((pg) => area(pg[0]) > 400);
+};
+
+/* ---------- the drift ---------- */
+
+/**
+ * A shape shrunk by k about c, turned by deg and moved by (dx, dy).
+ *
+ * @param {Geom} s The shape.
+ * @param {readonly number[]} c The pivot.
+ * @param {number} k The shrink.
+ * @param {number} deg The turn, degrees.
+ * @param {readonly number[]} d The move.
+ * @returns {Geom} The shape, moved.
+ */
+const xf = (s, c, k, deg, [dx, dy]) => {
+	const a = (deg * Math.PI) / 180, co = Math.cos(a), si = Math.sin(a);
+	return mapPts(s, ([x, y]) => { const u = (x - c[0]) * k, v = (y - c[1]) * k; return [c[0] + u * co - v * si + dx, c[1] + u * si + v * co + dy]; });
+};
+
+/**
+ * Lets the shards drift off the body, nearest first. `move(p)` gives each shard (its ring p.r, its place p.s, its centre
+ * p.c) its shrink, turn and move. A shard is pushed on along its move in steps until it sits at least g clear of the body
+ * and of every shard already placed; a shard under `min` across is dropped, so the strip thins out at its end.
+ *
+ * @param {Geom} body The body.
+ * @param {readonly Shard[]} shards The inset shards.
+ * @param {{ move: (p: Shard & { c: Point }) => ShardMove, g: number, step?: number, min: number }} o The move, the gap,
+ *   the push step (4) and the least shard width.
+ * @returns {Geom[]} The placed shards.
+ */
+export const drift = (body, shards, { move, g, step = 4, min }) => {
+	const ranked = shards.map((p) => ({ ...p, c: centroid(p.r) })).sort((a, b) => a.s - b.s), placed = [];
+	ranked.forEach((p) => {
+		const { k = 1, deg = 0, d = [0, 0] } = move(p), L = Math.hypot(...d) || 1, u = [d[0] / L, d[1] / L];
+		let s, extra = 0; for (let t = 0; t < 80; t++) {
+			s = xf(poly(p.r), p.c, k, deg, [d[0] + u[0] * extra, d[1] + u[1] * extra]);
+			if (gapBetween(s, body) >= g && placed.every((q) => gapBetween(s, q) >= g)) break; extra += step;
+		}
+		if (minWidth(s[0]) >= min) placed.push(s);
+	});
+	return placed;
+};
+
+/**
+ * A drift that spreads the shards away from a point inside the form (an exploded view of the broken edge): each moves out
+ * by `grow` [start, growth along the strip] times its distance from `from`, shrunk by `shrink` × its place, and turned up
+ * to ± `turn`° (seeded through Math.random, more further on).
+ *
+ * @param {readonly number[]} from The point they spread from.
+ * @param {readonly number[]} grow [start, growth along the strip].
+ * @param {number} [shrink=0.35] The shrink at the strip's end.
+ * @param {number} [turn=8] The most turn, degrees.
+ * @returns {(p: Shard & { c: Point }) => ShardMove} The move, for drift().
+ */
+export const spread = (from, grow, shrink = 0.35, turn = 8) => (p) => {
+	const t = p.s, e = grow[0] + grow[1] * t;
+	return { k: 1 - shrink * t, deg: (Math.random() - 0.5) * 2 * turn * (0.3 + t), d: [(p.c[0] - from[0]) * e, (p.c[1] - from[1]) * e] };
+};
+
+/* ---------- the mark ---------- */
+
+/**
+ * A form breaking on one side: the band between `inner` and `outer` splits into a strip of n shards (only those based on
+ * the outer rail are kept, unless `all`), the body is cut back, the shards are inset and drift by `move`. `min` scales
+ * with the gap, so no shard is under 28 across once the mark is fitted. Seeded through Math.random.
+ *
+ * @param {Geom} shape The form.
+ * @param {Rail} inner The inner rail.
+ * @param {Rail} outer The outer rail.
+ * @param {{ n?: number, ratio?: number, jit?: number, all?: boolean, move: (p: Shard & { c: Point }) => ShardMove, g: number, min?: number }} o
+ *   Shards (6), the step ratio (0.8), the jitter (0.4), whether to keep every shard (true), the move, the gap and the least
+ *   shard width (28/22 of g).
+ * @returns {Shape} The broken form.
+ */
+export const breakOff = (shape, inner, outer, { n = 6, ratio = 0.8, jit = 0.4, all = true, move, g, min = (28 / 22) * g }) => {
+	const sh = shardStrip(inner, outer, { n, ratio, jit, rng: Math.random }), body = cutBack(shape, inner, outer, sh[0].r.at(-1), g);
+	const kept = (all ? sh : sh.filter((p) => p.base === 'outer')).map((p) => ({ ...p, r: inset(p.r, g) })).filter((p) => p.r && area(p.r) > 1);
+	return U(body, ...drift(body, kept, { move, g, min }));
+};
+
+/**
+ * The house recipe: breakOff() with 6 shards, each step 0.8 of the last, all kept, spread out from `from` (the canvas
+ * centre) by 0.05 + 0.5 × their place along the strip, shrunk up to 35%, turned up to ±8°; any of it overridden by `o`.
+ *
+ * @param {Geom} shape The form.
+ * @param {Rail} inner The inner rail.
+ * @param {Rail} outer The outer rail.
+ * @param {{ from?: readonly number[], grow?: readonly number[], shrink?: number, turn?: number, n?: number, ratio?: number, jit?: number, all?: boolean, min?: number }} [o]
+ *   Overrides.
+ * @returns {(g: number) => Shape} The build of the gap.
+ */
+export const houseBreak = (shape, inner, outer, o = {}) => (g) => {
+	const { from = [256, 256], grow = [0.05, 0.5], shrink = 0.35, turn = 8, ...rest } = o;
+	return breakOff(shape, inner, outer, { n: 6, ratio: 0.8, jit: 0.4, all: true, move: spread(from, grow, shrink, turn), ...rest, g });
+};
+
+/**
+ * The point k of the way from p to q.
+ *
+ * @param {readonly number[]} p From.
+ * @param {readonly number[]} q To.
+ * @param {number} k How far.
+ * @returns {Point} The point.
+ */
+export const lerpAt = (p, q, k) => [p[0] + (q[0] - p[0]) * k, p[1] + (q[1] - p[1]) * k];

package/src/forms/slats.d.ts

@@ -0,0 +1,35 @@
+import type { Shape } from '../geometry/types.js';
+
+/** One slab of a slat row: its turn (the sine, −1 to 1) and, optionally, its own width, height and centre shift. */
+export interface Slat {
+	tau: number;
+	W?: number;
+	H?: number;
+	dy?: number;
+}
+/** A slat row's drawing: full width and height, perspective, gap, narrowest slab, centre and alignment. */
+export interface SlatRowOptions {
+	W: number;
+	H: number;
+	k: number;
+	g: number;
+	wMin: number;
+	cx?: number;
+	cy?: number;
+	align?: 'centre' | 'base' | 'top';
+}
+/** A slab as its two edges, left then right: [x, top, bottom] each. */
+export type SlatEdges = [number, number, number][];
+
+/** The projected width of a slab of full width W turned by τ, never under wMin. */
+export function turnWidth(W: number, tau: number, wMin: number): number;
+/** A row of turning slabs side by side, every gap exactly g, centred on cx. */
+export function slatRow(slabs: readonly Slat[], o: SlatRowOptions): SlatEdges[];
+/** A slat row's slabs as one shape. */
+export function quads(row: readonly (readonly (readonly number[])[])[]): Shape;
+/** A slat row stood on its side as one shape ((x, y) becomes (y, x)). */
+export function quadsT(row: readonly (readonly (readonly number[])[])[]): Shape;
+/** n turns easing from a to b (sine ease). */
+export function ease(n: number, a: number, b: number): number[];
+/** n turns spaced evenly from a to b. */
+export function lerpN(n: number, a: number, b: number): number[];