@gjermundgaraba-designs/plain-garden 0.7.0 → 0.9.0

package/dist/src/drawing/render.js

@@ -1,57 +1,50 @@
 import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
 import { noteId } from "../figure/figures.js";
-import { HATCHES, } from "./scene.js";
-// The drafting marks' sizes, in scene units.
+import { fnv1aUtf16 } from "./fnv1a-utf16.js";
+import { HATCHES } from "./scene.js";
 const MARK = {
-    /** How far construction lines run past a sharp shape's corners. */
     reach: 22,
-    /** Coloured hatching: lines at 45°, this far apart. */
     hatch: 4.5,
-    /** A centre line runs this far past a round thing's edge. */
     centre: 14,
-    /** A measurement's extension lines start this far off the object and end this far past
-        the line; its label sits `lift` above the line. */
     extension: { off: 4, past: 6 },
     lift: 6,
-    /** A diameter's leader runs `knee` past the rim, then along a `shelf`. */
     knee: 26,
     shelf: 46,
-    /** A numbered part: the ring round its number, and the dot on the object. */
     ring: 10,
     dot: 2,
 };
-const hatched = (c) => __foldkitBrandViewResult((HATCHES.includes(c ?? "")), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#hatched");
-/* ------------------------------------------------------------------ numbers and noise */
+const hatched = (c) => __foldkitBrandViewResult((HATCHES.some((h) => __foldkitBrandViewResult((h === c), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous"))), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#hatched");
+const isNamed = (name) => __foldkitBrandViewResult((name !== undefined && name !== ""), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#isNamed");
 const n = (v) => __foldkitBrandViewResult((String(Math.round(v * 10) / 10 || 0)), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#n");
-/** How finely a path's points are kept, as steps per unit: tenths for a pencil stroke,
-    whose width is about a unit and would go lumpy coarser, for a curve, whose facets show
-    as soon as its points move, and for anything small; whole units for a big sharp shape,
-    a few corners at least 40 units apart each way, where half a unit does not show. */
 const FINE = 10;
 const COARSE = 1;
 const grain = (pts) => {
     if (pts.length > 8) {
         return __foldkitBrandViewResult((FINE), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#grain");
     }
-    const xs = pts.map((p) => __foldkitBrandViewResult((p[0]), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous"));
-    const ys = pts.map((p) => __foldkitBrandViewResult((p[1]), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~2"));
+    const xs = pts.map((p) => __foldkitBrandViewResult((p[0]), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~2"));
+    const ys = pts.map((p) => __foldkitBrandViewResult((p[1]), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~3"));
     const small = Math.min(Math.max(...xs) - Math.min(...xs), Math.max(...ys) - Math.min(...ys));
     return __foldkitBrandViewResult((small >= 40 ? COARSE : FINE), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#grain");
 };
-/** Path data, as short as it stays exact: the points rounded to the grid, then each written
-    as a step from the last (h and v where it runs straight), with straight runs joined. */
-function path(pts, closed = true, q = FINE) {
-    const grid = pts.map(([x, y]) => __foldkitBrandViewResult(([Math.round(x * q), Math.round(y * q)]), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~3"));
-    // Steps on the grid: exact, so a run of steps in one direction joins into one.
+const ORIGIN = [0, 0];
+const pt = (pts, i) => __foldkitBrandViewResult((pts[i] ?? ORIGIN), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#pt");
+const path = (pts, closed = true, q = FINE) => {
+    const grid = pts.map(([x, y]) => __foldkitBrandViewResult(([
+        Math.round(x * q),
+        Math.round(y * q),
+    ]), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~4"));
     const steps = [];
-    for (let i = 1; i < grid.length; i++) {
+    for (let i = 1; i < grid.length; i += 1) {
         const [here, before] = [pt(grid, i), pt(grid, i - 1)];
         const [dx, dy] = [here[0] - before[0], here[1] - before[1]];
         if (!dx && !dy) {
             continue;
         }
-        const last = steps[steps.length - 1];
-        if (last && last[0] * dy === last[1] * dx && last[0] * dx + last[1] * dy > 0) {
+        const last = steps.at(-1);
+        if (last &&
+            last[0] * dy === last[1] * dx &&
+            last[0] * dx + last[1] * dy > 0) {
             last[0] += dx;
             last[1] += dy;
         }
@@ -60,19 +53,21 @@ function path(pts, closed = true, q = FINE) {
         }
     }
     const num = (v) => __foldkitBrandViewResult((String(v / q || 0)
-        .replace(/^0\./, ".")
-        .replace(/^-0\./, "-.")), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#num");
+        .replace(/^0\./u, ".")
+        .replace(/^-0\./u, "-.")), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#num");
     let d = "";
     let cmd = "";
     let prev = "";
-    // A command letter is written only when it changes. A number needs a space before it
-    // unless a letter, its own minus, or its point after a number with a point divides it.
     const put = (letter, ...vs) => {
         if (letter !== cmd) {
-            d += cmd = prev = letter;
+            cmd = letter;
+            prev = letter;
+            d += letter;
         }
         for (const v of vs.map(num)) {
-            const divided = /[a-z]$/i.test(prev) || v[0] === "-" || (v[0] === "." && prev.includes("."));
+            const divided = /[a-z]$/iu.test(prev) ||
+                v.startsWith("-") ||
+                (v.startsWith(".") && prev.includes("."));
             d += (divided ? "" : " ") + v;
             prev = v;
         }
@@ -82,60 +77,51 @@ function path(pts, closed = true, q = FINE) {
         if (!dy) {
             put("h", dx);
         }
-        else if (!dx) {
-            put("v", dy);
+        else if (dx) {
+            put("l", dx, dy);
         }
         else {
-            put("l", dx, dy);
+            put("v", dy);
         }
     }
     return __foldkitBrandViewResult((d + (closed ? "z" : "")), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#path");
-}
+};
 const esc = (s) => __foldkitBrandViewResult((s
-    .replace(/&/g, "&amp;")
-    .replace(/</g, "&lt;")
-    .replace(/>/g, "&gt;")
-    .replace(/"/g, "&quot;")
-    .replace(/'/g, "&#x27;")), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#esc");
+    .replaceAll("&", "&amp;")
+    .replaceAll("<", "&lt;")
+    .replaceAll(">", "&gt;")
+    .replaceAll('"', "&quot;")
+    .replaceAll("'", "&#x27;")), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#esc");
 const unit = (dx, dy) => {
     const l = Math.hypot(dx, dy) || 1;
     return __foldkitBrandViewResult(([dx / l, dy / l]), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#unit");
 };
 const dist = (a, b) => __foldkitBrandViewResult((Math.hypot(b[0] - a[0], b[1] - a[1])), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#dist");
-const ORIGIN = [0, 0];
-/** A point by its index; every index the renderer asks for is in range. */
-const pt = (pts, i) => __foldkitBrandViewResult((pts[i] ?? ORIGIN), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#pt");
-/** A text's 32-bit FNV-1a hash. */
-function fnv(text) {
-    let h = 2166136261;
-    for (let i = 0; i < text.length; i++) {
-        h = Math.imul(h ^ text.charCodeAt(i), 16777619);
-    }
-    return __foldkitBrandViewResult((h >>> 0), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#fnv");
-}
-function seeded(text) {
-    let s = fnv(text);
+const seeded = (text) => {
+    let s = fnv1aUtf16(text);
     const next = () => {
-        s = (s + 0x6d2b79f5) >>> 0;
+        s = (s + 0x6d_2b_79_f5) >>> 0;
         let t = s;
         t = Math.imul(t ^ (t >>> 15), t | 1);
         t ^= t + Math.imul(t ^ (t >>> 7), t | 61);
-        return __foldkitBrandViewResult((((t ^ (t >>> 14)) >>> 0) / 4294967296), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#next");
+        return __foldkitBrandViewResult((((t ^ (t >>> 14)) >>> 0) / 4_294_967_296), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#next");
     };
     return __foldkitBrandViewResult(({ next, between: (a, b) => __foldkitBrandViewResult((a + (b - a) * next()), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#between") }), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#seeded");
-}
-/* ------------------------------------------------------------------ geometry */
-function densify(pts, closed, step = 4) {
+};
+const densify = (pts, closed, step = 4) => {
     const out = [];
     const corners = [];
     const segs = closed ? pts.length : pts.length - 1;
-    for (let i = 0; i < segs; i++) {
+    for (let i = 0; i < segs; i += 1) {
         const a = pt(pts, i);
         const b = pt(pts, (i + 1) % pts.length);
         corners.push(out.length);
         const k = Math.max(1, Math.floor(dist(a, b) / step));
-        for (let j = 0; j < k; j++) {
-            out.push([a[0] + ((b[0] - a[0]) * j) / k, a[1] + ((b[1] - a[1]) * j) / k]);
+        for (let j = 0; j < k; j += 1) {
+            out.push([
+                a[0] + ((b[0] - a[0]) * j) / k,
+                a[1] + ((b[1] - a[1]) * j) / k,
+            ]);
         }
     }
     if (!closed) {
@@ -143,38 +129,51 @@ function densify(pts, closed, step = 4) {
         out.push(pt(pts, pts.length - 1));
     }
     return __foldkitBrandViewResult(({ out, corners }), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#densify");
-}
-/** Points turned about their centroid. */
-function turn(pts, degrees = 0) {
+};
+const turn = (pts, degrees = 0) => {
     if (!degrees) {
         return __foldkitBrandViewResult((pts), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#turn");
     }
     const c = [
-        pts.reduce((s, p) => __foldkitBrandViewResult((s + p[0]), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~4"), 0) / pts.length,
-        pts.reduce((s, p) => __foldkitBrandViewResult((s + p[1]), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~5"), 0) / pts.length,
+        pts.reduce((s, p) => __foldkitBrandViewResult((s + p[0]), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~5"), 0) / pts.length,
+        pts.reduce((s, p) => __foldkitBrandViewResult((s + p[1]), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~6"), 0) / pts.length,
     ];
     const a = (degrees * Math.PI) / 180;
     const [sin, cos] = [Math.sin(a), Math.cos(a)];
     return __foldkitBrandViewResult((pts.map(([x, y]) => __foldkitBrandViewResult(([
         c[0] + (x - c[0]) * cos - (y - c[1]) * sin,
         c[1] + (x - c[0]) * sin + (y - c[1]) * cos,
-    ]), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~6"))), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#turn");
-}
-function smooth(ctrl, closed, per = 14) {
+    ]), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~7"))), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#turn");
+};
+const smooth = (ctrl, closed, per = 14) => {
     const m = ctrl.length;
-    const at = (i) => __foldkitBrandViewResult((closed ? pt(ctrl, ((i % m) + m) % m) : pt(ctrl, Math.min(Math.max(i, 0), m - 1))), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#at");
+    const at = (i) => __foldkitBrandViewResult((closed
+        ? pt(ctrl, ((i % m) + m) % m)
+        : pt(ctrl, Math.min(Math.max(i, 0), m - 1))), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#at");
     const out = [];
     const segs = closed ? m : m - 1;
-    for (let i = 0; i < segs; i++) {
+    for (let i = 0; i < segs; i += 1) {
         const [p0, p1, p2, p3] = [at(i - 1), at(i), at(i + 1), at(i + 2)];
-        const c1 = [p1[0] + (p2[0] - p0[0]) / 6, p1[1] + (p2[1] - p0[1]) / 6];
-        const c2 = [p2[0] - (p3[0] - p1[0]) / 6, p2[1] - (p3[1] - p1[1]) / 6];
-        for (let j = 0; j < per; j++) {
+        const c1 = [
+            p1[0] + (p2[0] - p0[0]) / 6,
+            p1[1] + (p2[1] - p0[1]) / 6,
+        ];
+        const c2 = [
+            p2[0] - (p3[0] - p1[0]) / 6,
+            p2[1] - (p3[1] - p1[1]) / 6,
+        ];
+        for (let j = 0; j < per; j += 1) {
             const t = j / per;
             const u = 1 - t;
             out.push([
-                u ** 3 * p1[0] + 3 * u * u * t * c1[0] + 3 * u * t * t * c2[0] + t ** 3 * p2[0],
-                u ** 3 * p1[1] + 3 * u * u * t * c1[1] + 3 * u * t * t * c2[1] + t ** 3 * p2[1],
+                u ** 3 * p1[0] +
+                    3 * u * u * t * c1[0] +
+                    3 * u * t * t * c2[0] +
+                    t ** 3 * p2[0],
+                u ** 3 * p1[1] +
+                    3 * u * u * t * c1[1] +
+                    3 * u * t * t * c2[1] +
+                    t ** 3 * p2[1],
             ]);
         }
     }
@@ -182,20 +181,17 @@ function smooth(ctrl, closed, per = 14) {
         out.push(pt(ctrl, m - 1));
     }
     return __foldkitBrandViewResult((out), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#smooth");
-}
-function arc(cx, cy, rx, ry, from, to, close) {
+};
+const arc = (cx, cy, rx, ry, from, to, close) => {
     const k = Math.max(24, Math.floor(Math.abs(to - from) / 5));
     const pts = [];
-    for (let i = 0; i < k + (close ? 0 : 1); i++) {
+    for (let i = 0; i < k + (close ? 0 : 1); i += 1) {
         const a = ((from + ((to - from) * i) / k) * Math.PI) / 180;
         pts.push([cx + rx * Math.cos(a), cy + ry * Math.sin(a)]);
     }
     return __foldkitBrandViewResult((pts), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#arc");
-}
-/** Every shape as points, in drawing order, with groups flattened into place; the marks,
-    moved with their groups, into `marks`. `k` is how much the groups round them scale;
-    `names` holds every group name met so far in the scene. */
-function build(shapes, marks, T = (p) => __foldkitBrandViewResult((p), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~7"), k = 1, group, names = new Set()) {
+};
+const build = (shapes, marks, T = (p) => __foldkitBrandViewResult((p), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~8"), k = 1, group, names = new Set()) => {
     const out = [];
     for (const s of shapes) {
         if ("part" in s) {
@@ -203,7 +199,11 @@ function build(shapes, marks, T = (p) => __foldkitBrandViewResult((p), "@gjermun
             continue;
         }
         if ("measure" in s) {
-            marks.push({ ...s, measure: [T(s.measure[0]), T(s.measure[1])], offset: s.offset * k });
+            marks.push({
+                ...s,
+                measure: [T(s.measure[0]), T(s.measure[1])],
+                offset: s.offset * k,
+            });
             continue;
         }
         if ("diameter" in s || "centre" in s) {
@@ -213,19 +213,18 @@ function build(shapes, marks, T = (p) => __foldkitBrandViewResult((p), "@gjermun
             continue;
         }
         if ("group" in s) {
-            if (s.name && group) {
-                throw new Error(`Group "${s.name}" is inside group "${group}": named groups do not nest.`);
-            }
-            if (s.name && !/^[a-z0-9-]+$/.test(s.name)) {
-                throw new Error(`Group "${s.name}": name it in lower-case letters, digits and hyphens.`);
-            }
-            if (s.name && names.has(s.name)) {
-                throw new Error(`Two groups are named "${s.name}".`);
-            }
-            if (s.name) {
+            if (isNamed(s.name)) {
+                if (isNamed(group)) {
+                    throw new Error(`Group "${s.name}" is inside group "${group}": named groups do not nest.`);
+                }
+                if (!/^[a-z0-9-]+$/u.test(s.name)) {
+                    throw new Error(`Group "${s.name}": name it in lower-case letters, digits and hyphens.`);
+                }
+                if (names.has(s.name)) {
+                    throw new Error(`Two groups are named "${s.name}".`);
+                }
                 names.add(s.name);
             }
-            // The group's own origin goes to `place`, and the group scales about it.
             const [ox, oy] = s.origin ?? [0, 0];
             const [px, py] = s.place ?? [ox, oy];
             const by = s.scale ?? 1;
@@ -241,12 +240,26 @@ function build(shapes, marks, T = (p) => __foldkitBrandViewResult((p), "@gjermun
             out.push({ pts: d, closed, corners, anchors: pts.map(T), ...look });
         };
         if ("text" in s) {
-            out.push({ ...look, pts: [T(s.at)], closed: false, corners: [], anchors: [], text: s });
+            out.push({
+                ...look,
+                pts: [T(s.at)],
+                closed: false,
+                corners: [],
+                anchors: [],
+                text: s,
+            });
         }
         else if ("arrow" in s) {
             const a = s.arrow.map(T);
             const shaft = a.length === 2 ? densify(a, false).out : smooth(a, false);
-            out.push({ ...look, pts: shaft, closed: false, corners: [], anchors: [], arrow: true });
+            out.push({
+                ...look,
+                pts: shaft,
+                closed: false,
+                corners: [],
+                anchors: [],
+                arrow: true,
+            });
         }
         else if ("rect" in s) {
             const [x, y, w, h] = s.rect;
@@ -257,10 +270,7 @@ function build(shapes, marks, T = (p) => __foldkitBrandViewResult((p), "@gjermun
                 [x + w, y + h],
                 [x, y + h],
             ];
-            if (!r) {
-                cornered(turn(box, s.turn), true);
-            }
-            else {
+            if (r) {
                 const pts = [];
                 const arcs = [
                     [x + w - r, y + r, -90],
@@ -269,7 +279,7 @@ function build(shapes, marks, T = (p) => __foldkitBrandViewResult((p), "@gjermun
                     [x + r, y + r, 180],
                 ];
                 for (const [cx, cy, a0] of arcs) {
-                    for (let j = 0; j < 9; j++) {
+                    for (let j = 0; j < 9; j += 1) {
                         pts.push([
                             cx + r * Math.cos(((a0 + j * 10) * Math.PI) / 180),
                             cy + r * Math.sin(((a0 + j * 10) * Math.PI) / 180),
@@ -278,6 +288,9 @@ function build(shapes, marks, T = (p) => __foldkitBrandViewResult((p), "@gjermun
                 }
                 plain(densify(turn(pts, s.turn), true).out, true);
             }
+            else {
+                cornered(turn(box, s.turn), true);
+            }
         }
         else if ("circle" in s) {
             plain(arc(s.circle[0], s.circle[1], s.circle[2], s.circle[2], 0, 360, true), true);
@@ -285,13 +298,13 @@ function build(shapes, marks, T = (p) => __foldkitBrandViewResult((p), "@gjermun
         else if ("ellipse" in s) {
             const [cx, cy, rx, ry] = s.ellipse;
             const whole = s.from === undefined && s.to === undefined;
-            plain(arc(cx, cy, rx, ry, s.from ?? 0, s.to ?? 360, whole), whole || !!s.closed);
+            plain(arc(cx, cy, rx, ry, s.from ?? 0, s.to ?? 360, whole), whole || s.closed === true);
         }
         else if ("poly" in s) {
-            cornered(turn(s.poly, s.turn), !s.open);
+            cornered(turn(s.poly, s.turn), s.open !== true);
         }
         else if ("curve" in s) {
-            plain(smooth(s.curve, !!s.closed), !!s.closed);
+            plain(smooth(s.curve, s.closed === true), s.closed === true);
         }
         else if ("dome" in s) {
             const [cx, cy, rx, ry] = s.dome;
@@ -316,38 +329,44 @@ function build(shapes, marks, T = (p) => __foldkitBrandViewResult((p), "@gjermun
         }
     }
     return __foldkitBrandViewResult((out), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#build");
-}
-/* ------------------------------------------------------------------ the hand */
-/** A pencil stroke along pts: a filled shape, thick in the middle, tapering at both ends,
-    wandering slowly off the true line and running a little past where it should stop. */
-function taper(src, width, rand, over) {
+};
+const taper = (src, width, rand, over) => {
     const wander = 0.9;
     const floor = 0.45;
     if (src.length < 2) {
         return __foldkitBrandViewResult((""), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#taper");
     }
-    const pts = src.slice();
+    const pts = [...src];
     const [first, second] = [pt(pts, 0), pt(pts, 1)];
-    const [last, penultimate] = [pt(pts, pts.length - 1), pt(pts, pts.length - 2)];
+    const [last, penultimate] = [
+        pt(pts, pts.length - 1),
+        pt(pts, pts.length - 2),
+    ];
     const t0 = unit(second[0] - first[0], second[1] - first[1]);
     const t1 = unit(last[0] - penultimate[0], last[1] - penultimate[1]);
     pts[0] = [first[0] - t0[0] * over, first[1] - t0[1] * over];
     pts[pts.length - 1] = [last[0] + t1[0] * over, last[1] + t1[1] * over];
     const s = [0];
-    for (let i = 1; i < pts.length; i++) {
+    for (let i = 1; i < pts.length; i += 1) {
         s.push((s[i - 1] ?? 0) + dist(pt(pts, i - 1), pt(pts, i)));
     }
-    const L = s[s.length - 1] || 1;
-    const [p1, p2, p3] = [rand.between(0, 6), rand.between(0, 6), rand.between(0, 6)];
+    const length = s.at(-1) ?? 0;
+    const L = length === 0 ? 1 : length;
+    const [p1, p2, p3] = [
+        rand.between(0, 6),
+        rand.between(0, 6),
+        rand.between(0, 6),
+    ];
     const left = [];
     const right = [];
-    pts.forEach((p, i) => {
+    for (const [i, p] of pts.entries()) {
         const a = pt(pts, Math.max(i - 1, 0));
         const b = pt(pts, Math.min(i + 1, pts.length - 1));
         const along = s[i] ?? 0;
         const [tx, ty] = unit(b[0] - a[0], b[1] - a[1]);
         const [nx, ny] = [-ty, tx];
-        const j = wander * (0.6 * Math.sin(along / 37 + p1) + 0.4 * Math.sin(along / 97 + p2));
+        const j = wander *
+            (0.6 * Math.sin(along / 37 + p1) + 0.4 * Math.sin(along / 97 + p2));
         let press = floor + (1 - floor) * Math.max(0, Math.sin((Math.PI * along) / L)) ** 0.5;
         if (L < 40) {
             press = Math.max(press, 0.55);
@@ -356,11 +375,10 @@ function taper(src, width, rand, over) {
         const [cx, cy] = [p[0] + nx * j, p[1] + ny * j];
         left.push([cx + nx * w, cy + ny * w]);
         right.push([cx - nx * w, cy - ny * w]);
-    });
-    return __foldkitBrandViewResult((path([...left, ...right.reverse()])), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#taper");
-}
-/** Where a hand lifts the pencil: each side of a box, or once round a curve with overlap. */
-function strokesOf(b, rand) {
+    }
+    return __foldkitBrandViewResult((path([...left, ...right.toReversed()])), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#taper");
+};
+const strokesOf = (b, rand) => {
     if (b.closed && b.corners.length >= 3) {
         const c = [...b.corners, b.pts.length];
         return __foldkitBrandViewResult((c.slice(0, -1).map((start, i) => {
@@ -375,25 +393,26 @@ function strokesOf(b, rand) {
         ]), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#strokesOf");
     }
     return __foldkitBrandViewResult(([b.pts]), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#strokesOf");
-}
-/** A shape's own points: a sharp shape's corners rather than the points the pencil follows
-    between them. */
+};
 const exact = (b) => (__foldkitBrandViewResult((b.corners.length ? b.anchors : b.pts), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#exact"));
-/** A line broken into dashes: the runs of pts that fall on the pattern's even entries. */
-function dashes(pts, pattern) {
+const dashes = (pts, pattern) => {
     const out = [];
     let [i, left, on, run] = [0, pattern[0] ?? 0, true, [pt(pts, 0)]];
-    for (let j = 1; j < pts.length; j++) {
+    for (let j = 1; j < pts.length; j += 1) {
         let a = pt(pts, j - 1);
         const b = pt(pts, j);
         let seg = dist(a, b);
         while (seg > left) {
-            const m = [a[0] + ((b[0] - a[0]) * left) / seg, a[1] + ((b[1] - a[1]) * left) / seg];
+            const m = [
+                a[0] + ((b[0] - a[0]) * left) / seg,
+                a[1] + ((b[1] - a[1]) * left) / seg,
+            ];
             if (on) {
                 out.push([...run, m]);
             }
             [run, a, seg, on] = [[m], m, seg - left, !on];
-            left = pattern[++i % pattern.length] ?? 0;
+            i += 1;
+            left = pattern[i % pattern.length] ?? 0;
         }
         left -= seg;
         if (on) {
@@ -404,18 +423,24 @@ function dashes(pts, pattern) {
         out.push(run);
     }
     return __foldkitBrandViewResult((out), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#dashes");
-}
-// A centre line is dash-dot; a dashed line (a level, an axis, what is hidden) is dashes.
-// The pencil draws the pattern stroke by stroke; the ruler sets it as a dash array.
+};
 const DASH = {
     centre: { pencil: [14, 4, 2, 4], ruler: "14 3 2 3", weight: 0.6 },
     dashed: { pencil: [5, 3], ruler: "5 3", weight: 0.8 },
 };
-// How far past its end the pencil runs each kind of stroke, before its own error of −2 to 3.
-const OVERRUN = { outline: 8, mark: 2, construction: 1, ring: 1, arrow: 0.5, dash: 0.3 };
-function pencil(rand) {
+const OVERRUN = {
+    outline: 8,
+    mark: 2,
+    construction: 1,
+    ring: 1,
+    arrow: 0.5,
+    dash: 0.3,
+};
+const pencil = (rand) => {
     const out = [];
-    const stroke = (pts, w, cls, over) => __foldkitBrandViewResult((out.push(`<path class="${cls}" d="${taper(pts.length === 2 ? densify(pts, false).out : pts, w, rand, over + rand.between(-2, 3))}"/>`)), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#stroke");
+    const stroke = (pts, w, cls, over) => {
+        out.push(`<path class="${cls}" d="${taper(pts.length === 2 ? densify(pts, false).out : pts, w, rand, over + rand.between(-2, 3))}"/>`);
+    };
     return __foldkitBrandViewResult(({
         out,
         weights: { outline: 2, detail: 1.15, arrow: 1.15 },
@@ -429,20 +454,22 @@ function pencil(rand) {
             if (!b.closed || b.corners.length < 3 || b.anchors.length > 6) {
                 return;
             }
-            b.anchors.forEach((a, i) => {
+            for (const [i, a] of b.anchors.entries()) {
                 const c = pt(b.anchors, (i + 1) % b.anchors.length);
                 const [dx, dy] = unit(c[0] - a[0], c[1] - a[1]);
                 stroke([
                     [a[0] - dx * MARK.reach, a[1] - dy * MARK.reach],
                     [c[0] + dx * MARK.reach, c[1] + dy * MARK.reach],
                 ], 0.7, "pen faint", OVERRUN.construction);
-            });
+            }
+        },
+        mark: (pts, w) => {
+            stroke(pts, w, "pen", OVERRUN.mark);
         },
-        mark: (pts, w) => __foldkitBrandViewResult((stroke(pts, w, "pen", OVERRUN.mark)), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#mark"),
         ring: (c, r, w) => {
             const pts = arc(c[0], c[1], r, r, 0, 360, true);
             const k = Math.floor(rand.next() * pts.length);
-            stroke(Array.from({ length: pts.length + 3 }, (_, i) => __foldkitBrandViewResult((pt(pts, (k + i) % pts.length)), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~12")), w, "pen", OVERRUN.ring);
+            stroke(Array.from({ length: pts.length + 3 }, (_, i) => __foldkitBrandViewResult((pt(pts, (k + i) % pts.length)), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~11")), w, "pen", OVERRUN.ring);
         },
         dashed: (pts, kind) => {
             for (const d of dashes(pts, DASH[kind].pencil)) {
@@ -459,19 +486,28 @@ function pencil(rand) {
             }
         },
     }), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#pencil");
-}
-function ruler() {
+};
+const ruler = () => {
     const out = [];
-    const line = (pts, w, cls = "ln", closed = false, attrs = "") => __foldkitBrandViewResult((out.push(`<path class="${cls}" ${attrs}d="${path(pts, closed, grain(pts))}" stroke-width="${w}"/>`)), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#line");
+    const line = (pts, w, cls = "ln", closed = false, attrs = "") => {
+        out.push(`<path class="${cls}" ${attrs}d="${path(pts, closed, grain(pts))}" stroke-width="${w}"/>`);
+    };
     return __foldkitBrandViewResult(({
         out,
         weights: { outline: 1.6, detail: 0.8, arrow: 1 },
-        outline: (b, w) => __foldkitBrandViewResult((line(exact(b), w, "ln", b.closed)), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#outline~2"),
+        outline: (b, w) => {
+            line(exact(b), w, "ln", b.closed);
+        },
         hatch: 1,
-        construction: () => { },
-        mark: (pts, w) => __foldkitBrandViewResult((line(pts, w)), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#mark~2"),
-        ring: ([cx, cy], r, w) => __foldkitBrandViewResult((out.push(`<circle class="ln paper" cx="${n(cx)}" cy="${n(cy)}" r="${r}" stroke-width="${w}"/>`)), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#ring~2"),
-        dashed: (pts, kind) => __foldkitBrandViewResult((line(pts, DASH[kind].weight, "ln", false, `stroke-dasharray="${DASH[kind].ruler}" `)), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#dashed~2"),
+        mark: (pts, w) => {
+            line(pts, w);
+        },
+        ring: ([cx, cy], r, w) => {
+            out.push(`<circle class="ln paper" cx="${n(cx)}" cy="${n(cy)}" r="${r}" stroke-width="${w}"/>`);
+        },
+        dashed: (pts, kind) => {
+            line(pts, DASH[kind].weight, "ln", false, `stroke-dasharray="${DASH[kind].ruler}" `);
+        },
         arrow: ([x, y], [dx, dy]) => {
             const [nx, ny] = [-dy, dx];
             out.push(`<path class="solid" d="${path([
@@ -481,39 +517,29 @@ function ruler() {
             ])}"/>`);
         },
     }), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#ruler");
-}
-/* ------------------------------------------------------------------ the drawing */
-/** The marks inside a drawing's <svg viewBox="0 0 width height">, as the stage draws them.
-    With a figure number, each named group is a <g> a note in that figure can point at. */
-export function drawingMarks(scene, stage, figure) {
-    // Seeded by the scene itself: the same scene and stage always draw the same strokes.
+};
+const lettering = (at, text, opts = {}) => __foldkitBrandViewResult((`<text class="tech" x="${n(at[0])}" y="${n(at[1])}" text-anchor="${opts.anchor ?? "middle"}"${(opts.rotate ?? 0) === 0 ? "" : ` transform="rotate(${opts.rotate} ${n(at[0])} ${n(at[1])})"`}>${esc(text)}</text>`), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#lettering");
+export const drawingMarks = (scene, stage, id, figure) => {
     const rand = seeded(JSON.stringify(scene) + stage);
     const hand = stage === "settled" ? ruler() : pencil(rand);
-    const out = hand.out;
-    // Each hatching colour is one <pattern>, its id the drawing's own: on paper, a line every
-    // MARK.hatch at 45°. The id comes from the scene and stage, so a page draws a hatched scene
-    // once at a stage; a second copy would repeat its ids.
+    const { out } = hand;
     const patterns = new Map();
-    const own = `h${fnv(JSON.stringify(scene) + stage).toString(36)}`;
     const hatching = (colour) => {
-        const id = `${own}-${colour}`;
+        const patternId = `${id}-${colour}`;
         const [s, w] = [MARK.hatch, hand.hatch];
-        patterns.set(colour, `<pattern id="${id}" width="${s}" height="${s}" patternUnits="userSpaceOnUse" patternTransform="rotate(45)"><rect class="paper" width="${s}" height="${s}"/><path class="ln hatch" style="--hatch: var(--draw-${colour})" d="M0 ${s / 2}h${s}" stroke-width="${w}"/></pattern>`);
-        return __foldkitBrandViewResult((`url(#${id})`), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#hatching");
+        patterns.set(colour, `<pattern id="${patternId}" width="${s}" height="${s}" patternUnits="userSpaceOnUse" patternTransform="rotate(45)"><rect class="paper" width="${s}" height="${s}"/><path class="ln hatch" style="--hatch: var(--draw-${colour})" d="M0 ${s / 2}h${s}" stroke-width="${w}"/></pattern>`);
+        return __foldkitBrandViewResult((`url(#${patternId})`), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#hatching");
     };
-    const lettering = (at, text, opts = {}) => __foldkitBrandViewResult((`<text class="tech" x="${n(at[0])}" y="${n(at[1])}" text-anchor="${opts.anchor ?? "middle"}"${opts.rotate ? ` transform="rotate(${opts.rotate} ${n(at[0])} ${n(at[1])})"` : ""}>${esc(text)}</text>`), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#lettering");
-    // The drafting marks' numbers and labels go on top of everything else.
     const words = [];
     const word = (...args) => __foldkitBrandViewResult((words.push(lettering(...args))), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#word");
-    // Each named group is one run of shapes: a <g> when the drawing is in a figure.
     let current;
     const marks = [];
     for (const b of build(scene.shapes, marks)) {
         if (b.group !== current) {
-            if (current && figure !== undefined) {
+            if (isNamed(current) && figure !== undefined) {
                 out.push("</g>");
             }
-            if (b.group && figure !== undefined) {
+            if (isNamed(b.group) && figure !== undefined) {
                 out.push(`<g id="${esc(noteId(figure, b.group))}">`);
             }
             current = b.group;
@@ -522,24 +548,26 @@ export function drawingMarks(scene, stage, figure) {
             out.push(lettering(pt(b.pts, 0), b.text.text, b.text.align === undefined ? {} : { anchor: b.text.align }));
             continue;
         }
-        if (b.arrow) {
+        if (b.arrow === true) {
             hand.mark(b.pts, hand.weights.arrow);
             const [p, q] = [pt(b.pts, b.pts.length - 2), pt(b.pts, b.pts.length - 1)];
             hand.arrow(q, unit(q[0] - p[0], q[1] - p[1]));
             continue;
         }
-        // Rough shows no colour: a hatched shape is paper there, like any other fill.
-        const fill = !b.fill
-            ? ""
-            : b.fill === "ink"
-                ? 'class="solid"'
-                : hatched(b.fill) && stage !== "rough"
+        let fill = "";
+        if (b.fill === "ink") {
+            fill = 'class="solid"';
+        }
+        else if (b.fill !== undefined) {
+            fill =
+                hatched(b.fill) && stage !== "rough"
                     ? `fill="${hatching(b.fill)}"`
                     : 'class="paper"';
+        }
         if (fill && b.closed) {
             out.push(`<path ${fill} d="${path(exact(b), true, grain(exact(b)))}"/>`);
         }
-        hand.construction(b);
+        hand.construction?.(b);
         if (b.line === "dashed") {
             hand.dashed(b.closed ? [...b.pts, pt(b.pts, 0)] : b.pts, "dashed");
         }
@@ -547,10 +575,9 @@ export function drawingMarks(scene, stage, figure) {
             hand.outline(b, hand.weights[b.line]);
         }
     }
-    if (current && figure !== undefined) {
+    if (isNamed(current) && figure !== undefined) {
         out.push("</g>");
     }
-    // Centre lines under measurements, under the numbered parts.
     for (const m of marks) {
         if (!("centre" in m)) {
             continue;
@@ -582,10 +609,8 @@ export function drawingMarks(scene, stage, figure) {
         if (!("measure" in d)) {
             continue;
         }
-        // Drawn as a horizontal measurement; a vertical one is the same with x and y swapped.
-        const swap = d.vertical ? ([x, y]) => __foldkitBrandViewResult(([y, x]), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~13") : (p) => __foldkitBrandViewResult((p), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~14");
-        // Left to right, so each arrowhead points out from the line.
-        const ends = [swap(d.measure[0]), swap(d.measure[1])].sort((a, b) => __foldkitBrandViewResult((a[0] - b[0]), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~15"));
+        const swap = d.vertical === true ? ([x, y]) => __foldkitBrandViewResult(([y, x]), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~12") : (p) => __foldkitBrandViewResult((p), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~13");
+        const ends = [swap(d.measure[0]), swap(d.measure[1])].toSorted((a, b) => __foldkitBrandViewResult((a[0] - b[0]), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~14"));
         const [p, q] = [pt(ends, 0), pt(ends, 1)];
         const side = d.offset > 0 ? 1 : -1;
         const y = (d.offset > 0 ? Math.max(p[1], q[1]) : Math.min(p[1], q[1])) + d.offset;
@@ -596,26 +621,23 @@ export function drawingMarks(scene, stage, figure) {
         hand.mark([swap([p[0], y]), swap([q[0], y])], 0.8);
         hand.arrow(swap([p[0], y]), swap([-1, 0]));
         hand.arrow(swap([q[0], y]), swap([1, 0]));
-        word(swap([(p[0] + q[0]) / 2, y - MARK.lift]), d.label, d.vertical ? { rotate: -90 } : {});
+        word(swap([(p[0] + q[0]) / 2, y - MARK.lift]), d.label, d.vertical === true ? { rotate: -90 } : {});
     }
-    marks
-        .filter((m) => __foldkitBrandViewResult(("part" in m), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~16"))
-        .forEach(({ at, tag }, i) => {
+    for (const [i, { at, tag }] of marks.filter((m) => __foldkitBrandViewResult(("part" in m), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~15")).entries()) {
         const [dx, dy] = unit(tag[0] - at[0], tag[1] - at[1]);
-        // The leader stops just short of the ring.
         const gap = MARK.ring + 1;
         hand.mark([at, [tag[0] - dx * gap, tag[1] - dy * gap]], 0.8);
         out.push(`<circle class="solid" cx="${n(at[0])}" cy="${n(at[1])}" r="${MARK.dot}"/>`);
         hand.ring(tag, MARK.ring, 0.9);
         word([tag[0], tag[1] + 4], String(i + 1));
-    });
-    const defs = patterns.size ? `<defs>${[...patterns.values()].join("")}</defs>` : "";
+    }
+    const defs = patterns.size
+        ? `<defs>${[...patterns.values()].join("")}</defs>`
+        : "";
     return __foldkitBrandViewResult((defs + out.join("") + words.join("")), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#drawingMarks");
-}
-/** Where a DrawnTitle's title stands (--ground, up from the drawing's foot) and how a phone
-    crops the drawing to the scene's focus (--focus-width, --focus-start). */
-export function titlePlacement(scene) {
-    const pct = (v) => __foldkitBrandViewResult((`${Math.round(v * 10000) / 100}%`), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#pct");
+};
+const pct = (v) => __foldkitBrandViewResult((`${Math.round(v * 10_000) / 100}%`), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#pct");
+export const titlePlacement = (scene) => {
     const ground = scene.ground ?? scene.height;
     const [from, to] = scene.focus ?? [0, scene.width];
     return __foldkitBrandViewResult(({
@@ -623,10 +645,9 @@ export function titlePlacement(scene) {
         "--focus-width": pct(scene.width / (to - from)),
         "--focus-start": pct(-from / (to - from)),
     }), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#titlePlacement");
-}
-/** The names of the scene's numbered parts, in their numbers' order. */
-export function partNames(scene) {
+};
+export const partNames = (scene) => {
     const marks = [];
     build(scene.shapes, marks);
-    return __foldkitBrandViewResult((marks.flatMap((m) => (__foldkitBrandViewResult(("part" in m ? [m.part] : []), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~18")))), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#partNames");
-}
+    return __foldkitBrandViewResult((marks.flatMap((m) => (__foldkitBrandViewResult(("part" in m ? [m.part] : []), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#anonymous~16")))), "@gjermundgaraba-designs/plain-garden/src/drawing/render.js#partNames");
+};