@kensio/colophon 2.11.0 → 2.12.0

package/dist/templates/window/index.js

@@ -0,0 +1,48 @@
+import { box } from "../../layout/index.js";
+import { windowDots } from "./dots.js";
+import { windowTitle } from "./title.js";
+/** The title bar's height, as a fraction of the window's width. */
+const barScale = 0.055;
+/** The buttons' diameter, as a fraction of the bar's height. */
+const buttonScale = 0.26;
+/** How tall the title bar is on a window of this width. */
+export function barHeight(windowWidth) {
+    return Math.round(windowWidth * barScale);
+}
+/**
+ * A rectangle with its top corners rounded and its bottom ones square, which
+ * is the shape of a title bar sitting in the top of a rounded window.
+ *
+ * It has to be one shape rather than a rounded rectangle with a square one
+ * over its bottom half, which is the obvious way to do it and the wrong one:
+ * the band is drawn at low opacity, so anywhere the two overlapped would be
+ * painted twice and come out as a lighter block with a curve through it.
+ */
+function roundedTop(rect, radius) {
+    const { x, y, width, height } = rect;
+    const r = Math.min(radius, Math.round(width / 2), height);
+    return (`M${String(x)} ${String(y + r)}` +
+        `a${String(r)} ${String(r)} 0 0 1 ${String(r)} ${String(-r)}` +
+        `h${String(width - r * 2)}` +
+        `a${String(r)} ${String(r)} 0 0 1 ${String(r)} ${String(r)}` +
+        `v${String(height - r)}h${String(-width)}z`);
+}
+/**
+ * The bar across the top of the window: a lighter band, the buttons, and the
+ * title in the middle of what is left.
+ *
+ * The band is white at low opacity rather than a colour of its own, so it
+ * lifts whatever the code theme's background happens to be instead of having
+ * to be chosen against it.
+ */
+export function titleBar(window, height, title, config, measure, dots = "macos") {
+    const band = `<path d="${roundedTop({ x: window.x, y: window.y, width: window.width, height }, window.radius)}"` +
+        ` fill="#ffffff" fill-opacity="0.07"/>${box({ x: window.x, y: window.y + height, width: window.width, height: 1 }, { fill: "#ffffff", fillOpacity: 0.1 })}`;
+    const lights = windowDots(dots, {
+        left: window.x + Math.round(height * 0.6),
+        middle: window.y + Math.round(height / 2),
+        diameter: Math.round(height * buttonScale),
+    });
+    return band + lights + windowTitle(title, window, height, config, measure);
+}
+//# sourceMappingURL=index.js.map

package/dist/templates/window/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/templates/window/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,uBAAuB,CAAC;AAI5C,OAAO,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAEvC,OAAO,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAIzC,mEAAmE;AACnE,MAAM,QAAQ,GAAG,KAAK,CAAC;AAEvB,gEAAgE;AAChE,MAAM,WAAW,GAAG,IAAI,CAAC;AAEzB,2DAA2D;AAC3D,MAAM,UAAU,SAAS,CAAC,WAAmB;IAC3C,OAAO,IAAI,CAAC,KAAK,CAAC,WAAW,GAAG,QAAQ,CAAC,CAAC;AAC5C,CAAC;AAED;;;;;;;;GAQG;AACH,SAAS,UAAU,CAAC,IAAU,EAAE,MAAc;IAC5C,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC;IACrC,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC;IAE1D,OAAO,CACL,IAAI,MAAM,CAAC,CAAC,CAAC,IAAI,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE;QAChC,IAAI,MAAM,CAAC,CAAC,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,UAAU,MAAM,CAAC,CAAC,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,CAAC,EAAE;QAC7D,IAAI,MAAM,CAAC,KAAK,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE;QAC3B,IAAI,MAAM,CAAC,CAAC,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,UAAU,MAAM,CAAC,CAAC,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE;QAC5D,IAAI,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,IAAI,MAAM,CAAC,CAAC,KAAK,CAAC,GAAG,CAC5C,CAAC;AACJ,CAAC;AAED;;;;;;;GAOG;AACH,MAAM,UAAU,QAAQ,CACtB,MAAa,EACb,MAAc,EACd,KAAa,EACb,MAAsB,EACtB,OAAoB,EACpB,IAAI,GAAe,OAAO;IAE1B,MAAM,IAAI,GACR,YAAY,UAAU,CAAC,EAAE,CAAC,EAAE,MAAM,CAAC,CAAC,EAAE,CAAC,EAAE,MAAM,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE,MAAM,CAAC,MAAM,CAAC,GAAG;QACnG,wCAAwC,GAAG,CACzC,EAAE,CAAC,EAAE,MAAM,CAAC,CAAC,EAAE,CAAC,EAAE,MAAM,CAAC,CAAC,GAAG,MAAM,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,EAAE,MAAM,EAAE,CAAC,EAAE,EACrE,EAAE,IAAI,EAAE,SAAS,EAAE,WAAW,EAAE,GAAG,EAAE,CACtC,EAAE,CAAC;IAEN,MAAM,MAAM,GAAG,UAAU,CAAC,IAAI,EAAE;QAC9B,IAAI,EAAE,MAAM,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,CAAC;QACzC,MAAM,EAAE,MAAM,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;QACzC,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,WAAW,CAAC;KAC3C,CAAC,CAAC;IAEH,OAAO,IAAI,GAAG,MAAM,GAAG,WAAW,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC,CAAC;AAC7E,CAAC"}

package/dist/templates/window/title.d.ts

@@ -0,0 +1,9 @@
+import type { MeasureText, ResolvedConfig } from "../../types.js";
+import type { Panel } from "../code/panel.js";
+/**
+ * The window's title, centred in the bar. It is cut to the room between the
+ * buttons and the far edge, taking the buttons' width off both sides so that
+ * it stays centred in the bar rather than in what the buttons left.
+ */
+export declare function windowTitle(title: string, window: Panel, height: number, config: ResolvedConfig, measure: MeasureText): string;
+//# sourceMappingURL=title.d.ts.map

