contour-deck 0.0.0-stage → 0.2.0

package/dist/remote/presenter.d.ts

@@ -0,0 +1,2 @@
+import type { RemoteViewOptions, RemoteView } from "./phone.js";
+export declare function presenterView(root: HTMLElement, options?: RemoteViewOptions): RemoteView;

package/dist/remote/presenter.js

@@ -0,0 +1,126 @@
+/**
+ * The presenter window, `?view=presenter&room=…`: a second window of the same browser that follows the deck
+ * over BroadcastChannel and shows the current page, what comes next, the notes, and the clocks.
+ */
+import { h } from "../core/dom.js";
+import { defaultLabels } from "../core/labels.js";
+import { notesHtml } from "../core/notes.js";
+import { createGuest } from "./guest.js";
+import { defaultRemoteLabels } from "./labels.js";
+import { injectStyle } from "./style.js";
+import { broadcast } from "./transport.js";
+import { createPreview, createTimers, keepAwake, pageAt, positionLabel, readOutline, statePos, upNext } from "./view.js";
+/** The keys of the deck, as commands. */
+const KEYS = {
+    " ": "next",
+    Enter: "next",
+    PageDown: "next",
+    PageUp: "prev",
+    Backspace: "prev",
+    ArrowRight: "slideNext",
+    ArrowLeft: "slidePrev",
+    ArrowDown: "pageNext",
+    ArrowUp: "pagePrev",
+    Escape: "overview",
+    o: "overview",
+};
+export function presenterView(root, options = {}) {
+    injectStyle(options.nonce);
+    const labels = { ...defaultRemoteLabels, ...options.labels };
+    const outline = readOutline(root, options.skip);
+    const room = options.room ?? new URLSearchParams(location.search).get("room") ?? "";
+    const abort = new AbortController();
+    const { signal } = abort;
+    const app = h("div", "ct-app ct-pr", "", { "data-ct-mode": "stage", "data-ct-wait": "" });
+    const top = app.appendChild(h("header", "ct-pr-top"));
+    const position = h("span", "ct-rmt-pos", labels.noDeck);
+    const timers = createTimers(labels, outline);
+    const button = (command, text) => h("button", "ct-btn", text, { "data-ct-do": command });
+    top.append(button("prev", defaultLabels.prev), button("next", defaultLabels.next), button("overview", defaultLabels.overview), position, timers.block, timers.time);
+    function cell(title, next = false) {
+        const el = app.appendChild(h("section", "ct-pr-cell"));
+        if (next)
+            el.setAttribute("data-next", "");
+        const head = el.appendChild(h("h2", "", title));
+        const caption = head.appendChild(h("span"));
+        const preview = createPreview(root);
+        el.appendChild(h("div", "ct-pr-box")).append(preview.el);
+        return { preview, caption };
+    }
+    const now = cell(labels.now);
+    const coming = cell(labels.upNext, true);
+    const notes = app.appendChild(h("div", "ct-pr-notes"));
+    root.after(app);
+    document.documentElement.setAttribute("data-ct-open", "");
+    keepAwake(signal);
+    const guest = createGuest({ room, open: () => broadcast(room), trusted: true });
+    let drawnPage = "";
+    function draw() {
+        const { state } = guest;
+        app.toggleAttribute("data-ct-wait", !state);
+        if (!state)
+            return;
+        timers.draw(state, guest.stateAt);
+        app.style.setProperty("--ct-ratio", String(state.ratio ?? 16 / 9));
+        const pos = statePos(outline, state);
+        if (!pos)
+            return;
+        const overview = state.mode === "overview";
+        position.textContent = (overview ? `${labels.inOverview} · ` : "") + positionLabel(outline, pos, state);
+        const page = pageAt(outline, pos);
+        now.preview.show(page, state.step);
+        now.caption.textContent = outline.blocks[pos.b].slides[pos.s].title;
+        const up = upNext(outline, pos, state.step);
+        const kinds = { step: labels.nextStep, page: labels.nextPage, slide: labels.nextSlide, end: labels.theEnd };
+        coming.preview.show(up.kind === "end" ? null : pageAt(outline, up.pos), up.step);
+        coming.caption.textContent = up.kind === "end" ? kinds.end : `${kinds[up.kind]}｜${up.text}`;
+        if (state.at === drawnPage)
+            return;
+        drawnPage = state.at;
+        notes.scrollTop = 0;
+        notes.innerHTML = notesHtml(page);
+        if (!notes.childNodes.length)
+            notes.append(h("p", "", defaultLabels.noNotes));
+    }
+    app.addEventListener("click", event => {
+        const command = event.target.closest("[data-ct-do]")?.dataset.ctDo;
+        if (command)
+            guest.command(command);
+    }, { signal });
+    document.addEventListener("keydown", event => {
+        if (event.metaKey || event.ctrlKey || event.altKey)
+            return;
+        const key = event.key.length === 1 ? event.key.toLowerCase() : event.key;
+        const onButton = !!event.target.closest?.("button,a");
+        if (onButton && (key === " " || key === "Enter"))
+            return;
+        const command = key === " " && event.shiftKey ? "prev" : KEYS[key];
+        if (!command)
+            return;
+        event.preventDefault();
+        guest.command(command);
+    }, { signal });
+    // The mouse over the current page is the laser pointer on the deck.
+    const sheet = now.preview.el;
+    const aim = (event, on) => {
+        const box = sheet.getBoundingClientRect();
+        guest.point((event.clientX - box.left) / box.width, (event.clientY - box.top) / box.height, on);
+    };
+    sheet.addEventListener("pointermove", event => aim(event, true), { signal });
+    sheet.addEventListener("pointerleave", event => aim(event, false), { signal });
+    const stop = guest.subscribe(draw);
+    const ticking = window.setInterval(() => timers.draw(guest.state, guest.stateAt), 500);
+    draw();
+    return {
+        destroy() {
+            abort.abort();
+            stop();
+            clearInterval(ticking);
+            guest.close();
+            now.preview.destroy();
+            coming.preview.destroy();
+            app.remove();
+            document.documentElement.removeAttribute("data-ct-open");
+        },
+    };
+}

