rpg-engine 0.0.0-stage → 0.1.1

package/dist/dashboard/language-choice.js

@@ -0,0 +1,83 @@
+import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
+// The game's language as a choice with a search (D-394): every language, each in its own words and in the page's, those the page is written in first; a code
+// not in the list can be written whole, as pt-PT. A choice is saved at once, as the other settings'.
+import { useEffect, useId, useMemo, useState } from "preact/hooks";
+import { languageName, languageOf, languages, matches } from "./languages.js";
+import { pageTranslation, t } from "./text.js";
+export function LanguageChoice({ value, labelledBy, describedBy, onPick }) {
+    const pageLanguage = document.documentElement.lang || "en";
+    const all = useMemo(() => languages(pageLanguage), [pageLanguage]);
+    const chosen = value === undefined ? undefined : languageOf(value, pageLanguage);
+    // What the player writes to look for one; undefined while the list is closed.
+    const [typed, setTyped] = useState();
+    const [active, setActive] = useState(0);
+    const list = useId();
+    const open = typed !== undefined;
+    const written = typed?.trim() ?? "";
+    const found = open ? all.filter((language) => matches(language, written)) : [];
+    const whole = /^[a-z]{2,3}(-[a-z0-9]{2,8})*$/i.test(written) && !all.some((language) => language.code.toLowerCase() === written.toLowerCase());
+    const extra = whole ? languageOf(written, pageLanguage) : undefined;
+    const options = extra === undefined ? found : [extra, ...found];
+    // The option the arrows are on stays in view.
+    useEffect(() => {
+        if (open) {
+            document.getElementById(`${list}-${active}`)?.scrollIntoView({ block: "nearest" });
+        }
+    }, [open, active]);
+    const pick = (code) => {
+        setTyped(undefined);
+        if (code !== value) {
+            onPick(code);
+        }
+    };
+    const key = (event) => {
+        if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+            event.preventDefault();
+            if (!open) {
+                setTyped("");
+                return;
+            }
+            const step = event.key === "ArrowDown" ? 1 : -1;
+            setActive((at) => (options.length === 0 ? 0 : (at + step + options.length) % options.length));
+        }
+        else if (event.key === "Enter" && open) {
+            event.preventDefault();
+            const option = options[active];
+            if (option !== undefined) {
+                pick(option.code);
+            }
+        }
+        else if (event.key === "Escape" && open) {
+            event.preventDefault();
+            setTyped(undefined);
+        }
+    };
+    return (_jsxs("div", { class: open ? "language-choice open" : "language-choice", children: [_jsx("input", { type: "text", role: "combobox", "aria-expanded": open, "aria-controls": list, "aria-autocomplete": "list", "aria-activedescendant": open && options[active] !== undefined ? `${list}-${active}` : undefined, "aria-labelledby": labelledBy, "aria-describedby": describedBy, value: open ? typed : chosen?.own ?? value ?? "", placeholder: t("Search a language…"), autoComplete: "off", spellcheck: false, onFocus: () => {
+                    setTyped("");
+                    setActive(Math.max(0, all.findIndex((language) => language.code === value)));
+                }, onInput: (event) => {
+                    setTyped(event.currentTarget.value);
+                    setActive(0);
+                }, onKeyDown: key, onBlur: () => setTyped(undefined) }), _jsx("svg", { class: "language-chevron", viewBox: "0 0 24 24", "aria-hidden": "true", children: _jsx("path", { d: "M6 9.5l6 6 6-6" }) }), open && (_jsx("ul", { id: list, class: "language-list", role: "listbox", "aria-label": t("Languages"), children: options.length === 0
+                    ? _jsx("li", { class: "language-none", role: "presentation", children: t("No language matches: write its code, such as pt-BR.") })
+                    : options.map((language, index) => (_jsxs("li", { id: `${list}-${index}`, role: "option", "aria-selected": language.code === value, class: [index === active ? "active" : "", language.page && options[index + 1]?.page === false ? "page-last" : ""].filter((name) => name !== "").join(" ") || undefined, 
+                        // A press keeps the field's focus, so that the click reaches the option before the list closes.
+                        onMouseDown: (event) => event.preventDefault(), onClick: () => pick(language.code), children: [_jsx("span", { class: "language-own", lang: language.code, children: language.own }), language.here !== undefined && _jsx("span", { class: "language-here", children: language.here }), language.page && _jsx("span", { class: "language-page", children: t("page translated") }), _jsx("span", { class: "language-code", children: language.code })] }, language.code))) }))] }));
+}
+/** What the chosen language means for the page: the master plays in it, and the page is in it too, or stays in English until it is translated. */
+export function languageLine(code) {
+    const pageLanguage = document.documentElement.lang || "en";
+    const language = languageOf(code, pageLanguage);
+    const name = languageName(code, pageLanguage) ?? code;
+    const flying = pageTranslation();
+    const state = language?.page === true ? "ready" : flying?.language === code.toLowerCase() ? flying.state : undefined;
+    if (state === "translating") {
+        return t("The master plays in {language}; this computer is translating the page into it, in English meanwhile.", { language: name });
+    }
+    if (state === "unable") {
+        return t("The master plays in {language}; the page stays in English: Codex or Claude Code would translate it on this computer.", { language: name });
+    }
+    return state === "ready"
+        ? t("The master plays in {language}, and the page is written in it too.", { language: name })
+        : t("The master plays in {language}; the page stays in English.", { language: name });
+}

