magick-components 0.0.0-stage → 0.1.0

package/lib/gd/hall/art/furnishings.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { ITEM_DETAIL, ITEM_OUTLINE, original, PALETTE, sameForEveryNode, } from "./shared.js";
+export const gongProvenance = original("A gong on its frame, drawn from geometry: two posts and a bar, the " +
+    "disc hanging from two cords, its rings and boss.");
+export const brazierProvenance = original("A brazier drawn from geometry: a bowl on three legs with flames.");
+export const candleProvenance = original("A candle on a candlestick, drawn from geometry, its flame lit.");
+/** Every art module exports its provenance; these three share a module. */
+export const provenance = [gongProvenance, brazierProvenance, candleProvenance];
+const ink = PALETTE.ink;
+/** A gong (`item(kind="gong")`), the Portal's, 100 × 100. */
+export const gongArt = {
+    Component: () => (_jsxs(_Fragment, { children: [_jsx("path", { d: "M-40,46V-42M40,46V-42M-46,-42H46M-48,46H-32M32,46H48", stroke: ink, strokeWidth: 6, strokeLinecap: "round", fill: "none" }), _jsx("path", { d: "M-12,-42L-10,-25M12,-42L10,-25", stroke: ink, strokeWidth: ITEM_DETAIL, fill: "none" }), _jsx("circle", { cy: 4, r: 30, fill: PALETTE.bronze, stroke: ink, strokeWidth: ITEM_OUTLINE.strokeWidth }), _jsx("circle", { cy: 4, r: 20, fill: "none", stroke: ink, strokeWidth: ITEM_DETAIL }), _jsx("circle", { cy: 4, r: 8, fill: PALETTE.gold, stroke: ink, strokeWidth: ITEM_DETAIL })] })),
+    box: { width: 100, height: 100 },
+    variant: sameForEveryNode,
+    provenance: gongProvenance,
+};
+/** Three tongues of flame, outer red and inner yellow. */
+const FLAMES = [
+    [-22, 0.8],
+    [0, 1],
+    [22, 0.8],
+];
+/** A brazier (`item(kind="brazier")`): a bowl of fire on legs, 100 × 100. */
+export const brazierArt = {
+    Component: () => (_jsxs(_Fragment, { children: [_jsx("path", { d: "M-26,14L-34,46M0,20V46M26,14L34,46", stroke: ink, strokeWidth: 4, strokeLinecap: "round" }), FLAMES.map(([x, k]) => (_jsxs("g", { transform: `translate(${x} -8) scale(${k})`, children: [_jsx("path", { d: "M0,-42C14,-24 14,-8 0,0C-14,-8 -14,-24 0,-42Z", fill: PALETTE.fire, stroke: ink, strokeWidth: ITEM_DETAIL }), _jsx("path", { d: "M0,-24C7,-14 7,-6 0,-2C-7,-6 -7,-14 0,-24Z", fill: PALETTE.flame })] }, x))), _jsx("path", { d: "M-44,-8H44A44,28 0 0 1 -44,-8Z", fill: PALETTE.bronze, ...ITEM_OUTLINE })] })),
+    box: { width: 100, height: 100 },
+    variant: sameForEveryNode,
+    provenance: brazierProvenance,
+};
+/** A candle (`item(kind="candle")`) on its stick, 40 × 100. */
+export const candleArt = {
+    Component: () => (_jsxs(_Fragment, { children: [_jsx("rect", { x: -18, y: 40, width: 36, height: 8, fill: PALETTE.bronze, stroke: ink, strokeWidth: ITEM_OUTLINE.strokeWidth }), _jsx("rect", { x: -11, y: 30, width: 22, height: 10, fill: PALETTE.bronze, stroke: ink, strokeWidth: ITEM_OUTLINE.strokeWidth }), _jsx("rect", { x: -7, y: -22, width: 14, height: 52, fill: PALETTE.wax, stroke: ink, strokeWidth: ITEM_OUTLINE.strokeWidth }), _jsx("path", { d: "M0,-22V-28", stroke: ink, strokeWidth: ITEM_DETAIL }), _jsx("path", { d: "M0,-50C8,-38 7,-30 0,-27C-7,-30 -8,-38 0,-50Z", fill: PALETTE.flame, stroke: PALETTE.fire, strokeWidth: ITEM_DETAIL })] })),
+    box: { width: 40, height: 100 },
+    variant: sameForEveryNode,
+    provenance: candleProvenance,
+};