package/dist/templates/window/title.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"title.d.ts","sourceRoot":"","sources":["../../../src/templates/window/title.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAClE,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE9C;;;;GAIG;AACH,wBAAgB,WAAW,CACzB,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,KAAK,EACb,MAAM,EAAE,MAAM,EACd,MAAM,EAAE,cAAc,EACtB,OAAO,EAAE,WAAW,GACnB,MAAM,CA0BR"}

package/dist/templates/window/title.js

@@ -0,0 +1,24 @@
+import { baselineFor, clampLine, measureIn, textElement, } from "../../layout/index.js";
+/**
+ * The window's title, centred in the bar. It is cut to the room between the
+ * buttons and the far edge, taking the buttons' width off both sides so that
+ * it stays centred in the bar rather than in what the buttons left.
+ */
+export function windowTitle(title, window, height, config, measure) {
+    if (title === "") {
+        return "";
+    }
+    const fontSize = Math.round(height * 0.42);
+    const reserved = Math.round(height * 2.4);
+    return textElement(clampLine(title, window.width - reserved * 2, measureIn(measure, config.fontFamily, 600), fontSize), {
+        x: Math.round(window.x + window.width / 2),
+        y: baselineFor(window.y + (height - fontSize) / 2, fontSize),
+        fontFamily: config.fontFamily,
+        fontSize,
+        fontWeight: 600,
+        fill: "#ffffff",
+        fillOpacity: 0.6,
+        anchor: "middle",
+    });
+}
+//# sourceMappingURL=title.js.map

package/dist/templates/window/title.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"title.js","sourceRoot":"","sources":["../../../src/templates/window/title.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,WAAW,EACX,SAAS,EACT,SAAS,EACT,WAAW,GACZ,MAAM,uBAAuB,CAAC;AAI/B;;;;GAIG;AACH,MAAM,UAAU,WAAW,CACzB,KAAa,EACb,MAAa,EACb,MAAc,EACd,MAAsB,EACtB,OAAoB;IAEpB,IAAI,KAAK,KAAK,EAAE,EAAE,CAAC;QACjB,OAAO,EAAE,CAAC;IACZ,CAAC;IAED,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC;IAC3C,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,CAAC,CAAC;IAE1C,OAAO,WAAW,CAChB,SAAS,CACP,KAAK,EACL,MAAM,CAAC,KAAK,GAAG,QAAQ,GAAG,CAAC,EAC3B,SAAS,CAAC,OAAO,EAAE,MAAM,CAAC,UAAU,EAAE,GAAG,CAAC,EAC1C,QAAQ,CACT,EACD;QACE,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,GAAG,MAAM,CAAC,KAAK,GAAG,CAAC,CAAC;QAC1C,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,MAAM,GAAG,QAAQ,CAAC,GAAG,CAAC,EAAE,QAAQ,CAAC;QAC5D,UAAU,EAAE,MAAM,CAAC,UAAU;QAC7B,QAAQ;QACR,UAAU,EAAE,GAAG;QACf,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,GAAG;QAChB,MAAM,EAAE,QAAQ;KACjB,CACF,CAAC;AACJ,CAAC"}

package/dist/texture/chevrons.d.ts

@@ -0,0 +1,13 @@
+import type { Dimensions, Texture } from "../types.js";
+/**
+ * Rows of chevrons: one V to a tile, meeting its neighbours at the tile edge.
+ *
+ * The V spans the whole width and stops short of the top and bottom, so the
+ * rows have air between them. Its ends sit at the same height on both edges,
+ * which is what makes one tile's chevron continue into the next rather than
+ * ending in a corner.
+ */
+export declare function chevronsSvg(texture: Extract<Texture, {
+    readonly type: "chevrons";
+}>, dimensions: Dimensions, id: string): string;
+//# sourceMappingURL=chevrons.d.ts.map

package/dist/texture/chevrons.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chevrons.d.ts","sourceRoot":"","sources":["../../src/texture/chevrons.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAMvD;;;;;;;GAOG;AACH,wBAAgB,WAAW,CACzB,OAAO,EAAE,OAAO,CAAC,OAAO,EAAE;IAAE,QAAQ,CAAC,IAAI,EAAE,UAAU,CAAA;CAAE,CAAC,EACxD,UAAU,EAAE,UAAU,EACtB,EAAE,EAAE,MAAM,GACT,MAAM,CAkBR"}

package/dist/texture/chevrons.js

@@ -0,0 +1,22 @@
+import { fallbackColor } from "./color.js";
+import { tile } from "./tile.js";
+const chevronDefaults = { opacity: 0.07, width: 2, gap: 36 };
+/**
+ * Rows of chevrons: one V to a tile, meeting its neighbours at the tile edge.
+ *
+ * The V spans the whole width and stops short of the top and bottom, so the
+ * rows have air between them. Its ends sit at the same height on both edges,
+ * which is what makes one tile's chevron continue into the next rather than
+ * ending in a corner.
+ */
+export function chevronsSvg(texture, dimensions, id) {
+    const gap = texture.gap ?? chevronDefaults.gap;
+    const low = String(gap * 0.7);
+    const high = String(gap * 0.3);
+    const chevron = `<path d="M0 ${low}L${String(gap / 2)} ${high}L${String(gap)} ${low}"` +
+        ` stroke="${texture.color ?? fallbackColor}"` +
+        ` stroke-width="${String(texture.width ?? chevronDefaults.width)}"` +
+        ` fill="none"/>`;
+    return tile(id, gap, chevron, "", dimensions, texture.opacity ?? chevronDefaults.opacity);
+}
+//# sourceMappingURL=chevrons.js.map