package/dist/remote/protocol.d.ts

@@ -0,0 +1,106 @@
+/** The wire messages of docs/PROTOCOL.md, and the checks every incoming frame passes before it is used. */
+/** Frames above this size are dropped by the relay (it closes the socket with 1009). */
+export declare const MAX_FRAME = 2048;
+/** An `ink` message carries at most this many points. */
+export declare const MAX_POINTS = 64;
+export type Command = "next" | "prev" | "slideNext" | "slidePrev" | "pageNext" | "pagePrev" | "overview" | "open";
+/** Where the deck is and how the time stands; sent to the granted guest and to the presenter window. */
+export interface StateMessage {
+    t: "state";
+    mode: "overview" | "stage";
+    /** `b.s.p`, 1-based. */
+    at: string;
+    step: number;
+    steps: number;
+    /** Seconds since the talk started; 0 while the clock has not started. */
+    elapsed: number;
+    /** Planned seconds of the whole talk, or `null` when no block has minutes. */
+    total: number | null;
+    blockElapsed: number;
+    blockMinutes: number | null;
+    /** Width over height of the stage, so a phone draws on a pad of the same shape. Not in protocol v1; optional. */
+    ratio?: number;
+}
+/** What the relay itself sends. */
+export type RelayMessage = {
+    t: "hello";
+    id: string;
+    role: "host" | "guest";
+} | {
+    t: "join";
+    id: string;
+} | {
+    t: "leave";
+    id: string;
+};
+/** Host to guest. `to` addresses one guest; the relay strips nothing, the guest ignores it. */
+export type HostMessage = {
+    t: "pair";
+    to: string;
+    code: string;
+} | {
+    t: "grant";
+    to: string;
+    token: string;
+} | {
+    t: "deny";
+    to: string;
+} | {
+    t: "revoke";
+    to: string;
+} | {
+    t: "pong";
+    to?: string;
+} | (StateMessage & {
+    to?: string;
+});
+/** Guest to host. The relay sets `from`; over BroadcastChannel there is none. */
+export type GuestMessage = {
+    t: "resume";
+    token: string;
+} | {
+    t: "cmd";
+    c: Command;
+    at?: string;
+} | {
+    t: "ptr";
+    x: number;
+    y: number;
+    on: boolean;
+} | {
+    t: "ink";
+    s: number;
+    pts: number[];
+    end?: boolean;
+} | {
+    t: "ink-clear";
+} | {
+    t: "ping";
+};
+export type Message = RelayMessage | HostMessage | GuestMessage;
+type Fields = Record<string, unknown>;
+/** A frame as an object with a string `t`, or `null`. */
+export declare function decode(frame: unknown): (Fields & {
+    t: string;
+}) | null;
+/**
+ * A message a guest may send, with every field checked and every coordinate clamped to [0, 1];
+ * `null` for anything else. This is the only door for input from outside the host's own page.
+ */
+export declare function guestMessage(value: Fields): GuestMessage | null;
+/** A `state` message as the guest reads it; a field of the wrong type takes its neutral value. */
+export declare function stateMessage(value: Fields): StateMessage | null;
+/**
+ * A host key: 26 characters of Crockford base32 from `crypto.getRandomValues` (the first carries 3 bits, 128 in all).
+ * It stays in the host's tab; the relay gives the host seat of a room only to the key whose hash is the room.
+ */
+export declare const newKey: () => string;
+/** A room name, and the shape of a host key too. */
+export declare const isRoom: (value: unknown) => value is string;
+/** The room of a host key: the first 26 Crockford base32 characters of SHA-256 of the key (docs/PROTOCOL.md). */
+export declare function roomOf(key: string): Promise<string>;
+/** A resume token: 22 characters of base64url, 132 random bits. */
+export declare const newToken: () => string;
+/** A fresh 4-digit pairing code, without modulo bias. */
+export declare function newCode(): string;
+export {};