package/lib/gd/hall/art/geometry.d.ts

@@ -0,0 +1,49 @@
+/** SVG `points` for a polygon, rounded so server and browser agree. */
+export declare function points(list: readonly (readonly [number, number])[]): string;
+/**
+ * An equilateral triangle of circumradius `r` with its centroid on the
+ * origin, pointing up or down.
+ */
+export declare function triangle(r: number, dir: "up" | "down"): string;
+/** A point in an art's units. */
+export type Point = readonly [x: number, y: number];
+/**
+ * One segment of a profile: a line, a cubic (`c1`, `c2`) or a quadratic
+ * (`q`) Bézier to `to`.
+ */
+export type Segment = {
+    to: Point;
+} | {
+    c1: Point;
+    c2: Point;
+    to: Point;
+} | {
+    q: Point;
+    to: Point;
+};
+/**
+ * A closed outline symmetric about the vertical axis, from its right half
+ * as a lathe profile: `start` and the last point lie on the axis, and the
+ * left half is the right one mirrored and walked back. Vessels are drawn
+ * this way.
+ */
+export declare function mirrored(start: Point, segments: readonly Segment[]): string;
+/**
+ * A smooth open path through points (Catmull–Rom as cubic Béziers), to
+ * `decimals` places (two unless a small glyph needs fewer bytes). With
+ * `from` and `to`, only that stretch of it, between those points, along
+ * exactly the same curve as the whole path.
+ */
+export declare function smoothPath(list: readonly Point[], decimals?: number, from?: number, to?: number): string;
+/**
+ * The point `r` from `centre` at `degrees`, measured clockwise from East
+ * on the screen (y down).
+ */
+export declare function polar(r: number, degrees: number, center?: Point): readonly [number, number];
+/** A point as path data (`x,y`), to two decimals. */
+export declare const pathPoint: ([x, y]: Point) => string;
+/**
+ * A path's x coordinates negated: the drawing mirrored left to right. Only
+ * for absolute commands whose numbers come in `x,y` pairs (M, L, C, Q).
+ */
+export declare function flipped(d: string): string;

package/lib/gd/hall/art/geometry.js

@@ -0,0 +1,97 @@
+import { svgCoordinate } from "../../../svgCoordinate.js";
+/** SVG `points` for a polygon, rounded so server and browser agree. */
+export function points(list) {
+    return list
+        .map(([x, y]) => `${svgCoordinate(x)},${svgCoordinate(y)}`)
+        .join(" ");
+}
+/**
+ * An equilateral triangle of circumradius `r` with its centroid on the
+ * origin, pointing up or down.
+ */
+export function triangle(r, dir) {
+    const s = dir === "up" ? -1 : 1;
+    const half = r * Math.sin(Math.PI / 3);
+    return points([
+        [0, s * r],
+        [-half, (-s * r) / 2],
+        [half, (-s * r) / 2],
+    ]);
+}
+/** A coordinate to two decimals: enough for a 100-unit drawing, and short. */
+const short = (value) => Math.round(value * 100) / 100 + 0;
+const pair = ([x, y]) => `${short(x)},${short(y)}`;
+const mirror = ([x, y]) => [-x, y];
+function command(segment) {
+    if ("c1" in segment)
+        return `C${pair(segment.c1)} ${pair(segment.c2)} ${pair(segment.to)}`;
+    if ("q" in segment)
+        return `Q${pair(segment.q)} ${pair(segment.to)}`;
+    return `L${pair(segment.to)}`;
+}
+/**
+ * A closed outline symmetric about the vertical axis, from its right half
+ * as a lathe profile: `start` and the last point lie on the axis, and the
+ * left half is the right one mirrored and walked back. Vessels are drawn
+ * this way.
+ */
+export function mirrored(start, segments) {
+    const from = [start, ...segments.map((segment) => segment.to)];
+    const left = segments
+        .map((segment, index) => {
+        const back = mirror(from[index]);
+        if ("c1" in segment)
+            return `C${pair(mirror(segment.c2))} ${pair(mirror(segment.c1))} ${pair(back)}`;
+        if ("q" in segment)
+            return `Q${pair(mirror(segment.q))} ${pair(back)}`;
+        return `L${pair(back)}`;
+    })
+        .reverse();
+    return `M${pair(start)}${segments.map(command).join("")}${left.join("")}Z`;
+}
+/**
+ * A smooth open path through points (Catmull–Rom as cubic Béziers), to
+ * `decimals` places (two unless a small glyph needs fewer bytes). With
+ * `from` and `to`, only that stretch of it, between those points, along
+ * exactly the same curve as the whole path.
+ */
+export function smoothPath(list, decimals = 2, from = 0, to = list.length - 1) {
+    const at = (index) => list[Math.min(list.length - 1, Math.max(0, index))];
+    const scale = 10 ** decimals;
+    const round = (value) => Math.round(value * scale) / scale + 0;
+    const pair = ([x, y]) => `${round(x)},${round(y)}`;
+    let d = `M${pair(list[from])}`;
+    for (let i = from; i < to; i++) {
+        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,
+        ];
+        d += `C${pair(c1)} ${pair(c2)} ${pair(p2)}`;
+    }
+    return d;
+}
+/**
+ * The point `r` from `centre` at `degrees`, measured clockwise from East
+ * on the screen (y down).
+ */
+export function polar(r, degrees, center = [0, 0]) {
+    const angle = (degrees * Math.PI) / 180;
+    return [
+        center[0] + r * Math.cos(angle),
+        center[1] + r * Math.sin(angle),
+    ];
+}
+/** A point as path data (`x,y`), to two decimals. */
+export const pathPoint = pair;
+/**
+ * A path's x coordinates negated: the drawing mirrored left to right. Only
+ * for absolute commands whose numbers come in `x,y` pairs (M, L, C, Q).
+ */
+export function flipped(d) {
+    return d.replace(/(-?[\d.]+),(-?[\d.]+)/g, (_, x, y) => `${short(-x)},${y}`);
+}