package/dist/texture/chevrons.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chevrons.js","sourceRoot":"","sources":["../../src/texture/chevrons.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAEjC,MAAM,eAAe,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,GAAG,EAAE,EAAE,EAAE,CAAC;AAE7D;;;;;;;GAOG;AACH,MAAM,UAAU,WAAW,CACzB,OAAwD,EACxD,UAAsB,EACtB,EAAU;IAEV,MAAM,GAAG,GAAG,OAAO,CAAC,GAAG,IAAI,eAAe,CAAC,GAAG,CAAC;IAC/C,MAAM,GAAG,GAAG,MAAM,CAAC,GAAG,GAAG,GAAG,CAAC,CAAC;IAC9B,MAAM,IAAI,GAAG,MAAM,CAAC,GAAG,GAAG,GAAG,CAAC,CAAC;IAC/B,MAAM,OAAO,GACX,eAAe,GAAG,IAAI,MAAM,CAAC,GAAG,GAAG,CAAC,CAAC,IAAI,IAAI,IAAI,MAAM,CAAC,GAAG,CAAC,IAAI,GAAG,GAAG;QACtE,YAAY,OAAO,CAAC,KAAK,IAAI,aAAa,GAAG;QAC7C,kBAAkB,MAAM,CAAC,OAAO,CAAC,KAAK,IAAI,eAAe,CAAC,KAAK,CAAC,GAAG;QACnE,gBAAgB,CAAC;IAEnB,OAAO,IAAI,CACT,EAAE,EACF,GAAG,EACH,OAAO,EACP,EAAE,EACF,UAAU,EACV,OAAO,CAAC,OAAO,IAAI,eAAe,CAAC,OAAO,CAC3C,CAAC;AACJ,CAAC"}

package/dist/texture/color.d.ts

@@ -0,0 +1,10 @@
+/**
+ * The colour a texture draws in where the palette did not supply one.
+ *
+ * `resolveTexture` fills the foreground colour in for anything that came
+ * through config, so this is only reached by a texture built by hand, such as
+ * one a test or a custom template passes to `textureSvg` directly. It is here
+ * rather than in either drawing module because both of them need it.
+ */
+export declare const fallbackColor = "#ffffff";
+//# sourceMappingURL=color.d.ts.map

package/dist/texture/color.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"color.d.ts","sourceRoot":"","sources":["../../src/texture/color.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,eAAO,MAAM,aAAa,YAAY,CAAC"}

package/dist/texture/color.js

@@ -0,0 +1,10 @@
+/**
+ * The colour a texture draws in where the palette did not supply one.
+ *
+ * `resolveTexture` fills the foreground colour in for anything that came
+ * through config, so this is only reached by a texture built by hand, such as
+ * one a test or a custom template passes to `textureSvg` directly. It is here
+ * rather than in either drawing module because both of them need it.
+ */
+export const fallbackColor = "#ffffff";
+//# sourceMappingURL=color.js.map

package/dist/texture/color.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"color.js","sourceRoot":"","sources":["../../src/texture/color.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,SAAS,CAAC"}

package/dist/texture/grid.d.ts

@@ -0,0 +1,14 @@
+import type { Dimensions, Texture } from "../types.js";
+/**
+ * Squared paper: lines both ways, and a heavier one every so often.
+ *
+ * The heavy lines are a second tile rather than part of the first, since what
+ * makes them heavy is that they repeat at a multiple of the spacing. Drawing
+ * both from `<pattern>`s keeps this among the cheap treatments: the tiles are
+ * square to the image, so a row of the rendered picture repeats, which is what
+ * the compression works on.
+ */
+export declare function gridSvg(texture: Extract<Texture, {
+    readonly type: "grid";
+}>, dimensions: Dimensions, id: string): string;
+//# sourceMappingURL=grid.d.ts.map

package/dist/texture/grid.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid.d.ts","sourceRoot":"","sources":["../../src/texture/grid.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AA4BvD;;;;;;;;GAQG;AACH,wBAAgB,OAAO,CACrB,OAAO,EAAE,OAAO,CAAC,OAAO,EAAE;IAAE,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC,EACpD,UAAU,EAAE,UAAU,EACtB,EAAE,EAAE,MAAM,GACT,MAAM,CA8BR"}

package/dist/texture/grid.js

@@ -0,0 +1,38 @@
+import { fallbackColor } from "./color.js";
+import { tile } from "./tile.js";
+const gridDefaults = { opacity: 0.07, width: 1, gap: 32, major: 5 };
+/** How much heavier the every-so-often line is than the rest. */
+const majorScale = 2;
+/** One square's worth of grid: a line along two of its edges. */
+function square(texture, gap, width) {
+    const middle = String(gap / 2);
+    const size = String(gap);
+    // Down the middle of the tile on both axes rather than along its edges, for
+    // the reason `rulesSvg` gives: a stroke centred on the edge would have half
+    // of itself outside the tile, where the pattern does not repeat it.
+    return (`<path d="M0 ${middle}H${size}M${middle} 0V${size}"` +
+        ` stroke="${texture.color ?? fallbackColor}"` +
+        ` stroke-width="${String(width)}" fill="none"/>`);
+}
+/**
+ * Squared paper: lines both ways, and a heavier one every so often.
+ *
+ * The heavy lines are a second tile rather than part of the first, since what
+ * makes them heavy is that they repeat at a multiple of the spacing. Drawing
+ * both from `<pattern>`s keeps this among the cheap treatments: the tiles are
+ * square to the image, so a row of the rendered picture repeats, which is what
+ * the compression works on.
+ */
+export function gridSvg(texture, dimensions, id) {
+    const gap = texture.gap ?? gridDefaults.gap;
+    const width = texture.width ?? gridDefaults.width;
+    const opacity = texture.opacity ?? gridDefaults.opacity;
+    const major = texture.major ?? gridDefaults.major;
+    const fine = tile(`${id}a`, gap, square(texture, gap, width), "", dimensions, opacity);
+    if (major < 2) {
+        return fine;
+    }
+    return (fine +
+        tile(`${id}b`, gap * major, square(texture, gap * major, width * majorScale), "", dimensions, opacity));
+}
+//# sourceMappingURL=grid.js.map