package/dist/dashboard/languages.js

@@ -0,0 +1,144 @@
+// The languages the player may choose for the game (D-394): every language the master can play in, each named in its own words and in the page's by the
+// browser; a code not listed can still be written. Those the page is written in come first.
+import { pageLanguages } from "./text.js";
+// The languages of the list, by code: ISO 639-1, with the regional variants that read differently.
+const codes = [
+    "af",
+    "am",
+    "ar",
+    "az",
+    "be",
+    "bg",
+    "bn",
+    "bs",
+    "ca",
+    "cs",
+    "cy",
+    "da",
+    "de",
+    "el",
+    "en",
+    "eo",
+    "es",
+    "et",
+    "eu",
+    "fa",
+    "fi",
+    "fil",
+    "fr",
+    "ga",
+    "gd",
+    "gl",
+    "gu",
+    "ha",
+    "he",
+    "hi",
+    "hr",
+    "hu",
+    "hy",
+    "id",
+    "ig",
+    "is",
+    "it",
+    "ja",
+    "jv",
+    "ka",
+    "kk",
+    "km",
+    "kn",
+    "ko",
+    "ku",
+    "ky",
+    "la",
+    "lb",
+    "lo",
+    "lt",
+    "lv",
+    "mg",
+    "mi",
+    "mk",
+    "ml",
+    "mn",
+    "mr",
+    "ms",
+    "mt",
+    "my",
+    "nb",
+    "ne",
+    "nl",
+    "nn",
+    "pa",
+    "pl",
+    "ps",
+    "pt",
+    "pt-BR",
+    "ro",
+    "ru",
+    "rw",
+    "sd",
+    "si",
+    "sk",
+    "sl",
+    "so",
+    "sq",
+    "sr",
+    "sv",
+    "sw",
+    "ta",
+    "te",
+    "tg",
+    "th",
+    "tk",
+    "tr",
+    "tt",
+    "ug",
+    "uk",
+    "ur",
+    "uz",
+    "vi",
+    "xh",
+    "yi",
+    "yo",
+    "zh",
+    "zh-TW",
+    "zu",
+];
+/** Every language of the list the browser can name, those of the page first, the others in the order of their names in the page's language. */
+export function languages(pageLanguage) {
+    const known = codes.flatMap((code) => languageOf(code, pageLanguage) ?? []);
+    const order = new Intl.Collator(pageLanguage).compare;
+    const byName = (first, second) => order(first.here ?? first.own, second.here ?? second.own);
+    return [...known.filter((language) => language.page).sort(byName), ...known.filter((language) => !language.page).sort(byName)];
+}
+/** A language by its code, named; undefined for a code that names no language the browser knows. */
+export function languageOf(code, pageLanguage) {
+    const own = languageName(code, code);
+    if (own === undefined) {
+        return undefined;
+    }
+    const here = languageName(code, pageLanguage);
+    const page = pageLanguages().some((one) => one === code.toLowerCase() || one === code.toLowerCase().split("-")[0]);
+    return { code, own: capitalized(own, code), ...(here === undefined || here.toLowerCase() === own.toLowerCase() ? {} : { here }), page };
+}
+/** Whether a language matches what the player wrote: by its names or its code, case and accents aside. */
+export function matches(language, typed) {
+    const wanted = plain(typed);
+    return wanted === "" || [language.own, language.here ?? "", language.code].some((name) => plain(name).includes(wanted));
+}
+/** A language's name in a language, as the browser writes it; undefined where the browser has none. */
+export function languageName(code, inLanguage) {
+    try {
+        // Without its data the browser names it in its own language, not in the one asked.
+        return Intl.DisplayNames.supportedLocalesOf([inLanguage]).length === 0 ? undefined : new Intl.DisplayNames([inLanguage], { type: "language", fallback: "none" }).of(code);
+    }
+    catch {
+        return undefined;
+    }
+}
+/** A name with its first letter a capital, as a list writes it, in the case its own language has. */
+function capitalized(name, code) {
+    return name.charAt(0).toLocaleUpperCase(code) + name.slice(1);
+}
+function plain(text) {
+    return text.normalize("NFD").replace(/\p{Mn}/gu, "").toLowerCase().trim();
+}