package/lib/gd/hall/art/hebrewLetter.d.ts

@@ -0,0 +1,10 @@
+import type { HallArt } from "../types.ts";
+export declare const provenance: {
+    origin: "original" | "thirdParty";
+    author: string;
+    license: string;
+    source?: string;
+    notes?: string;
+};
+/** A Hebrew-letter banner, 100 × 92 units. */
+export declare const hebrewLetterArt: HallArt;

package/lib/gd/hall/art/hebrewLetter.js

@@ -0,0 +1,38 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { svgCoordinate } from "../../../svgCoordinate.js";
+import { stringAttr } from "../attributes.js";
+import { GD_HALL_FONT_STACKS } from "../fonts.js";
+import { hebrewLetter } from "../hebrewLetters.js";
+import { hebrewLetterBody } from "../labels.js";
+import { pennantPath, Rod } from "./banner.js";
+import { original, PALETTE, variantOf } from "./shared.js";
+export const provenance = {
+    ...original("Gadi Cohen's own letter banner design: a light pennant on a rod " +
+        "with knobs, the letter " +
+        "set in Frank Ruhl Libre Bold (SIL OFL 1.1) by the browser; no glyph " +
+        "outlines are copied into the code."),
+};
+const TOP = -38;
+/** The letter's size, and where the middle of its body stands. */
+const LETTER_SIZE = 62;
+const LETTER_MIDDLE = 1;
+/** The baseline that centres the letter's body (from the font) there. */
+const BASELINE = LETTER_MIDDLE +
+    (LETTER_SIZE * (hebrewLetterBody.top - hebrewLetterBody.bottom)) / 2;
+/** The letter drawn: one of the 22, whatever spelling named it. */
+const letterOf = (node) => {
+    const name = stringAttr(node, "letter", 40);
+    return name === undefined ? undefined : hebrewLetter(name);
+};
+function HebrewLetter({ node, defId }) {
+    const letter = letterOf(node);
+    const fill = defId("fill");
+    return (_jsxs(_Fragment, { children: [_jsx("defs", { children: _jsxs("linearGradient", { id: fill, x1: -38, x2: 38, y1: 0, y2: 0, gradientUnits: "userSpaceOnUse", children: [_jsx("stop", { offset: 0, stopColor: PALETTE.bannerLightFrom }), _jsx("stop", { offset: 1, stopColor: PALETTE.bannerLightTo })] }) }), _jsx(Rod, { y: TOP }), _jsx("path", { d: pennantPath(TOP, 26, 45), fill: `url(#${fill})`, stroke: PALETTE.ink, strokeWidth: 0.8 }), letter && (_jsx("text", { x: 0, y: svgCoordinate(BASELINE), fontSize: LETTER_SIZE, fontFamily: GD_HALL_FONT_STACKS.hebrew, fontWeight: 700, textAnchor: "middle", fill: PALETTE.ink, children: letter }))] }));
+}
+/** A Hebrew-letter banner, 100 × 92 units. */
+export const hebrewLetterArt = {
+    Component: HebrewLetter,
+    box: { width: 100, height: 92 },
+    variant: (node) => variantOf(letterOf(node)),
+    provenance,
+};