package/dist/texture/grid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid.js","sourceRoot":"","sources":["../../src/texture/grid.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAEjC,MAAM,YAAY,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,GAAG,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC;AAEpE,iEAAiE;AACjE,MAAM,UAAU,GAAG,CAAC,CAAC;AAErB,iEAAiE;AACjE,SAAS,MAAM,CACb,OAAoD,EACpD,GAAW,EACX,KAAa;IAEb,MAAM,MAAM,GAAG,MAAM,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC;IAC/B,MAAM,IAAI,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC;IAEzB,4EAA4E;IAC5E,4EAA4E;IAC5E,oEAAoE;IACpE,OAAO,CACL,eAAe,MAAM,IAAI,IAAI,IAAI,MAAM,MAAM,IAAI,GAAG;QACpD,YAAY,OAAO,CAAC,KAAK,IAAI,aAAa,GAAG;QAC7C,kBAAkB,MAAM,CAAC,KAAK,CAAC,iBAAiB,CACjD,CAAC;AACJ,CAAC;AAED;;;;;;;;GAQG;AACH,MAAM,UAAU,OAAO,CACrB,OAAoD,EACpD,UAAsB,EACtB,EAAU;IAEV,MAAM,GAAG,GAAG,OAAO,CAAC,GAAG,IAAI,YAAY,CAAC,GAAG,CAAC;IAC5C,MAAM,KAAK,GAAG,OAAO,CAAC,KAAK,IAAI,YAAY,CAAC,KAAK,CAAC;IAClD,MAAM,OAAO,GAAG,OAAO,CAAC,OAAO,IAAI,YAAY,CAAC,OAAO,CAAC;IACxD,MAAM,KAAK,GAAG,OAAO,CAAC,KAAK,IAAI,YAAY,CAAC,KAAK,CAAC;IAElD,MAAM,IAAI,GAAG,IAAI,CACf,GAAG,EAAE,GAAG,EACR,GAAG,EACH,MAAM,CAAC,OAAO,EAAE,GAAG,EAAE,KAAK,CAAC,EAC3B,EAAE,EACF,UAAU,EACV,OAAO,CACR,CAAC;IAEF,IAAI,KAAK,GAAG,CAAC,EAAE,CAAC;QACd,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,CACL,IAAI;QACJ,IAAI,CACF,GAAG,EAAE,GAAG,EACR,GAAG,GAAG,KAAK,EACX,MAAM,CAAC,OAAO,EAAE,GAAG,GAAG,KAAK,EAAE,KAAK,GAAG,UAAU,CAAC,EAChD,EAAE,EACF,UAAU,EACV,OAAO,CACR,CACF,CAAC;AACJ,CAAC"}

package/dist/texture/halftone.d.ts

@@ -0,0 +1,14 @@
+import type { Dimensions, Texture } from "../types.js";
+/**
+ * A grid of dots that grow across the image, which is a gradient made out of
+ * print.
+ *
+ * It cannot be a tile: every dot is a different size, which is the whole
+ * effect. What keeps it affordable is that the size depends on the position
+ * rather than on chance, so a run of dots across the image is a smooth ramp
+ * and there is nothing noisy for the compression to choke on.
+ */
+export declare function halftoneSvg(texture: Extract<Texture, {
+    readonly type: "halftone";
+}>, dimensions: Dimensions): string;
+//# sourceMappingURL=halftone.d.ts.map

package/dist/texture/halftone.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"halftone.d.ts","sourceRoot":"","sources":["../../src/texture/halftone.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAsCvD;;;;;;;;GAQG;AACH,wBAAgB,WAAW,CACzB,OAAO,EAAE,OAAO,CAAC,OAAO,EAAE;IAAE,QAAQ,CAAC,IAAI,EAAE,UAAU,CAAA;CAAE,CAAC,EACxD,UAAU,EAAE,UAAU,GACrB,MAAM,CAuBR"}

package/dist/texture/halftone.js

@@ -0,0 +1,55 @@
+import { fallbackColor } from "./color.js";
+const halftoneDefaults = {
+    opacity: 0.12,
+    size: 12,
+    gap: 30,
+    angle: 90,
+    from: 0.1,
+};
+/**
+ * How far along the growth a point is, from 0 at one edge to 1 at the other.
+ *
+ * It is the point's distance along the direction the dots grow in, measured
+ * from whichever corner is furthest back along it, so the ramp covers the
+ * whole image whatever angle it runs at.
+ */
+function ramp(dimensions, angle) {
+    const radians = (angle * Math.PI) / 180;
+    const dx = Math.cos(radians);
+    const dy = Math.sin(radians);
+    const { width, height } = dimensions;
+    // The four corners projected onto the direction give its full span, so the
+    // ends of the ramp land on the image rather than somewhere outside it.
+    const corners = [0, width].flatMap((cx) => [0, height].map((cy) => cx * dx + cy * dy));
+    const low = Math.min(...corners);
+    const span = Math.max(...corners) - low || 1;
+    return (px, py) => (px * dx + py * dy - low) / span;
+}
+/**
+ * A grid of dots that grow across the image, which is a gradient made out of
+ * print.
+ *
+ * It cannot be a tile: every dot is a different size, which is the whole
+ * effect. What keeps it affordable is that the size depends on the position
+ * rather than on chance, so a run of dots across the image is a smooth ramp
+ * and there is nothing noisy for the compression to choke on.
+ */
+export function halftoneSvg(texture, dimensions) {
+    const gap = texture.gap ?? halftoneDefaults.gap;
+    const size = texture.size ?? halftoneDefaults.size;
+    const from = texture.from ?? halftoneDefaults.from;
+    const at = ramp(dimensions, texture.angle ?? halftoneDefaults.angle);
+    let dots = "";
+    for (let y = gap / 2; y < dimensions.height + gap; y += gap) {
+        for (let x = gap / 2; x < dimensions.width + gap; x += gap) {
+            const radius = (size / 2) * (from + (1 - from) * at(x, y));
+            dots +=
+                `<circle cx="${String(Math.round(x))}" cy="${String(Math.round(y))}"` +
+                    ` r="${String(Math.round(radius * 100) / 100)}"/>`;
+        }
+    }
+    return (`<g fill="${texture.color ?? fallbackColor}"` +
+        ` opacity="${String(texture.opacity ?? halftoneDefaults.opacity)}">` +
+        `${dots}</g>`);
+}
+//# sourceMappingURL=halftone.js.map