package/dist/dashboard/layout.js

@@ -0,0 +1,93 @@
+// Longer text than this reads as a paragraph, such as a personality trait.
+const shortText = 40;
+// More numbers than this in a group read better as rows, such as the skills.
+const mostTiles = 8;
+// The rolls the page shows at first: those of the last half hour (D-302).
+const halfHour = 30 * 60 * 1000;
+// A number with its progress stays among the numbers, in the system's order.
+const widgetOrder = ["number", "bar", "track", "pips", "list", "text"];
+export function widgetOf(value) {
+    if (value.progress !== undefined) {
+        return "progress";
+    }
+    const counter = value.counter;
+    if (counter?.max !== undefined) {
+        return (counter.min ?? 0) < 0 ? "track" : counter.max <= 10 ? "pips" : "bar";
+    }
+    if (value.items !== undefined || value.always !== undefined) {
+        return "list";
+    }
+    return value.text.length > shortText ? "text" : "number";
+}
+export function groupLayout(group) {
+    if (group.items !== undefined) {
+        return "table";
+    }
+    return group.values.length <= mostTiles && group.values.every((value) => widgetOf(value) === "number") ? "tiles" : "rows";
+}
+/**
+ * The groups of a sheet as the page lays them out (D-295): in the rail, those the system puts there, in its order, or else those of a few short numbers; the
+ * others in the system's order of cards, those it does not name after them as the sheet has them.
+ */
+export function arrangedGroups(groups, cards) {
+    const at = (names, group) => names.findIndex((name) => name.toLowerCase() === group.name.toLowerCase());
+    const placed = cards !== undefined && cards.rail.length > 0;
+    const inRail = (group) => (placed ? at(cards.rail, group) >= 0 : groupLayout(group) === "tiles");
+    const rank = (group) => {
+        const place = cards === undefined ? -1 : at(cards.order, group);
+        return place < 0 ? Number.MAX_SAFE_INTEGER : place;
+    };
+    const rail = groups.filter(inRail).sort((first, second) => (placed ? at(cards.rail, first) - at(cards.rail, second) : 0));
+    const others = groups.filter((group) => !inRail(group)).map((group, index) => ({ group, index }));
+    return { rail, others: others.sort((first, second) => rank(first.group) - rank(second.group) || first.index - second.index).map(({ group }) => group) };
+}
+/** The column of each card, by its height, in its order into the shortest column, the first of the shortest when two are even (D-383). */
+export function columnsByHeight(heights, count) {
+    const filled = Array.from({ length: Math.max(1, count) }, () => 0);
+    return heights.map((height) => {
+        const shortest = filled.indexOf(Math.min(...filled));
+        filled[shortest] += height;
+        return shortest;
+    });
+}
+/**
+ * The rolls the page shows (D-302): of those read, the ones of the last half hour since the player last cleared the list, and as many older ones as they asked
+ * for; how many older ones the page has read, and whether there are more, read or still in the log, unless the list was cleared before them.
+ */
+export function rollWindow(rolls, given) {
+    const since = given.now - halfHour;
+    const kept = rolls.filter((roll) => rollTime(roll) >= given.cleared);
+    const before = kept.filter((roll) => rollTime(roll) < since);
+    const recent = kept.filter((roll) => rollTime(roll) >= since);
+    const older = given.older === 0 ? [] : before.slice(-given.older);
+    const unread = given.unread && (rolls.length === 0 || rollTime(rolls[0]) >= given.cleared);
+    return { shown: [...older, ...recent], before: before.length, more: before.length > older.length || unread };
+}
+/** A group's values in the order the page shows them: numbers, then counters, then lists, then text, each in the system's order. */
+export function orderedValues(values) {
+    return [...values].sort((first, second) => widgetRank(first) - widgetRank(second));
+}
+/** The counter the party's strip shows for someone: the first of their line with a maximum, such as hit points or health. */
+export function stripCounter(member) {
+    return member.counters.find((value) => value.counter?.max !== undefined);
+}
+/** Where a number is between its two marks, from 0 to 1: full when the marks are one. */
+export function progressShare(progress) {
+    return progress.to > progress.from ? Math.min(1, Math.max(0, (progress.value - progress.from) / (progress.to - progress.from))) : 1;
+}
+/** Where a value sits on a track from its minimum to its maximum, and where zero is, from 0 to 1. */
+export function trackPlaces(counter) {
+    const min = counter.min ?? 0;
+    const span = Math.max(1, (counter.max ?? counter.value) - min);
+    const place = (number) => Math.min(1, Math.max(0, (number - min) / span));
+    return { zero: place(0), value: place(counter.value) };
+}
+function widgetRank(value) {
+    const widget = widgetOf(value);
+    return widgetOrder.indexOf(widget === "progress" ? "number" : widget);
+}
+/** When a roll was made, in milliseconds; 0 for a time that cannot be read. */
+function rollTime(roll) {
+    const time = Date.parse(roll.at);
+    return Number.isNaN(time) ? 0 : time;
+}