package/lib/gd/hall/art/index.d.ts

@@ -0,0 +1,7 @@
+import type { HallArtRegistry } from "../types.ts";
+/**
+ * The package's own art, all original (MIT). The app composes its art over
+ * this — `new Map([...DEFAULT_HALL_ART, ["tablet", tabletArt(font)]])` — and
+ * anything still missing draws as a placeholder.
+ */
+export declare const DEFAULT_HALL_ART: HallArtRegistry;

package/lib/gd/hall/art/index.js

@@ -0,0 +1,61 @@
+import { altarArt } from "./altar.js";
+import { breadArt, fanArt, roseArt, saltArt } from "./altarItems.js";
+import { bannerArt } from "./banner.js";
+import { boardArt } from "./board.js";
+import { cardArt } from "./cards.js";
+import { brazierArt, candleArt, gongArt } from "./furnishings.js";
+import { hebrewLetterArt } from "./hebrewLetter.js";
+import { crossArt, pentagramArt, triangleArt } from "./items.js";
+import { kameaArt, sealArt } from "./kamea.js";
+import { lamenArt } from "./lamen.js";
+import { lightningArt } from "./lightning.js";
+import { lampArt, lanternArt } from "./lights.js";
+import { markerArt } from "./marker.js";
+import { pantacleArt } from "./pantacle.js";
+import { pillarArt } from "./pillar.js";
+import { platformArt, throneArt } from "./platform.js";
+import { candlestickArt, shewbreadArt, tabletArt } from "./symbols.js";
+import { tarotKeyArt } from "./tarotKey.js";
+import { veilArt } from "./veil.js";
+import { censerArt, chaliceArt, cupArt } from "./vessels.js";
+/**
+ * The package's own art, all original (MIT). The app composes its art over
+ * this — `new Map([...DEFAULT_HALL_ART, ["tablet", tabletArt(font)]])` — and
+ * anything still missing draws as a placeholder.
+ */
+export const DEFAULT_HALL_ART = new Map([
+    ["altar", altarArt],
+    ["platform", platformArt],
+    ["throne", throneArt],
+    ["board", boardArt],
+    ["pillar", pillarArt],
+    ["banner", bannerArt],
+    ["hebrewLetter", hebrewLetterArt],
+    ["marker", markerArt],
+    ["lamen", lamenArt],
+    ["item:cross", crossArt],
+    ["item:triangle", triangleArt],
+    ["item:pentagram", pentagramArt],
+    ["item:pantacle", pantacleArt],
+    ["item:lightning", lightningArt],
+    ["item:gong", gongArt],
+    ["item:brazier", brazierArt],
+    ["item:candle", candleArt],
+    ["item:cup", cupArt],
+    ["item:chalice", chaliceArt],
+    ["item:censer", censerArt],
+    ["item:lamp", lampArt],
+    ["item:lantern", lanternArt],
+    ["item:rose", roseArt],
+    ["item:salt", saltArt],
+    ["item:bread", breadArt],
+    ["item:fan", fanArt],
+    ["tarotKey", tarotKeyArt],
+    ["card", cardArt],
+    ["tablet", tabletArt()],
+    ["shewbread", shewbreadArt],
+    ["candlestick", candlestickArt],
+    ["veil", veilArt],
+    ["kamea", kameaArt],
+    ["seal", sealArt],
+]);

package/lib/gd/hall/art/items.d.ts

@@ -0,0 +1,12 @@
+import type { HallArt } from "../types.ts";
+export declare const crossProvenance: import("../types.ts").HallArtProvenance;
+export declare const triangleProvenance: import("../types.ts").HallArtProvenance;
+export declare const pentagramProvenance: import("../types.ts").HallArtProvenance;
+/** Every art module exports its provenance; the items share these. */
+export declare const provenance: import("../types.ts").HallArtProvenance[];
+/** A cross; `form` picks the shape, `fill` and `stroke` its colours. */
+export declare const crossArt: HallArt;
+/** A triangle pointing up or down (`dir`), outlined white by default. */
+export declare const triangleArt: HallArt;
+/** A pentagram, point up unless `dir="down"`. */
+export declare const pentagramArt: HallArt;