package/dist/remote/protocol.js

@@ -0,0 +1,123 @@
+/** The wire messages of docs/PROTOCOL.md, and the checks every incoming frame passes before it is used. */
+/** Frames above this size are dropped by the relay (it closes the socket with 1009). */
+export const MAX_FRAME = 2048;
+/** An `ink` message carries at most this many points. */
+export const MAX_POINTS = 64;
+const COMMANDS = ["next", "prev", "slideNext", "slidePrev", "pageNext", "pagePrev", "overview", "open"];
+const isFields = (value) => typeof value === "object" && value !== null && !Array.isArray(value);
+const text = (value, max) => typeof value === "string" && value.length > 0 && value.length <= max;
+const finite = (value) => typeof value === "number" && Number.isFinite(value);
+const unit = (value) => Math.min(1, Math.max(0, value));
+/** A frame as an object with a string `t`, or `null`. */
+export function decode(frame) {
+    if (typeof frame !== "string" || frame.length > MAX_FRAME)
+        return null;
+    try {
+        const value = JSON.parse(frame);
+        return isFields(value) && typeof value.t === "string" ? value : null;
+    }
+    catch {
+        return null;
+    }
+}
+/**
+ * A message a guest may send, with every field checked and every coordinate clamped to [0, 1];
+ * `null` for anything else. This is the only door for input from outside the host's own page.
+ */
+export function guestMessage(value) {
+    switch (value.t) {
+        case "resume":
+            return text(value.token, 64) ? { t: "resume", token: value.token } : null;
+        case "cmd": {
+            if (typeof value.c !== "string" || !COMMANDS.includes(value.c))
+                return null;
+            const c = value.c;
+            if (c !== "open")
+                return { t: "cmd", c };
+            return text(value.at, 64) ? { t: "cmd", c, at: value.at } : null;
+        }
+        case "ptr":
+            return finite(value.x) && finite(value.y) && typeof value.on === "boolean"
+                ? { t: "ptr", x: unit(value.x), y: unit(value.y), on: value.on }
+                : null;
+        case "ink": {
+            const { s, pts } = value;
+            if (!finite(s) || !Array.isArray(pts) || pts.length < 2 || pts.length > MAX_POINTS * 2 || pts.length % 2)
+                return null;
+            if (!pts.every(finite))
+                return null;
+            return { t: "ink", s, pts: pts.map(unit), ...(value.end === true ? { end: true } : {}) };
+        }
+        case "ink-clear":
+            return { t: "ink-clear" };
+        case "ping":
+            return { t: "ping" };
+        default:
+            return null;
+    }
+}
+const number = (value, fallback = 0) => (finite(value) ? value : fallback);
+/** A `state` message as the guest reads it; a field of the wrong type takes its neutral value. */
+export function stateMessage(value) {
+    if (value.t !== "state" || typeof value.at !== "string")
+        return null;
+    return {
+        t: "state",
+        mode: value.mode === "overview" ? "overview" : "stage",
+        at: value.at.slice(0, 32),
+        step: number(value.step),
+        steps: number(value.steps),
+        elapsed: number(value.elapsed),
+        total: finite(value.total) ? value.total : null,
+        blockElapsed: number(value.blockElapsed),
+        blockMinutes: finite(value.blockMinutes) ? value.blockMinutes : null,
+        ...(finite(value.ratio) && value.ratio > 0 ? { ratio: value.ratio } : {}),
+    };
+}
+const CROCKFORD = "0123456789ABCDEFGHJKMNPQRSTVWXYZ";
+const BASE64URL = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789-_";
+function randomText(alphabet, bits, length) {
+    const bytes = crypto.getRandomValues(new Uint8Array(Math.ceil((length * bits) / 8)));
+    let out = "";
+    let buffer = 0;
+    let held = 0;
+    for (const byte of bytes) {
+        buffer = (buffer << 8) | byte;
+        held += 8;
+        while (held >= bits && out.length < length) {
+            held -= bits;
+            out += alphabet[(buffer >> held) & ((1 << bits) - 1)];
+        }
+        buffer &= (1 << held) - 1;
+    }
+    return out;
+}
+/**
+ * A host key: 26 characters of Crockford base32 from `crypto.getRandomValues` (the first carries 3 bits, 128 in all).
+ * It stays in the host's tab; the relay gives the host seat of a room only to the key whose hash is the room.
+ */
+export const newKey = () => CROCKFORD[crypto.getRandomValues(new Uint8Array(1))[0] & 7] + randomText(CROCKFORD, 5, 25);
+/** A room name, and the shape of a host key too. */
+export const isRoom = (value) => typeof value === "string" && /^[0-9A-HJKMNP-TV-Z]{26}$/.test(value);
+/** The room of a host key: the first 26 Crockford base32 characters of SHA-256 of the key (docs/PROTOCOL.md). */
+export async function roomOf(key) {
+    if (!globalThis.crypto?.subtle)
+        throw new Error("contour-deck: the remote relay needs a secure context (https or localhost)");
+    const hash = new Uint8Array(await crypto.subtle.digest("SHA-256", new TextEncoder().encode(key)));
+    let room = "";
+    for (let bit = 0; room.length < 26; bit += 5) {
+        const at = bit >> 3;
+        room += CROCKFORD[(((hash[at] << 8) | hash[at + 1]) >> (11 - (bit & 7))) & 31];
+    }
+    return room;
+}
+/** A resume token: 22 characters of base64url, 132 random bits. */
+export const newToken = () => randomText(BASE64URL, 6, 22);
+/** A fresh 4-digit pairing code, without modulo bias. */
+export function newCode() {
+    const one = new Uint16Array(1);
+    do
+        crypto.getRandomValues(one);
+    while (one[0] >= 60000);
+    return String(one[0] % 10000).padStart(4, "0");
+}