package/dist/dashboard/map-sheet.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
+// Where the player's character goes when the master asks (D-332, ASK-11): the map of the place over the whole page, its squares at least 44 px, those the
+// character can still reach in gold; a square touched is chosen, then sent. A square can also be written, such as E4, from the keyboard.
+import { useEffect, useRef, useState } from "preact/hooks";
+import { Icon } from "./icons.js";
+import { PlaceMap } from "./place-map-view.js";
+import { isStandable, squareOf } from "./place-map.js";
+import { t } from "./text.js";
+export function MapSheet({ map, place, question, onPick, onClose }) {
+    const [selected, setSelected] = useState();
+    const [typed, setTyped] = useState("");
+    const dialog = useRef(null);
+    const written = typed.trim().toUpperCase();
+    const chosen = written !== "" ? written : selected;
+    const square = chosen === undefined ? undefined : squareOf(chosen);
+    const standable = square !== undefined && isStandable(map, square);
+    // A modal dialog lies over everything on the page, the bars and the dice too, and closes with Escape by itself.
+    useEffect(() => {
+        dialog.current?.showModal();
+    }, []);
+    const pick = (name) => {
+        setSelected(name);
+        setTyped("");
+    };
+    const send = (event) => {
+        event.preventDefault();
+        if (chosen !== undefined && standable) {
+            onPick(chosen);
+        }
+    };
+    return (_jsxs("dialog", { ref: dialog, class: "map-sheet", "aria-labelledby": "map-sheet-title", onClose: onClose, children: [_jsxs("header", { class: "map-sheet-head", children: [_jsx("h2", { id: "map-sheet-title", children: question }), _jsx("button", { type: "button", class: "icon-button tip-left", "aria-label": t("Close"), "data-tip": t("Close"), onClick: () => dialog.current?.close(), children: _jsx(Icon, { name: "close" }) })] }), _jsx("div", { class: "map-sheet-body", children: _jsx(PlaceMap, { map: map, place: place, picking: { selected: written === "" ? selected : undefined, onSelect: pick } }) }), _jsxs("form", { class: "map-sheet-bar", onSubmit: send, children: [_jsx("input", { type: "text", value: typed, maxLength: 5, placeholder: selected ?? "E4", "aria-label": t("The square, such as E4"), onInput: (event) => setTyped(event.currentTarget.value) }), _jsx("button", { type: "submit", class: "map-sheet-go", disabled: !standable, children: chosen === undefined ? t("Touch a square") : standable ? t("Move to {square}", { square: chosen }) : t("{square}: no one stands there", { square: chosen }) })] })] }));
+}

package/dist/dashboard/map-symbols.js