package/lib/gd/hall/art/items.js

@@ -0,0 +1,125 @@
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { enumAttr } from "../attributes.js";
+import { CROSS_FORMS, HALL_COLOR_NAMES, HALL_COLORS, hallColor, } from "../vocabulary.js";
+import { points } from "./geometry.js";
+import { original, variantOf } from "./shared.js";
+/** A named colour from the node, or the art's default; never raw CSS. */
+const color = (node, name, fallback) => HALL_COLORS.get(hallColor(enumAttr(node, name, HALL_COLOR_NAMES)) ?? fallback);
+const direction = (node) => enumAttr(node, "dir", ["up", "down"]) ?? "up";
+export const crossProvenance = original("Crosses drawn from geometry: Latin, Calvary (on three steps), Greek, " +
+    "Greek of five squares, and of four triangles.");
+export const triangleProvenance = original("An equilateral triangle.");
+export const pentagramProvenance = original("A five-pointed star polygon.");
+/** Every art module exports its provenance; the items share these. */
+export const provenance = [
+    crossProvenance,
+    triangleProvenance,
+    pentagramProvenance,
+];
+const CROSS_BOXES = new Map([
+    ["latin", { width: 60, height: 100 }],
+    ["calvary", { width: 60, height: 100 }],
+    ["greek", { width: 100, height: 100 }],
+    ["greekFiveSquares", { width: 100, height: 100 }],
+    ["fourTriangles", { width: 100, height: 100 }],
+]);
+const crossForm = (node) => enumAttr(node, "form", CROSS_FORMS) ?? "latin";
+const CROSS_PATHS = new Map([
+    ["latin", ["M-8,-50H8V-28H30V-12H8V50H-8V-12H-30V-28H-8Z"]],
+    [
+        "calvary",
+        [
+            "M-7,-50H7V-34H22V-20H7V14H-7V-20H-22V-34H-7Z",
+            "M-14,14H14V26H-14Z",
+            "M-22,26H22V38H-22Z",
+            "M-30,38H30V50H-30Z",
+        ],
+    ],
+    ["greek", ["M-15,-50H15V-15H50V15H15V50H-15V15H-50V-15H-15Z"]],
+    [
+        "greekFiveSquares",
+        [
+            [-1, 0],
+            [0, -1],
+            [0, 0],
+            [0, 1],
+            [1, 0],
+        ].map(([i, j]) => {
+            const x = i * 33 - 16.5;
+            const y = j * 33 - 16.5;
+            return `M${x},${y}h33v33h-33Z`;
+        }),
+    ],
+    [
+        "fourTriangles",
+        [
+            points([
+                [-30, -50],
+                [30, -50],
+                [0, -4],
+            ]),
+            points([
+                [50, -30],
+                [50, 30],
+                [4, 0],
+            ]),
+            points([
+                [30, 50],
+                [-30, 50],
+                [0, 4],
+            ]),
+            points([
+                [-50, 30],
+                [-50, -30],
+                [-4, 0],
+            ]),
+        ].map((list) => `M${list}Z`),
+    ],
+]);
+function Cross({ node }) {
+    return (_jsx(_Fragment, { children: CROSS_PATHS.get(crossForm(node)).map((d) => (_jsx("path", { d: d, fill: color(node, "fill", "red"), stroke: color(node, "stroke", "yellow"), strokeWidth: 3, strokeLinejoin: "miter" }, d))) }));
+}
+/** A cross; `form` picks the shape, `fill` and `stroke` its colours. */
+export const crossArt = {
+    Component: Cross,
+    box: (node) => CROSS_BOXES.get(crossForm(node)),
+    variant: (node) => variantOf(crossForm(node), color(node, "fill", "red"), color(node, "stroke", "yellow")),
+    provenance: crossProvenance,
+};
+// The triangle's box is its bounding box; its centre is the box's centre.
+const SIDE = 88;
+const HEIGHT = (SIDE * Math.sqrt(3)) / 2;
+function Triangle({ node }) {
+    const up = direction(node) === "up";
+    const s = up ? 1 : -1;
+    return (_jsx("polygon", { points: points([
+            [0, (-s * HEIGHT) / 2],
+            [SIDE / 2, (s * HEIGHT) / 2],
+            [-SIDE / 2, (s * HEIGHT) / 2],
+        ]), fill: color(node, "fill", "none"), stroke: color(node, "stroke", "white"), strokeWidth: 11, strokeLinejoin: "miter" }));
+}
+/** A triangle pointing up or down (`dir`), outlined white by default. */
+export const triangleArt = {
+    Component: Triangle,
+    box: { width: 100, height: 86.6 },
+    variant: (node) => variantOf(direction(node), color(node, "fill", "none"), color(node, "stroke", "white")),
+    provenance: triangleProvenance,
+};
+// A pentagram's points lie on a circle of radius 50; its bounding box runs
+// from the top point to 50·cos 36° below the centre, so shift it to centre.
+const STAR_SHIFT = (50 - 50 * Math.cos(Math.PI / 5)) / 2;
+function Pentagram({ node }) {
+    const s = direction(node) === "up" ? 1 : -1;
+    const star = [0, 2, 4, 1, 3].map((i) => {
+        const angle = -Math.PI / 2 + (i * 2 * Math.PI) / 5;
+        return [50 * Math.cos(angle), s * (50 * Math.sin(angle) + STAR_SHIFT)];
+    });
+    return (_jsx("polygon", { points: points(star), fill: color(node, "fill", "none"), stroke: color(node, "stroke", "white"), strokeWidth: 5, strokeLinejoin: "miter" }));
+}
+/** A pentagram, point up unless `dir="down"`. */
+export const pentagramArt = {
+    Component: Pentagram,
+    box: { width: 95.1, height: 90.5 },
+    variant: (node) => variantOf(direction(node), color(node, "fill", "none"), color(node, "stroke", "white")),
+    provenance: pentagramProvenance,
+};