package/dist/remote/qr.d.ts

@@ -0,0 +1,8 @@
+/**
+ * A small QR encoder for the pairing links: byte mode, error correction M, versions 1 to 12
+ * (up to 287 bytes of UTF-8). A host that already ships a QR library passes its own through the `qr` option.
+ */
+/** The modules of the QR code of `text` (`true` is dark), `[row][column]`, or `null` when it does not fit. */
+export declare function qrMatrix(text: string): boolean[][] | null;
+/** The QR code of `text` as an SVG string, dark on white whatever the theme; `null` when the text is too long. */
+export declare function qrSvg(text: string): string | null;

package/dist/remote/qr.js

@@ -0,0 +1,266 @@
+/**
+ * A small QR encoder for the pairing links: byte mode, error correction M, versions 1 to 12
+ * (up to 287 bytes of UTF-8). A host that already ships a QR library passes its own through the `qr` option.
+ */
+/** Error-correction codewords per block and the number of blocks at level M, for versions 1 to 12. */
+const BLOCKS = [[10, 1], [16, 1], [26, 1], [18, 2], [24, 2], [16, 4], [18, 4], [22, 4], [22, 5], [26, 5], [30, 5], [22, 8]];
+function gfMul(x, y) {
+    let z = 0;
+    for (let i = 7; i >= 0; i--) {
+        z = (z << 1) ^ ((z >>> 7) * 0x11d);
+        z ^= ((y >>> i) & 1) * x;
+    }
+    return z;
+}
+/** Reed-Solomon remainder of `data` for `degree` error-correction codewords. */
+function errorCorrection(data, degree) {
+    const divisor = new Array(degree).fill(0);
+    divisor[degree - 1] = 1;
+    let root = 1;
+    for (let i = 0; i < degree; i++) {
+        for (let j = 0; j < degree; j++) {
+            divisor[j] = gfMul(divisor[j], root);
+            if (j + 1 < degree)
+                divisor[j] ^= divisor[j + 1];
+        }
+        root = gfMul(root, 2);
+    }
+    const result = new Array(degree).fill(0);
+    for (const byte of data) {
+        const factor = byte ^ result.shift();
+        result.push(0);
+        divisor.forEach((coefficient, i) => (result[i] ^= gfMul(coefficient, factor)));
+    }
+    return result;
+}
+/** Codewords a version holds in all, data and error correction. */
+function rawCodewords(version) {
+    let modules = (16 * version + 128) * version + 64;
+    if (version >= 2) {
+        const align = Math.floor(version / 7) + 2;
+        modules -= (25 * align - 10) * align - 55;
+        if (version >= 7)
+            modules -= 36;
+    }
+    return modules >> 3;
+}
+function alignmentCentres(version, size) {
+    if (version === 1)
+        return [];
+    const count = Math.floor(version / 7) + 2;
+    const step = Math.ceil((version * 4 + 4) / (count * 2 - 2)) * 2;
+    const centres = [6];
+    for (let at = size - 7; centres.length < count; at -= step)
+        centres.splice(1, 0, at);
+    return centres;
+}
+const MASKS = [
+    (x, y) => (x + y) % 2 === 0,
+    (_, y) => y % 2 === 0,
+    x => x % 3 === 0,
+    (x, y) => (x + y) % 3 === 0,
+    (x, y) => (Math.floor(x / 3) + Math.floor(y / 2)) % 2 === 0,
+    (x, y) => ((x * y) % 2) + ((x * y) % 3) === 0,
+    (x, y) => (((x * y) % 2) + ((x * y) % 3)) % 2 === 0,
+    (x, y) => (((x + y) % 2) + ((x * y) % 3)) % 2 === 0,
+];
+/** The penalty score of the standard: long runs, 2×2 blocks, finder look-alikes, and dark balance. */
+function penalty(modules) {
+    const size = modules.length;
+    let score = 0;
+    let dark = 0;
+    const lines = [];
+    for (let i = 0; i < size; i++) {
+        let row = "";
+        let column = "";
+        for (let j = 0; j < size; j++) {
+            row += modules[i][j] ? 1 : 0;
+            column += modules[j][i] ? 1 : 0;
+            if (modules[i][j])
+                dark++;
+            if (i && j && modules[i][j] === modules[i - 1][j] && modules[i][j] === modules[i][j - 1] && modules[i][j] === modules[i - 1][j - 1])
+                score += 3;
+        }
+        lines.push(row, column);
+    }
+    for (const line of lines) {
+        for (const run of line.match(/0{5,}|1{5,}/g) ?? [])
+            score += run.length - 2;
+        for (let at = 0; at <= size - 11; at++) {
+            const window = line.substr(at, 11);
+            if (window === "10111010000" || window === "00001011101")
+                score += 40;
+        }
+    }
+    return score + Math.floor(Math.abs((dark * 20) / (size * size) - 10)) * 10;
+}
+/** The modules of the QR code of `text` (`true` is dark), `[row][column]`, or `null` when it does not fit. */
+export function qrMatrix(text) {
+    const bytes = Array.from(new TextEncoder().encode(text));
+    let version = 0;
+    let dataLength = 0;
+    for (let v = 1; v <= BLOCKS.length && !version; v++) {
+        const [ecLength, blocks] = BLOCKS[v - 1];
+        dataLength = rawCodewords(v) - ecLength * blocks;
+        if (4 + (v < 10 ? 8 : 16) + bytes.length * 8 <= dataLength * 8)
+            version = v;
+    }
+    if (!version)
+        return null;
+    const [ecLength, blockCount] = BLOCKS[version - 1];
+    const size = version * 4 + 17;
+    /* ---- data codewords: mode, length, bytes, terminator, padding ---- */
+    const bits = [];
+    const push = (value, length) => {
+        for (let i = length - 1; i >= 0; i--)
+            bits.push((value >>> i) & 1);
+    };
+    push(4, 4);
+    push(bytes.length, version < 10 ? 8 : 16);
+    for (const byte of bytes)
+        push(byte, 8);
+    push(0, Math.min(4, dataLength * 8 - bits.length));
+    push(0, (8 - (bits.length % 8)) % 8);
+    for (let pad = 0xec; bits.length < dataLength * 8; pad ^= 0xec ^ 0x11)
+        push(pad, 8);
+    const data = [];
+    for (let i = 0; i < bits.length; i += 8)
+        data.push(bits.slice(i, i + 8).reduce((byte, bit) => (byte << 1) | bit, 0));
+    /* ---- blocks with error correction, interleaved ---- */
+    const shortBlocks = blockCount - (rawCodewords(version) % blockCount);
+    const shortLength = Math.floor(rawCodewords(version) / blockCount) - ecLength;
+    const blocks = [];
+    for (let i = 0, at = 0; i < blockCount; i++) {
+        const part = data.slice(at, (at += shortLength + (i < shortBlocks ? 0 : 1)));
+        blocks.push({ data: part, ec: errorCorrection(part, ecLength) });
+    }
+    const codewords = [];
+    for (let i = 0; i <= shortLength; i++)
+        for (const block of blocks)
+            if (i < block.data.length)
+                codewords.push(block.data[i]);
+    for (let i = 0; i < ecLength; i++)
+        for (const block of blocks)
+            codewords.push(block.ec[i]);
+    /* ---- function patterns ---- */
+    const modules = Array.from({ length: size }, () => new Array(size).fill(false));
+    const reserved = Array.from({ length: size }, () => new Array(size).fill(false));
+    const set = (x, y, dark) => {
+        if (x < 0 || y < 0 || x >= size || y >= size)
+            return;
+        modules[y][x] = dark;
+        reserved[y][x] = true;
+    };
+    for (let i = 0; i < size; i++) {
+        set(6, i, i % 2 === 0);
+        set(i, 6, i % 2 === 0);
+    }
+    for (const [cx, cy] of [[3, 3], [size - 4, 3], [3, size - 4]]) {
+        for (let dy = -4; dy <= 4; dy++) {
+            for (let dx = -4; dx <= 4; dx++) {
+                const ring = Math.max(Math.abs(dx), Math.abs(dy));
+                set(cx + dx, cy + dy, ring !== 2 && ring !== 4);
+            }
+        }
+    }
+    const centres = alignmentCentres(version, size);
+    centres.forEach((cy, i) => centres.forEach((cx, j) => {
+        // The three corners with a finder pattern have no alignment pattern.
+        if ((i === 0 && j === 0) || (i === 0 && j === centres.length - 1) || (i === centres.length - 1 && j === 0))
+            return;
+        for (let dy = -2; dy <= 2; dy++)
+            for (let dx = -2; dx <= 2; dx++)
+                set(cx + dx, cy + dy, Math.max(Math.abs(dx), Math.abs(dy)) !== 1);
+    }));
+    const format = (mask) => {
+        // Level M is 00, so the five data bits are the mask alone.
+        let remainder = mask;
+        for (let i = 0; i < 10; i++)
+            remainder = (remainder << 1) ^ ((remainder >>> 9) * 0x537);
+        const word = ((mask << 10) | remainder) ^ 0x5412;
+        const bit = (i) => ((word >>> i) & 1) === 1;
+        for (let i = 0; i <= 5; i++)
+            set(8, i, bit(i));
+        set(8, 7, bit(6));
+        set(8, 8, bit(7));
+        set(7, 8, bit(8));
+        for (let i = 9; i < 15; i++)
+            set(14 - i, 8, bit(i));
+        for (let i = 0; i < 8; i++)
+            set(size - 1 - i, 8, bit(i));
+        for (let i = 8; i < 15; i++)
+            set(8, size - 15 + i, bit(i));
+        set(8, size - 8, true);
+    };
+    format(0);
+    if (version >= 7) {
+        let remainder = version;
+        for (let i = 0; i < 12; i++)
+            remainder = (remainder << 1) ^ ((remainder >>> 11) * 0x1f25);
+        const word = (version << 12) | remainder;
+        for (let i = 0; i < 18; i++) {
+            const dark = ((word >>> i) & 1) === 1;
+            const a = size - 11 + (i % 3);
+            const b = Math.floor(i / 3);
+            set(a, b, dark);
+            set(b, a, dark);
+        }
+    }
+    /* ---- data in the zigzag, then the mask with the lowest penalty ---- */
+    let index = 0;
+    for (let right = size - 1; right >= 1; right -= 2) {
+        if (right === 6)
+            right = 5;
+        for (let step = 0; step < size; step++) {
+            for (let j = 0; j < 2; j++) {
+                const x = right - j;
+                const y = ((right + 1) & 2) === 0 ? size - 1 - step : step;
+                if (reserved[y][x] || index >= codewords.length * 8)
+                    continue;
+                modules[y][x] = ((codewords[index >>> 3] >>> (7 - (index & 7))) & 1) === 1;
+                index++;
+            }
+        }
+    }
+    const flip = (mask) => {
+        for (let y = 0; y < size; y++)
+            for (let x = 0; x < size; x++)
+                if (!reserved[y][x] && MASKS[mask](x, y))
+                    modules[y][x] = !modules[y][x];
+    };
+    let best = 0;
+    let lowest = Infinity;
+    for (let mask = 0; mask < 8; mask++) {
+        flip(mask);
+        format(mask);
+        const score = penalty(modules);
+        if (score < lowest)
+            [best, lowest] = [mask, score];
+        flip(mask);
+    }
+    flip(best);
+    format(best);
+    return modules;
+}
+/** Quiet zone around the code, in modules. */
+const QUIET = 4;
+/** The QR code of `text` as an SVG string, dark on white whatever the theme; `null` when the text is too long. */
+export function qrSvg(text) {
+    const modules = qrMatrix(text);
+    if (!modules)
+        return null;
+    const side = modules.length + QUIET * 2;
+    let path = "";
+    modules.forEach((row, y) => {
+        for (let x = 0; x < row.length; x++) {
+            if (!row[x])
+                continue;
+            let run = 1;
+            while (row[x + run])
+                run++;
+            path += `M${x + QUIET} ${y + QUIET}h${run}v1h-${run}z`;
+            x += run;
+        }
+    });
+    return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 ${side} ${side}" shape-rendering="crispEdges"><path fill="#fff" d="M0 0h${side}v${side}H0z"/><path d="${path}"/></svg>`;
+}

package/dist/remote/sensor.d.ts

@@ -0,0 +1,9 @@
+import type { Aim } from "./tilt.js";
+export type SensorResult = "ok" | "denied" | "unsupported";
+export interface Sensor {
+    /** Asks for the sensor. Call it from a tap: iOS shows its permission prompt only then. */
+    start(): Promise<SensorResult>;
+    stop(): void;
+}
+/** Calls `onAim` with the direction the phone points at, and the time in seconds, for every reading. */
+export declare function createSensor(onAim: (aim: Aim, t: number) => void): Sensor;