@@ -0,0 +1,79 @@
+// What the world map draws (D-318, POS-7): a symbol for each kind of place, in four sizes, and for each biome of a region a colour, from the style sheet, and a
+// mark; the same names as the engine's map/looks.ts, which a test checks. A kind or a biome the page does not know is drawn neutral. Drawn for
+// rpg-engine: lines on a grid of 24, a biome's marks around 0.
+import { t } from "./text.js";
+export const placeKinds = {
+    city: { label: "City", size: 3, glyph: "M2 21V11h3V8.5h3V11h3V6.5h2V11h3V8.5h3V11h3v10Z M10 21v-3.5a2 2 0 0 1 4 0V21 M5 15h1 M18 15h1" },
+    town: { label: "Town", size: 2, glyph: "M3 20V12l5-4 5 4v8 M13 20V9l4-4 4 4v11 M2 20h20 M6.5 20v-3h3v3 M16 13h2" },
+    village: { label: "Village", size: 1, glyph: "M3 20v-6l3.5-3 3.5 3v6 M10 20V10l3-3.5 3 3.5v10 M13 2.5v3 M11.8 3.6h2.4 M16 20v-5l2.5-2 2.5 2v5 M2 20h20" },
+    castle: { label: "Castle", size: 2, glyph: "M5 21V9h2V7h2.5v2h5V7H17v2h2v12Z M10 21v-4a2 2 0 0 1 4 0v4 M12 3v4 M12 3l4 1.4L12 6" },
+    tower: { label: "Tower", size: 1, glyph: "M8 21V9h8v12 M7 9V5h2v1.5h2V5h2v1.5h2V5h2v4 M11 21v-4h2v4 M5 21h14" },
+    ruin: { label: "Ruin", size: 1, glyph: "M7 21V9h3l1 2 1.5-3.5L14 9h3v12 M10.5 21v-3.5h3V21 M4 21h16 M18.5 18.5h2.5v2.5" },
+    temple: { label: "Temple", size: 1, glyph: "M3 9 12 4l9 5Z M6 9v9 M10 9v9 M14 9v9 M18 9v9 M3 20h18" },
+    shrine: { label: "Shrine", size: 0, glyph: "M12 3v18 M6.5 8.5h11 M8 21h8" },
+    inn: { label: "Inn", size: 1, glyph: "M5 8h10v12H5Z M15 10.5h2.5a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2H15 M5 8c0-2 1.5-3.3 3-2.7C8.8 3.6 11 3.4 12 5c1.6-.6 3.3.8 3 3 M8.5 11v6 M11.5 11v6" },
+    farm: { label: "Farm", size: 0, glyph: "M3 20V10l5-4.5h8l5 4.5v10Z M9 20v-6h6v6 M9 14l6 6 M15 14l-6 6 M10 9.5h4" },
+    mill: { label: "Mill", size: 1, glyph: "M9.5 21l1.2-9h2.6l1.2 9 M12 10 6 4 M12 10l6-6 M12 10l-6 6 M12 10l6 6 M7 21h10" },
+    port: { label: "Port", size: 1, glyph: "M12 6v15 M8 9h8 M5 15c0 4 3 6 7 6s7-2 7-6 M12 3a1.6 1.6 0 1 0 0 3.2a1.6 1.6 0 1 0 0-3.2Z" },
+    bridge: { label: "Bridge", size: 0, glyph: "M2 10h20 M4 10v9 M20 10v9 M4 19c2-6 14-6 16 0 M2 7h20" },
+    ford: { label: "Ford", size: 0, glyph: "M3 10c3 2 6-2 9 0s6-2 9 0 M3 16c3 2 6-2 9 0s6-2 9 0" },
+    crossroads: { label: "Crossroads", size: 0, glyph: "M12 3v18 M12 5h7l2 2.5-2 2.5h-7 M12 12H5l-2 2.5 2 2.5h7" },
+    cave: { label: "Cave", size: 1, glyph: "M2 20c1-8 4.5-13 10-13s9 5 10 13Z M8.5 20c0-4 1.6-6.5 3.5-6.5s3.5 2.5 3.5 6.5" },
+    mine: { label: "Mine", size: 1, glyph: "M5 20 15 10 M10 5c4-1.5 8 .5 10 5 M19 20 9 10 M14 5c-4-1.5-8 .5-10 5" },
+    peak: { label: "Peak", size: 1, glyph: "M2 20 9.5 6l3.5 5 2.5-3.5L22 20Z M7.2 10.3 9 12l1.8-1.6 1.2 1.5" },
+    camp: { label: "Camp", size: 0, glyph: "M3 20 12 5l9 15Z M9 20l3-6 3 6" },
+};
+/** A biome: its name in the key, and the mark scattered over its land, so that colour is never the only sign. */
+export const biomes = {
+    forest: { label: "Forest", mark: "M0-6 4.5 1.5h-9Z M0 1.5V4.5" },
+    swamp: { label: "Swamp", mark: "M-6 3.5h12 M-2.5 3.5V-3 M.5 3.5V-5 M3.5 3.5V-2" },
+    moor: { label: "Moor", mark: "M-4 2.5Q-3-1-1.5-3 M0 2.5V-4 M4 2.5Q3-1 1.5-3 M-6 2.5H6" },
+    hills: { label: "Hills", mark: "M-8 3Q-3-5 2 3 M-1-1Q3-6 8 3" },
+    mountains: { label: "Mountains", mark: "M-8 4-1.5-6 2-1 4-4 9 4 M-3.4-3.2-1.5-1.6.3-3" },
+    plains: { label: "Plains", mark: "M-6 2h4 M2 2h4 M-2-2h4" },
+    desert: { label: "Desert", mark: "M-6 1q3-3 6 0t6 0" },
+    snow: { label: "Snow", mark: "M0-4.5V4.5 M-3.9-2.2 3.9 2.2 M-3.9 2.2 3.9-2.2" },
+    water: { label: "Water", mark: "M-7 0q1.75-2.5 3.5 0t3.5 0 3.5 0 3.5 0" },
+};
+/** The radius of a symbol's disc, by its size, in pixels. */
+export const symbolRadius = [9, 11.5, 13.5, 15.5];
+/** A kind of place by its name in the page's language; undefined for one the page does not know. */
+export function placeKindLabel(kind) {
+    const labels = {
+        city: t("City"),
+        town: t("Town"),
+        village: t("Village"),
+        castle: t("Castle"),
+        tower: t("Tower"),
+        ruin: t("Ruin"),
+        temple: t("Temple"),
+        shrine: t("Shrine"),
+        inn: t("Inn"),
+        farm: t("Farm"),
+        mill: t("Mill"),
+        port: t("Port"),
+        bridge: t("Bridge"),
+        ford: t("Ford"),
+        crossroads: t("Crossroads"),
+        cave: t("Cave"),
+        mine: t("Mine"),
+        peak: t("Peak"),
+        camp: t("Camp"),
+    };
+    return kind === undefined ? undefined : labels[kind];
+}
+/** A biome by its name in the page's language; undefined for one the page does not know. */
+export function biomeLabel(biome) {
+    const labels = {
+        forest: t("Forest"),
+        swamp: t("Swamp"),
+        moor: t("Moor"),
+        hills: t("Hills"),
+        mountains: t("Mountains"),
+        plains: t("Plains"),
+        desert: t("Desert"),
+        snow: t("Snow"),
+        water: t("Water"),
+    };
+    return biome === undefined ? undefined : labels[biome];
+}