package/lib/gd/hall/art/kamea.d.ts

@@ -0,0 +1,20 @@
+import type { HallArt, HallAttrSpec } from "../types.ts";
+import { sealProvenance } from "./seals.tsx";
+export declare const kameaProvenance: import("../types.ts").HallArtProvenance;
+export { sealProvenance };
+/** Every art module exports its provenance; these two share a module. */
+export declare const provenance: import("../types.ts").HallArtProvenance[];
+/** `planet`: one of the seven. */
+export declare const PLANET_SPEC: HallAttrSpec;
+/**
+ * A planet's kamea (`kamea(planet="moon")`), 100 × 100: the square of
+ * its order, Saturn 3 × 3 to the Moon 9 × 9. Without a planet, an empty
+ * frame.
+ */
+export declare const kameaArt: HallArt;
+/**
+ * A planet's seals (`seal(planet="moon")`), 100 × 100: the Moon's and
+ * Venus' seals after Agrippa (`seals.tsx`); for the other planets, until
+ * theirs are drawn, a dashed ring with "Seals of Sol" in it.
+ */
+export declare const sealArt: HallArt;

package/lib/gd/hall/art/kamea.js

@@ -0,0 +1,64 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { KameaFigure } from "../../../astrology/Kamea.js";
+import { svgCoordinate } from "../../../svgCoordinate.js";
+import { enumAttr } from "../attributes.js";
+import { GD_HALL_FONT_STACKS } from "../fonts.js";
+import { wrapText } from "../labels.js";
+import { HALL_KAMEA_PLANET_IDS, HALL_PLANET_NAMES, HALL_PLANETS, } from "../planets.js";
+import { SEALS, sealProvenance } from "./seals.js";
+import { original, PALETTE, variantOf } from "./shared.js";
+export const kameaProvenance = original("A planet's magic square drawn from its numbers, which magick-data " +
+    "computes (astrology/kameas): the shared Kamea component's figure, a " +
+    "grid with each number in its cell.");
+export { sealProvenance };
+/** Every art module exports its provenance; these two share a module. */
+export const provenance = [kameaProvenance, sealProvenance];
+/** `planet`: one of the seven. */
+export const PLANET_SPEC = { kind: "enum", values: HALL_PLANETS };
+const planetOf = (node) => enumAttr(node, "planet", HALL_PLANETS);
+/**
+ * The shared `KameaFigure` in the hall's fonts and palette. Its square is
+ * 96 units across, inside the art's 100 × 100 box.
+ */
+function Kamea({ node }) {
+    const planet = planetOf(node);
+    return (_jsx(KameaFigure, { planet: planet && HALL_KAMEA_PLANET_IDS.get(planet), fontFamily: GD_HALL_FONT_STACKS.serif, paper: PALETTE.paper, ink: PALETTE.ink }));
+}
+/**
+ * A planet's kamea (`kamea(planet="moon")`), 100 × 100: the square of
+ * its order, Saturn 3 × 3 to the Moon 9 × 9. Without a planet, an empty
+ * frame.
+ */
+export const kameaArt = {
+    Component: Kamea,
+    box: { width: 100, height: 100 },
+    attributes: new Map([["planet", PLANET_SPEC]]),
+    // One of seven squares, or the empty frame.
+    variant: (node) => variantOf(planetOf(node)),
+    provenance: kameaProvenance,
+};
+const SEAL_SIZE = 13;
+const SEAL_WIDTH = 64;
+function Seal({ node }) {
+    const planet = planetOf(node);
+    const Drawn = planet && SEALS.get(planet);
+    if (Drawn)
+        return _jsx(Drawn, {});
+    const name = planet && HALL_PLANET_NAMES.get(planet);
+    const lines = name ? wrapText(`Seals of ${name}`, SEAL_WIDTH, SEAL_SIZE) : [];
+    const advance = SEAL_SIZE * 1.2;
+    const first = SEAL_SIZE * 0.36 - ((lines.length - 1) * advance) / 2;
+    return (_jsxs(_Fragment, { children: [_jsx("circle", { r: 47, fill: PALETTE.paper, stroke: PALETTE.placeholder, strokeWidth: 2.5, strokeDasharray: "7 5" }), _jsx("circle", { r: 39, fill: "none", stroke: PALETTE.placeholder, strokeWidth: 1 }), _jsx("g", { fill: PALETTE.placeholder, fontFamily: GD_HALL_FONT_STACKS.serif, fontStyle: "italic", fontSize: SEAL_SIZE, textAnchor: "middle", style: { fontVariantLigatures: "none", fontKerning: "normal" }, children: lines.map((line, index) => (_jsx("text", { y: svgCoordinate(first + index * advance), children: line.text }, index))) })] }));
+}
+/**
+ * A planet's seals (`seal(planet="moon")`), 100 × 100: the Moon's and
+ * Venus' seals after Agrippa (`seals.tsx`); for the other planets, until
+ * theirs are drawn, a dashed ring with "Seals of Sol" in it.
+ */
+export const sealArt = {
+    Component: Seal,
+    box: { width: 100, height: 100 },
+    attributes: new Map([["planet", PLANET_SPEC]]),
+    variant: (node) => variantOf(planetOf(node)),
+    provenance: sealProvenance,
+};