package/dist/texture/halftone.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"halftone.js","sourceRoot":"","sources":["../../src/texture/halftone.ts"],"names":[],"mappings":"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"}

package/dist/texture/honeycomb.d.ts

@@ -0,0 +1,14 @@
+import type { Dimensions, Texture } from "../types.js";
+/**
+ * A honeycomb of hexagon outlines.
+ *
+ * The grid repeats every three sides across and every `side * sqrt(3)` down,
+ * which is the smallest rectangle a honeycomb fits in. Two hexagons go in it,
+ * the second offset by half of each, and the ones that fall outside are drawn
+ * anyway so that the tile joins its neighbours: the pattern clips them, and a
+ * hexagon cut in half by the tile edge meets its other half in the next tile.
+ */
+export declare function honeycombSvg(texture: Extract<Texture, {
+    readonly type: "honeycomb";
+}>, dimensions: Dimensions, id: string): string;
+//# sourceMappingURL=honeycomb.d.ts.map

package/dist/texture/honeycomb.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"honeycomb.d.ts","sourceRoot":"","sources":["../../src/texture/honeycomb.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AA8BvD;;;;;;;;GAQG;AACH,wBAAgB,YAAY,CAC1B,OAAO,EAAE,OAAO,CAAC,OAAO,EAAE;IAAE,QAAQ,CAAC,IAAI,EAAE,WAAW,CAAA;CAAE,CAAC,EACzD,UAAU,EAAE,UAAU,EACtB,EAAE,EAAE,MAAM,GACT,MAAM,CAwBR"}

package/dist/texture/honeycomb.js

@@ -0,0 +1,43 @@
+import { fallbackColor } from "./color.js";
+import { tile } from "./tile.js";
+const combDefaults = { opacity: 0.07, width: 1.5, size: 26 };
+/** Rounded to keep the path short, since it is written out twice a tile. */
+function at(value) {
+    return String(Math.round(value * 100) / 100);
+}
+/**
+ * One flat-topped hexagon, from its centre and the length of a side.
+ *
+ * A hexagon of side `s` is `2s` across the points and `s * sqrt(3)` across the
+ * flats, which is where every number below comes from.
+ */
+function hexagon(cx, cy, side) {
+    const half = (side * Math.sqrt(3)) / 2;
+    return (`M${at(cx - side)} ${at(cy)}` +
+        `L${at(cx - side / 2)} ${at(cy - half)}` +
+        `L${at(cx + side / 2)} ${at(cy - half)}` +
+        `L${at(cx + side)} ${at(cy)}` +
+        `L${at(cx + side / 2)} ${at(cy + half)}` +
+        `L${at(cx - side / 2)} ${at(cy + half)}Z`);
+}
+/**
+ * A honeycomb of hexagon outlines.
+ *
+ * The grid repeats every three sides across and every `side * sqrt(3)` down,
+ * which is the smallest rectangle a honeycomb fits in. Two hexagons go in it,
+ * the second offset by half of each, and the ones that fall outside are drawn
+ * anyway so that the tile joins its neighbours: the pattern clips them, and a
+ * hexagon cut in half by the tile edge meets its other half in the next tile.
+ */
+export function honeycombSvg(texture, dimensions, id) {
+    const side = texture.size ?? combDefaults.size;
+    const height = side * Math.sqrt(3);
+    const width = side * 3;
+    const comb = `<path d="${hexagon(side, height / 2, side)}${hexagon(side * 2.5, 0, side)}${hexagon(side * 2.5, height, side)}" stroke="${texture.color ?? fallbackColor}"` +
+        ` stroke-width="${String(texture.width ?? combDefaults.width)}"` +
+        ` fill="none"/>`;
+    // Not the square tile the others use: a honeycomb's repeat is wider than it
+    // is tall, so `tile` takes the two separately here.
+    return tile(id, { width, height }, comb, "", dimensions, texture.opacity ?? combDefaults.opacity);
+}
+//# sourceMappingURL=honeycomb.js.map