package/dist/dashboard/markdown.js

@@ -0,0 +1,72 @@
+import { jsx as _jsx } from "preact/jsx-runtime";
+// A page's text as the player may read it, from its markdown (D-275): headings, paragraphs, lists, quotes, bold and italics, links as their names. Never HTML:
+// every piece is text, so nothing in a page can run in the dashboard.
+import { Fragment } from "preact";
+import { t } from "./text.js";
+export function Markdown({ text }) {
+    return _jsx("div", { class: "markdown", children: blocks(text).map((block, index) => _jsx(Fragment, { children: block }, index)) });
+}
+/** The first line of a page's text that is not a heading, as plain words: what a closed card shows of it. */
+export function plainLine(text) {
+    const line = text.split("\n").find((candidate) => candidate.trim() !== "" && !/^\s*#/.test(candidate));
+    return line === undefined ? undefined : linkNames(line).replace(/^\s*(?:>\s?|[-*]\s+)/, "").replace(/\[!secret\]/i, t("Secret:")).replace(/[*_]/g, "").trim();
+}
+function blocks(text) {
+    const shown = [];
+    let paragraph = [];
+    let list = [];
+    const close = () => {
+        if (paragraph.length > 0) {
+            shown.push(_jsx("p", { dir: "auto", children: inline(paragraph.join(" ")) }));
+        }
+        if (list.length > 0) {
+            shown.push(_jsx("ul", { children: list.map((item, index) => _jsx("li", { dir: "auto", children: inline(item) }, index)) }));
+        }
+        paragraph = [];
+        list = [];
+    };
+    for (const line of text.split("\n")) {
+        const heading = /^(#{1,6})\s+(.*)$/.exec(line);
+        const item = /^\s*[-*]\s+(.*)$/.exec(line);
+        if (line.trim() === "") {
+            close();
+        }
+        else if (heading !== null) {
+            close();
+            // A page's own headings sit below the sheet's: the first level is a box's, and its sections come after.
+            shown.push(heading[1].length <= 2 ? _jsx("h4", { dir: "auto", children: inline(heading[2]) }) : _jsx("h5", { dir: "auto", children: inline(heading[2]) }));
+        }
+        else if (item !== null) {
+            if (paragraph.length > 0) {
+                close();
+            }
+            list.push(item[1]);
+        }
+        else {
+            if (list.length > 0) {
+                close();
+            }
+            // A quote, as a secret discovered: its text, its marker as a word.
+            paragraph.push(line.replace(/^\s*>\s?/, "").replace(/\[!secret\]/i, t("Secret:")));
+        }
+    }
+    close();
+    return shown;
+}
+/** Bold and italics, and links as the names of their pages. */
+function inline(text) {
+    const named = linkNames(text);
+    return named.split(/(\*\*\*[^*]+\*\*\*|\*\*[^*]+\*\*|\*[^*]+\*|_[^_]+_)/).filter((piece) => piece !== "").map((piece, index) => {
+        if (/^\*\*\*.+\*\*\*$/.test(piece)) {
+            return (_jsx("strong", { children: _jsx("em", { children: piece.slice(3, -3) }) }, index));
+        }
+        if (/^\*\*.+\*\*$/.test(piece)) {
+            return _jsx("strong", { children: piece.slice(2, -2) }, index);
+        }
+        return /^([*_]).+\1$/.test(piece) ? _jsx("em", { children: piece.slice(1, -1) }, index) : piece;
+    });
+}
+/** Links as the names of their pages: [[Page|name]] reads name, [[Page]] reads Page. */
+function linkNames(text) {
+    return text.replace(/\[\[(?:[^\]|]*\|)?([^\]|]+)\]\]/g, "$1");
+}