package/lib/gd/hall/art/lamen.d.ts

@@ -0,0 +1,9 @@
+import type { HallArt, HallAttrSpec } from "../types.ts";
+export declare const provenance: import("../types.ts").HallArtProvenance;
+/**
+ * `grade`: the grade whose lamen an officer wears, for the officers who
+ * wear another in it (the Portal's Hiereus and Hegemon, stage H, part 2).
+ */
+export declare const GRADE_SPEC: HallAttrSpec;
+/** The officers' lamens (plan 061, decision 9). */
+export declare const lamenArt: HallArt;

package/lib/gd/hall/art/lamen.js

@@ -0,0 +1,52 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import Lamen, { LAMEN_OFFICERS } from "../../Lamen.js";
+import { hasGradeLamen, LAMEN_GRADES } from "../../lamenGrades.js";
+import { enumAttr, stringAttr } from "../attributes.js";
+import { original, PALETTE } from "./shared.js";
+export const provenance = original("The officers' lamens, drawn by `Lamen` (gd/Lamen.tsx): " +
+    "the collar's ring, the disc and the officer's glyph; a plain circle " +
+    "for an officer without a role.");
+/**
+ * Whether a node draws the plain circle: without a role, as the validator
+ * promises. Every hall role has its lamen since stage H, part 2 (the
+ * adepts' were labelled circles before); any other role draws through
+ * `Lamen` as its plain lamen.
+ */
+const plainCircle = (role) => role === undefined || role === "";
+const roleOf = (node) => stringAttr(node, "role", 200);
+/**
+ * `grade`: the grade whose lamen an officer wears, for the officers who
+ * wear another in it (the Portal's Hiereus and Hegemon, stage H, part 2).
+ */
+export const GRADE_SPEC = { kind: "enum", values: LAMEN_GRADES };
+/** The grade a node's lamen is drawn for: only one that changes it. */
+const gradeOf = (node, role) => {
+    const grade = enumAttr(node, "grade", LAMEN_GRADES);
+    return grade !== undefined && hasGradeLamen(role, grade) ? grade : undefined;
+};
+/** An officer's lamen in its 100 × 100 box, centred, or the plain circle. */
+function HallLamen({ node }) {
+    const role = roleOf(node);
+    if (plainCircle(role))
+        return (_jsx("circle", { r: 47, fill: PALETTE.paper, stroke: PALETTE.ink, strokeWidth: 6 }));
+    return (_jsx("g", { transform: "translate(-50 -50)", children: _jsx(Lamen, { officer: role, grade: gradeOf(node, role), width: 100, height: 100 }) }));
+}
+/** The officers' lamens (plan 061, decision 9). */
+export const lamenArt = {
+    Component: HallLamen,
+    box: { width: 100, height: 100 },
+    // 1.6 squares in an officer's 2-square cell (layout.ts, DEFAULT_SCALES).
+    inset: 0.8,
+    attributes: new Map([["grade", GRADE_SPEC]]),
+    // A role `Lamen` does not know draws its plain lamen, whatever the name.
+    variant: (node) => {
+        const role = roleOf(node);
+        if (plainCircle(role))
+            return "";
+        if (!LAMEN_OFFICERS.has(role))
+            return "?";
+        const grade = gradeOf(node, role);
+        return grade ? `${grade}:${role}` : role;
+    },
+    provenance,
+};