package/dist/texture/honeycomb.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"honeycomb.js","sourceRoot":"","sources":["../../src/texture/honeycomb.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAEjC,MAAM,YAAY,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC;AAE7D,4EAA4E;AAC5E,SAAS,EAAE,CAAC,KAAa;IACvB,OAAO,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC,CAAC;AAC/C,CAAC;AAED;;;;;GAKG;AACH,SAAS,OAAO,CAAC,EAAU,EAAE,EAAU,EAAE,IAAY;IACnD,MAAM,IAAI,GAAG,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;IAEvC,OAAO,CACL,IAAI,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE;QAC7B,IAAI,EAAE,CAAC,EAAE,GAAG,IAAI,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,EAAE;QACxC,IAAI,EAAE,CAAC,EAAE,GAAG,IAAI,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,EAAE;QACxC,IAAI,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE;QAC7B,IAAI,EAAE,CAAC,EAAE,GAAG,IAAI,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,EAAE;QACxC,IAAI,EAAE,CAAC,EAAE,GAAG,IAAI,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,GAAG,CAC1C,CAAC;AACJ,CAAC;AAED;;;;;;;;GAQG;AACH,MAAM,UAAU,YAAY,CAC1B,OAAyD,EACzD,UAAsB,EACtB,EAAU;IAEV,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,IAAI,YAAY,CAAC,IAAI,CAAC;IAC/C,MAAM,MAAM,GAAG,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACnC,MAAM,KAAK,GAAG,IAAI,GAAG,CAAC,CAAC;IAEvB,MAAM,IAAI,GACR,YAAY,OAAO,CAAC,IAAI,EAAE,MAAM,GAAG,CAAC,EAAE,IAAI,CAAC,GAAG,OAAO,CACnD,IAAI,GAAG,GAAG,EACV,CAAC,EACD,IAAI,CACL,GAAG,OAAO,CAAC,IAAI,GAAG,GAAG,EAAE,MAAM,EAAE,IAAI,CAAC,aAAa,OAAO,CAAC,KAAK,IAAI,aAAa,GAAG;QACnF,kBAAkB,MAAM,CAAC,OAAO,CAAC,KAAK,IAAI,YAAY,CAAC,KAAK,CAAC,GAAG;QAChE,gBAAgB,CAAC;IAEnB,4EAA4E;IAC5E,oDAAoD;IACpD,OAAO,IAAI,CACT,EAAE,EACF,EAAE,KAAK,EAAE,MAAM,EAAE,EACjB,IAAI,EACJ,EAAE,EACF,UAAU,EACV,OAAO,CAAC,OAAO,IAAI,YAAY,CAAC,OAAO,CACxC,CAAC;AACJ,CAAC"}

package/dist/texture/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/texture/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAIvD,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAE9C;;;;;;GAMG;AACH,wBAAgB,UAAU,CACxB,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,UAAU,EACtB,EAAE,EAAE,MAAM,GACT,MAAM,CAUR"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/texture/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAavD,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAuC9C;;;;;;GAMG;AACH,wBAAgB,UAAU,CACxB,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,UAAU,EACtB,EAAE,EAAE,MAAM,GACT,MAAM,CAOR"}

package/dist/texture/index.js

@@ -1,6 +1,44 @@
+import { chevronsSvg } from "./chevrons.js";
 import { grainSvg } from "./grain.js";
-import { dotsSvg, rulesSvg } from "./pattern.js";
+import { halftoneSvg } from "./halftone.js";
+import { gridSvg } from "./grid.js";
+import { honeycombSvg } from "./honeycomb.js";
+import { moireSvg } from "./moire.js";
+import { crossesSvg, dotsSvg, rulesSvg } from "./pattern.js";
+import { raysSvg } from "./rays.js";
+import { scallopsSvg } from "./scallops.js";
+import { topographicSvg } from "./topographic/index.js";
+import { wavesSvg } from "./waves.js";
 export { resolveTexture } from "./resolve.js";
+/**
+ * Which function draws which treatment.
+ *
+ * A table rather than a chain of `if`s, because the chain had a branch per
+ * texture and there are ten of them: the file was close to the complexity
+ * threshold and every new treatment made it worse. The type is what keeps this
+ * honest, and it does the job the chain's final `return` used to do badly: a
+ * variant added to `Texture` with no entry here fails to compile, where before
+ * it silently came out as ruled lines.
+ *
+ * `waves` and `rays` name nothing in `<defs>` and take no id. They are wrapped
+ * rather than given a parameter to ignore, so each one's own signature still
+ * says what it uses.
+ */
+const drawers = {
+    grain: grainSvg,
+    dots: dotsSvg,
+    rules: rulesSvg,
+    grid: gridSvg,
+    crosses: crossesSvg,
+    chevrons: chevronsSvg,
+    honeycomb: honeycombSvg,
+    moire: moireSvg,
+    scallops: scallopsSvg,
+    waves: (texture, dimensions) => wavesSvg(texture, dimensions),
+    rays: (texture, dimensions) => raysSvg(texture, dimensions),
+    halftone: (texture, dimensions) => halftoneSvg(texture, dimensions),
+    topographic: (texture, dimensions) => topographicSvg(texture, dimensions),
+};
 /**
  * Render the treatment laid over a background as SVG, naming whatever it needs
  * in `<defs>` after the given `id`.
@@ -9,12 +47,10 @@ export { resolveTexture } from "./resolve.js";
  * texture never comes between a headline and the reader.
  */
 export function textureSvg(texture, dimensions, id) {
-    if (texture.type === "grain") {
-        return grainSvg(texture, dimensions, id);
-    }
-    if (texture.type === "dots") {
-        return dotsSvg(texture, dimensions, id);
-    }
-    return rulesSvg(texture, dimensions, id);
+    // The value and the lookup narrow separately, so the compiler cannot see
+    // that they are the same variant, though the table's type is what makes them
+    // so. This is the one line that knows better than the checker.
+    const draw = drawers[texture.type];
+    return draw(texture, dimensions, id);
 }
 //# sourceMappingURL=index.js.map