package/dist/dashboard/master.js

@@ -0,0 +1,69 @@
+import { jsx as _jsx } from "preact/jsx-runtime";
+// The master's avatar, the robot (D-274): its picture inline, so that the page can move it. It shows the master's mood (D-305), a moment's face for a little while
+// when one comes, its eyes closed while the master is away; unless the player asked for less motion, it blinks now and then and breathes.
+import { useEffect, useRef, useState } from "preact/hooks";
+import { moodLabel } from "./mood.js";
+import { t } from "./text.js";
+// A blink lasts this long, every few seconds.
+const blinkLength = 140;
+const blinkEvery = { least: 3500, most: 7000 };
+// A moment's face shows this long; one that came longer ago than its freshness was missed, and is not shown late.
+const momentLength = 2200;
+const momentFreshness = 10_000;
+/** The robot: the master's mood; a moment, shown once when its id is new; asleep, with its eyes closed, while the game is away. */
+export function Master({ mood = "neutral", moment, poke, asleep = false }) {
+    const holder = useRef(null);
+    const [markup, setMarkup] = useState();
+    const flash = useMoment(moment, asleep);
+    // A face for a click on the robot, which wakes it for a moment too.
+    const poked = useMoment(poke, false);
+    const shown = poked ?? (asleep ? "neutral" : flash ?? mood);
+    useEffect(() => {
+        fetch("/assets/master.svg").then((response) => (response.ok ? response.text() : undefined)).then(setMarkup, () => undefined);
+    }, []);
+    // One mood shows, the one asked for, or the neutral one when the picture has no such mood.
+    useEffect(() => {
+        const moods = holder.current?.querySelectorAll(".robot-mood") ?? [];
+        const wanted = holder.current?.querySelector(`.robot-mood-${CSS.escape(shown)}`) ?? holder.current?.querySelector(".robot-mood-neutral");
+        moods.forEach((group) => group.classList.toggle("shown", group === wanted));
+        holder.current?.setAttribute("data-mood", wanted === undefined || wanted === null ? "neutral" : shown);
+    }, [markup, shown]);
+    // Asleep, the eyes stay shut; awake, they blink now and then.
+    useEffect(() => {
+        let timer;
+        if (asleep) {
+            holder.current?.classList.add("blink");
+            return () => holder.current?.classList.remove("blink");
+        }
+        // Blinking is the one motion that never stops: none when the player asked for less.
+        if (window.matchMedia("(prefers-reduced-motion: reduce)").matches) {
+            return;
+        }
+        const blink = () => {
+            holder.current?.classList.add("blink");
+            window.setTimeout(() => holder.current?.classList.remove("blink"), blinkLength);
+            timer = window.setTimeout(blink, blinkEvery.least + Math.random() * (blinkEvery.most - blinkEvery.least));
+        };
+        timer = window.setTimeout(blink, blinkEvery.least);
+        return () => window.clearTimeout(timer);
+    }, [asleep, markup]);
+    const classes = ["master", asleep ? "asleep" : "", flash === undefined ? "" : "moment"].filter((name) => name !== "").join(" ");
+    const label = asleep ? t("The game master, away") : mood === "neutral" ? t("The game master") : t("The game master, {mood}", { mood: moodLabel(mood) });
+    return markup === undefined
+        ? _jsx("span", { class: "master", "aria-hidden": "true" })
+        : _jsx("span", { ref: holder, class: classes, role: "img", "aria-label": label, dangerouslySetInnerHTML: { __html: markup } });
+}
+/** The face of a moment while it shows: a new one, by its id, that is not stale, and never while asleep. */
+function useMoment(moment, asleep) {
+    const [flash, setFlash] = useState();
+    useEffect(() => {
+        const stale = moment?.at !== undefined && Date.now() - Date.parse(moment.at) > momentFreshness;
+        if (moment === undefined || stale || asleep) {
+            return;
+        }
+        setFlash(moment.mood);
+        const timer = window.setTimeout(() => setFlash(undefined), momentLength);
+        return () => window.clearTimeout(timer);
+    }, [moment?.id]);
+    return flash;
+}