package/lib/gd/hall/art/lightning.d.ts

@@ -0,0 +1,13 @@
+import type { HallArt } from "../types.ts";
+export declare const provenance: {
+    origin: "original" | "thirdParty";
+    author: string;
+    license: string;
+    source?: string;
+    notes?: string;
+};
+/**
+ * The Flaming Sword, the lightning flash down the Tree
+ * (`item(kind="lightning")`), black unless `stroke` names a colour.
+ */
+export declare const lightningArt: HallArt;

package/lib/gd/hall/art/lightning.js

@@ -0,0 +1,44 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { enumAttr } from "../attributes.js";
+import { HALL_COLOR_NAMES, HALL_COLORS, hallColor } from "../vocabulary.js";
+import { points } from "./geometry.js";
+import { original, PALETTE, variantOf } from "./shared.js";
+export const provenance = {
+    ...original("The Flaming Sword as a zig-zag, after Gadi Cohen's own design, with " +
+        "the arrowhead drawn as a triangle instead of an SVG marker."),
+};
+const STROKE = 3.8;
+const ZIGZAG = [
+    [0.1, -48.1],
+    [20.4, -36.3],
+    [-20.6, -36.4],
+    [20.4, -13.4],
+    [-20.6, -13.8],
+    [20.6, 10],
+    [-19.9, 9.9],
+    [1.1, 21.6],
+    [1.4, 40.2],
+];
+/** `stroke` names a colour, so the flash shows on the black altar too. */
+const inkOf = (node) => {
+    const name = hallColor(enumAttr(node, "stroke", HALL_COLOR_NAMES));
+    return name === undefined ? PALETTE.ink : HALL_COLORS.get(name);
+};
+function Lightning({ node }) {
+    const ink = inkOf(node);
+    return (_jsxs("g", { stroke: ink, strokeWidth: STROKE, fill: "none", children: [_jsx("polyline", { points: points(ZIGZAG), strokeLinejoin: "miter" }), _jsx("line", { x1: 11, y1: -47.8, x2: 5.8, y2: -38.6 }), _jsx("polygon", { points: points([
+                    [1.5, 50],
+                    [-4.3, 40.3],
+                    [7, 40.1],
+                ]), fill: ink, stroke: "none" })] }));
+}
+/**
+ * The Flaming Sword, the lightning flash down the Tree
+ * (`item(kind="lightning")`), black unless `stroke` names a colour.
+ */
+export const lightningArt = {
+    Component: Lightning,
+    box: { width: 45.1, height: 100 },
+    variant: (node) => variantOf(inkOf(node)),
+    provenance,
+};