package/dist/texture/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/texture/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAEjD,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAE9C;;;;;;GAMG;AACH,MAAM,UAAU,UAAU,CACxB,OAAgB,EAChB,UAAsB,EACtB,EAAU;IAEV,IAAI,OAAO,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;QAC7B,OAAO,QAAQ,CAAC,OAAO,EAAE,UAAU,EAAE,EAAE,CAAC,CAAC;IAC3C,CAAC;IAED,IAAI,OAAO,CAAC,IAAI,KAAK,MAAM,EAAE,CAAC;QAC5B,OAAO,OAAO,CAAC,OAAO,EAAE,UAAU,EAAE,EAAE,CAAC,CAAC;IAC1C,CAAC;IAED,OAAO,QAAQ,CAAC,OAAO,EAAE,UAAU,EAAE,EAAE,CAAC,CAAC;AAC3C,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/texture/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAC7D,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAS9C;;;;;;;;;;;;;GAaG;AACH,MAAM,OAAO,GAAwC;IACnD,KAAK,EAAE,QAAQ;IACf,IAAI,EAAE,OAAO;IACb,KAAK,EAAE,QAAQ;IACf,IAAI,EAAE,OAAO;IACb,OAAO,EAAE,UAAU;IACnB,QAAQ,EAAE,WAAW;IACrB,SAAS,EAAE,YAAY;IACvB,KAAK,EAAE,QAAQ;IACf,QAAQ,EAAE,WAAW;IACrB,KAAK,EAAE,CAAC,OAAO,EAAE,UAAU,EAAE,EAAE,CAAC,QAAQ,CAAC,OAAO,EAAE,UAAU,CAAC;IAC7D,IAAI,EAAE,CAAC,OAAO,EAAE,UAAU,EAAE,EAAE,CAAC,OAAO,CAAC,OAAO,EAAE,UAAU,CAAC;IAC3D,QAAQ,EAAE,CAAC,OAAO,EAAE,UAAU,EAAE,EAAE,CAAC,WAAW,CAAC,OAAO,EAAE,UAAU,CAAC;IACnE,WAAW,EAAE,CAAC,OAAO,EAAE,UAAU,EAAE,EAAE,CAAC,cAAc,CAAC,OAAO,EAAE,UAAU,CAAC;CAC1E,CAAC;AAEF;;;;;;GAMG;AACH,MAAM,UAAU,UAAU,CACxB,OAAgB,EAChB,UAAsB,EACtB,EAAU;IAEV,yEAAyE;IACzE,6EAA6E;IAC7E,+DAA+D;IAC/D,MAAM,IAAI,GAAG,OAAO,CAAC,OAAO,CAAC,IAAI,CAA0B,CAAC;IAE5D,OAAO,IAAI,CAAC,OAAO,EAAE,UAAU,EAAE,EAAE,CAAC,CAAC;AACvC,CAAC"}

package/dist/texture/moire.d.ts

@@ -0,0 +1,18 @@
+import type { Dimensions, Texture } from "../types.js";
+/**
+ * Two square grids, one turned a few degrees against the other.
+ *
+ * What is seen is the interference between them rather than either grid: the
+ * lines cross at a different offset in every part of the image, which the eye
+ * reads as broad bands sweeping across it. It is the same idea as `waves` with
+ * straight edges instead of arcs, and that is what makes it much cheaper to
+ * store, since a row of the image is closer to repeating.
+ *
+ * The angle is the whole texture. Below about a degree the bands are wider
+ * than the image and it looks like one grid slightly out of true; above about
+ * ten they are tight enough to read as a weave.
+ */
+export declare function moireSvg(texture: Extract<Texture, {
+    readonly type: "moire";
+}>, dimensions: Dimensions, id: string): string;
+//# sourceMappingURL=moire.d.ts.map

package/dist/texture/moire.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"moire.d.ts","sourceRoot":"","sources":["../../src/texture/moire.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AA8CvD;;;;;;;;;;;;GAYG;AACH,wBAAgB,QAAQ,CACtB,OAAO,EAAE,OAAO,CAAC,OAAO,EAAE;IAAE,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAA;CAAE,CAAC,EACrD,UAAU,EAAE,UAAU,EACtB,EAAE,EAAE,MAAM,GACT,MAAM,CAaR"}

package/dist/texture/moire.js

@@ -0,0 +1,44 @@
+import { fallbackColor } from "./color.js";
+import { tile } from "./tile.js";
+const moireDefaults = { opacity: 0.1, width: 1, gap: 16, angle: 4 };
+/**
+ * How much fainter the turned grid is than the square one.
+ *
+ * The same reasoning as the second set of rings in `waves`: two grids at one
+ * opacity read as two grids, and dropping one of them is what turns the
+ * crossings into a surface.
+ */
+const secondaryScale = 0.65;
+/** One square grid: a line through the middle of the tile on each axis. */
+function grid(texture, dimensions, id, angle, opacity) {
+    const gap = texture.gap ?? moireDefaults.gap;
+    const middle = String(gap / 2);
+    const size = String(gap);
+    // Down the middle of the tile on both axes rather than along its edges, for
+    // the reason `rulesSvg` gives: a stroke centred on the edge would have half
+    // of itself outside the tile, where the pattern does not repeat it.
+    const lines = `<path d="M0 ${middle}H${size}M${middle} 0V${size}"` +
+        ` stroke="${texture.color ?? fallbackColor}"` +
+        ` stroke-width="${String(texture.width ?? moireDefaults.width)}"` +
+        ` fill="none"/>`;
+    return tile(id, gap, lines, angle === 0 ? "" : ` patternTransform="rotate(${String(angle)})"`, dimensions, opacity);
+}
+/**
+ * Two square grids, one turned a few degrees against the other.
+ *
+ * What is seen is the interference between them rather than either grid: the
+ * lines cross at a different offset in every part of the image, which the eye
+ * reads as broad bands sweeping across it. It is the same idea as `waves` with
+ * straight edges instead of arcs, and that is what makes it much cheaper to
+ * store, since a row of the image is closer to repeating.
+ *
+ * The angle is the whole texture. Below about a degree the bands are wider
+ * than the image and it looks like one grid slightly out of true; above about
+ * ten they are tight enough to read as a weave.
+ */
+export function moireSvg(texture, dimensions, id) {
+    const opacity = texture.opacity ?? moireDefaults.opacity;
+    return (grid(texture, dimensions, `${id}a`, 0, opacity) +
+        grid(texture, dimensions, `${id}b`, texture.angle ?? moireDefaults.angle, Math.round(opacity * secondaryScale * 1000) / 1000));
+}
+//# sourceMappingURL=moire.js.map