package/dist/dashboard/mood-faces.js

@@ -0,0 +1,16 @@
+const eyes = "M9 10.5h.01 M15 10.5h.01";
+export const moodFaces = {
+    neutral: { lines: "M10 15.5h4", dots: eyes },
+    happy: { lines: "M8.8 14.6q3.2 3.2 6.4 0", dots: eyes },
+    delighted: { lines: "M7.6 11.2q1.4-2.4 2.8 0 M13.6 11.2q1.4-2.4 2.8 0 M9 14.2h6q0 3.6-3 3.6t-3-3.6Z" },
+    curious: { lines: "M10.6 15.5h2.8 M13.8 7.2l2.2-.8", dots: eyes },
+    focused: { lines: "M7.6 10.5h2.8 M13.6 10.5h2.8 M10 15.5h4" },
+    determined: { lines: "M7.6 7.4l2.8.9 M16.4 7.4l-2.8.9 M9.6 16.2q2.8-.2 5-1.4", dots: eyes },
+    worried: { lines: "M7.6 7.6l2.8-1 M16.4 7.6l-2.8-1 M10.6 15.6h2.8", dots: eyes },
+    surprised: { lines: "M12 13.8a1.6 1.9 0 1 0 0 3.8a1.6 1.9 0 1 0 0-3.8Z", dots: eyes },
+    afraid: { lines: "M7.6 8.2l2.8-1.6 M16.4 8.2l-2.8-1.6 M8.6 16.4l1.7-1 1.7 1 1.7-1 1.7 1", dots: eyes },
+    sad: { lines: "M7.6 11.2q1.4-2.4 2.8 0 M13.6 11.2q1.4-2.4 2.8 0 M9.4 16.6q2.6-2.6 5.2 0" },
+    angry: { lines: "M7.6 7.2l2.8 1.6 M16.4 7.2l-2.8 1.6 M9 16.8q3-2.8 6 0", dots: eyes },
+    disgusted: { lines: "M7.6 10h2.8a1.4 1.4 0 0 1-2.8 0Z M13.6 10h2.8a1.4 1.4 0 0 1-2.8 0Z M7.8 7.6h2.6 M13.8 7.4l2.2-.8 M8.8 16.4q1.6-1.8 3.2-.6t3.2-1.2" },
+    mischievous: { lines: "M13.6 10.5h2.8 M8.8 14.6q3.2 3.4 6.6-.6", dots: "M9 10.5h.01" },
+};

package/dist/dashboard/mood.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
+import { moodFaces } from "./mood-faces.js";
+import { t } from "./text.js";
+/** A mood's face, in lines on a grid of 24, cropped to the face. */
+export function MoodFace({ mood }) {
+    const face = moodFaces[mood];
+    return (_jsxs("svg", { class: "mood-face", viewBox: "3.5 3 17 17", "aria-hidden": "true", children: [_jsx("path", { d: face.lines }), face.dots !== undefined && _jsx("path", { class: "mood-eyes", d: face.dots })] }));
+}
+/** A mood's name in the page's language, as a noun where the language marks gender on its adjectives. */
+export function moodLabel(mood) {
+    const labels = {
+        neutral: t("neutral"),
+        happy: t("happy"),
+        delighted: t("delighted"),
+        curious: t("curious"),
+        focused: t("focused"),
+        determined: t("determined"),
+        worried: t("worried"),
+        surprised: t("surprised"),
+        afraid: t("afraid"),
+        sad: t("sad"),
+        angry: t("angry"),
+        disgusted: t("disgusted"),
+        mischievous: t("mischievous"),
+    };
+    return labels[mood];
+}