package/dist/texture/moire.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"moire.js","sourceRoot":"","sources":["../../src/texture/moire.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAEjC,MAAM,aAAa,GAAG,EAAE,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,CAAC,EAAE,GAAG,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC;AAEpE;;;;;;GAMG;AACH,MAAM,cAAc,GAAG,IAAI,CAAC;AAE5B,2EAA2E;AAC3E,SAAS,IAAI,CACX,OAAqD,EACrD,UAAsB,EACtB,EAAU,EACV,KAAa,EACb,OAAe;IAEf,MAAM,GAAG,GAAG,OAAO,CAAC,GAAG,IAAI,aAAa,CAAC,GAAG,CAAC;IAC7C,MAAM,MAAM,GAAG,MAAM,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC;IAC/B,MAAM,IAAI,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC;IAEzB,4EAA4E;IAC5E,4EAA4E;IAC5E,oEAAoE;IACpE,MAAM,KAAK,GACT,eAAe,MAAM,IAAI,IAAI,IAAI,MAAM,MAAM,IAAI,GAAG;QACpD,YAAY,OAAO,CAAC,KAAK,IAAI,aAAa,GAAG;QAC7C,kBAAkB,MAAM,CAAC,OAAO,CAAC,KAAK,IAAI,aAAa,CAAC,KAAK,CAAC,GAAG;QACjE,gBAAgB,CAAC;IAEnB,OAAO,IAAI,CACT,EAAE,EACF,GAAG,EACH,KAAK,EACL,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,6BAA6B,MAAM,CAAC,KAAK,CAAC,IAAI,EACjE,UAAU,EACV,OAAO,CACR,CAAC;AACJ,CAAC;AAED;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,QAAQ,CACtB,OAAqD,EACrD,UAAsB,EACtB,EAAU;IAEV,MAAM,OAAO,GAAG,OAAO,CAAC,OAAO,IAAI,aAAa,CAAC,OAAO,CAAC;IAEzD,OAAO,CACL,IAAI,CAAC,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,EAAE,OAAO,CAAC;QAC/C,IAAI,CACF,OAAO,EACP,UAAU,EACV,GAAG,EAAE,GAAG,EACR,OAAO,CAAC,KAAK,IAAI,aAAa,CAAC,KAAK,EACpC,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,cAAc,GAAG,IAAI,CAAC,GAAG,IAAI,CACnD,CACF,CAAC;AACJ,CAAC"}

package/dist/texture/pattern.d.ts

@@ -3,6 +3,16 @@ import type { Dimensions, Texture } from "../types.js";
 export declare function dotsSvg(texture: Extract<Texture, {
     readonly type: "dots";
 }>, dimensions: Dimensions, id: string): string;
+/**
+ * A small cross where each line of a grid would meet, one to a tile.
+ *
+ * It is the dot grid with a little more to look at, and it costs the same: the
+ * mark is two strokes rather than a fill, and the tile is square to the image
+ * either way.
+ */
+export declare function crossesSvg(texture: Extract<Texture, {
+    readonly type: "crosses";
+}>, dimensions: Dimensions, id: string): string;
 /**
  * Ruled lines, one to a tile, rotated as a set.
  *

package/dist/texture/pattern.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pattern.d.ts","sourceRoot":"","sources":["../../src/texture/pattern.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAiCvD,qCAAqC;AACrC,wBAAgB,OAAO,CACrB,OAAO,EAAE,OAAO,CAAC,OAAO,EAAE;IAAE,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC,EACpD,UAAU,EAAE,UAAU,EACtB,EAAE,EAAE,MAAM,GACT,MAAM,CAgBR;AAED;;;;;;;GAOG;AACH,wBAAgB,QAAQ,CACtB,OAAO,EAAE,OAAO,CAAC,OAAO,EAAE;IAAE,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAA;CAAE,CAAC,EACrD,UAAU,EAAE,UAAU,EACtB,EAAE,EAAE,MAAM,GACT,MAAM,CAiBR"}
+{"version":3,"file":"pattern.d.ts","sourceRoot":"","sources":["../../src/texture/pattern.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAiBvD,qCAAqC;AACrC,wBAAgB,OAAO,CACrB,OAAO,EAAE,OAAO,CAAC,OAAO,EAAE;IAAE,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC,EACpD,UAAU,EAAE,UAAU,EACtB,EAAE,EAAE,MAAM,GACT,MAAM,CAgBR;AAED;;;;;;GAMG;AACH,wBAAgB,UAAU,CACxB,OAAO,EAAE,OAAO,CAAC,OAAO,EAAE;IAAE,QAAQ,CAAC,IAAI,EAAE,SAAS,CAAA;CAAE,CAAC,EACvD,UAAU,EAAE,UAAU,EACtB,EAAE,EAAE,MAAM,GACT,MAAM,CAoBR;AAED;;;;;;;GAOG;AACH,wBAAgB,QAAQ,CACtB,OAAO,EAAE,OAAO,CAAC,OAAO,EAAE;IAAE,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAA;CAAE,CAAC,EACrD,UAAU,EAAE,UAAU,EACtB,EAAE,EAAE,MAAM,GACT,MAAM,CA8BR"}