@rapidmx/meet-plugin 0.15.0 → 0.16.0

package/dist/apps/shared/collab/WhiteboardModel.js

@@ -0,0 +1,197 @@
+///////////////////////////////////////////////////////////////////////////////
+// Copyright (C) 2026 Jean-Philippe Steinmetz. All rights reserved.
+// SPDX-License-Identifier: MPL-2.0
+///////////////////////////////////////////////////////////////////////////////
+/**
+ * The shared whiteboard's state: its elements in drawing order and its epoch, changed only by `apply()`ing
+ * `WhiteboardOp`s - this participant's own as much as everyone else's, so every participant's board is built the same
+ * way from the same ops. See `protocol.ts` for the rules an op is held to (who may add to which element, what the
+ * epoch is for).
+ *
+ * Ops reach a participant in whatever order the network delivers them, and a newcomer's catch-up races the live ops
+ * sent while it travels, so `apply()` is built to give the same board whatever the order:
+ *
+ * - `points` for a stroke that hasn't arrived yet, or that start past the points it has so far, wait (a bounded
+ * number of them) and are applied the moment the gap is filled. Points already held are kept as they are.
+ * - An `add` for an element already on the board adds only what it has beyond it (more points) - a catch-up repeating
+ * what live ops already brought is harmless.
+ * - A removed element stays removed: its id is remembered, so a catch-up sent before the erase cannot bring it back.
+ */
+import { MAX_BOARD_ELEMENTS, MAX_POINTS_PER_OP, MAX_STROKE_POINTS, isOwnId } from "./protocol.js";
+/** The most `points` ops held while their stroke, or the points before them, are still missing. */
+export const MAX_PENDING_POINT_OPS = 400;
+/** The most removed ids remembered. */
+export const MAX_TOMBSTONES = 10000;
+export class WhiteboardModel {
+    constructor() {
+        this.byId = new Map();
+        this.pending = [];
+        this.tombstones = new Set();
+        this.currentEpoch = 0;
+        /** Bumped on every change, so a view can tell whether it needs to draw again. */
+        this.rev = 0;
+    }
+    get epoch() {
+        return this.currentEpoch;
+    }
+    get revision() {
+        return this.rev;
+    }
+    /** Every element, in drawing order (oldest first). */
+    get elements() {
+        return [...this.byId.values()];
+    }
+    get size() {
+        return this.byId.size;
+    }
+    get(id) {
+        return this.byId.get(id);
+    }
+    /** Whether one more element fits on the board. */
+    get hasRoom() {
+        return this.byId.size < MAX_BOARD_ELEMENTS;
+    }
+    /**
+     * Applies `op` - sent by peer `author`, or, for `null`, carried by a catch-up on its authors' behalf (it names no
+     * single author; see `CollabSession` on how far a catch-up is trusted). Returns whether the board changed.
+     */
+    apply(op, author) {
+        switch (op.op) {
+            case "add":
+                return this.add(op.element, author);
+            case "points":
+                return this.points(op, author);
+            case "remove":
+                return this.remove(op.ids);
+            case "clear":
+                return this.clear(op.epoch);
+        }
+    }
+    /** The ops that rebuild this board from nothing - a newcomer's catch-up. A long stroke is split into an `add` and
+     * `points` ops of at most `pointsPerOp` points each (never more than `MAX_POINTS_PER_OP`). */
+    toOps(pointsPerOp = MAX_POINTS_PER_OP) {
+        const ops = [];
+        const perOp = Math.max(1, Math.floor(Math.min(pointsPerOp, MAX_POINTS_PER_OP)) || 1) * 2;
+        for (const element of this.byId.values()) {
+            if (element.kind !== "stroke" || element.points.length <= perOp) {
+                ops.push({ op: "add", element: element.kind === "stroke" ? { ...element, points: [...element.points] } : { ...element } });
+                continue;
+            }
+            ops.push({ op: "add", element: { ...element, points: element.points.slice(0, perOp) } });
+            for (let i = perOp; i < element.points.length; i += perOp) {
+                ops.push({ op: "points", id: element.id, start: i / 2, points: element.points.slice(i, i + perOp) });
+            }
+        }
+        return ops;
+    }
+    add(element, author) {
+        if ((author !== null && !isOwnId(element.id, author)) || element.epoch < this.currentEpoch || this.tombstones.has(element.id)) {
+            return false;
+        }
+        const existing = this.byId.get(element.id);
+        if (existing) {
+            // Only a stroke grows; anything else is already all there.
+            if (existing.kind !== "stroke" || element.kind !== "stroke") {
+                return false;
+            }
+            return this.writePoints(existing, 0, element.points);
+        }
+        if (!this.hasRoom) {
+            return false;
+        }
+        this.byId.set(element.id, element.kind === "stroke" ? { ...element, points: element.points.slice(0, MAX_STROKE_POINTS * 2) } : { ...element });
+        this.changed();
+        const added = this.byId.get(element.id);
+        if (added.kind === "stroke") {
+            this.drainPending(added);
+        }
+        return true;
+    }
+    points(op, author) {
+        if ((author !== null && !isOwnId(op.id, author)) || this.tombstones.has(op.id)) {
+            return false;
+        }
+        const element = this.byId.get(op.id);
+        if (element && element.kind !== "stroke") {
+            return false;
+        }
+        if (!element || op.start * 2 > element.points.length) {
+            this.hold(op);
+            return false;
+        }
+        return this.writePoints(element, op.start, op.points);
+    }
+    /** Writes `points` into `stroke` from point index `start`, then whatever was waiting for them. */
+    writePoints(stroke, start, points) {
+        const offset = start * 2;
+        const end = Math.min(offset + points.length, MAX_STROKE_POINTS * 2);
+        if (end <= stroke.points.length) {
+            return false;
+        }
+        for (let i = Math.max(offset, stroke.points.length); i < end; i++) {
+            stroke.points[i] = points[i - offset];
+        }
+        this.changed();
+        this.drainPending(stroke);
+        return true;
+    }
+    hold(op) {
+        if (this.pending.length >= MAX_PENDING_POINT_OPS) {
+            this.pending.shift();
+        }
+        this.pending.push(op);
+    }
+    /** Applies every held `points` op for `stroke` that now connects to what it has. */
+    drainPending(stroke) {
+        let progressed = true;
+        while (progressed) {
+            progressed = false;
+            for (let i = 0; i < this.pending.length; i++) {
+                const op = this.pending[i];
+                if (op.id === stroke.id && op.start * 2 <= stroke.points.length) {
+                    this.pending.splice(i, 1);
+                    this.writePoints(stroke, op.start, op.points);
+                    progressed = true;
+                    break;
+                }
+            }
+        }
+    }
+    remove(ids) {
+        let changed = false;
+        for (const id of ids) {
+            if (this.tombstones.size >= MAX_TOMBSTONES) {
+                this.tombstones.delete(this.tombstones.values().next().value);
+            }
+            this.tombstones.add(id);
+            changed = this.byId.delete(id) || changed;
+        }
+        if (changed) {
+            this.changed();
+        }
+        return changed;
+    }
+    clear(epoch) {
+        if (epoch <= this.currentEpoch) {
+            return false;
+        }
+        this.currentEpoch = epoch;
+        const cleared = new Set();
+        for (const [id, element] of this.byId) {
+            if (element.epoch < epoch) {
+                this.byId.delete(id);
+                cleared.add(id);
+            }
+        }
+        // Drop only the points held for strokes just cleared away: one not here yet may belong to the new epoch - a
+        // newcomer's catch-up starts with a clear that races the live ops of a stroke being drawn - and the rest can
+        // never drain anyway (an older epoch's `add` is refused), so they just age out under the cap.
+        const kept = this.pending.filter((op) => !cleared.has(op.id));
+        this.pending.splice(0, this.pending.length, ...kept);
+        this.changed();
+        return true;
+    }
+    changed() {
+        this.rev += 1;
+    }
+}

package/dist/apps/shared/collab/chatMarkdown.d.ts

@@ -0,0 +1,65 @@
+/**
+ * Renders a chat message's Markdown as React elements - never as HTML. A message is another participant's text, so it
+ * is parsed here into a small set of known elements and everything else stays literal text that React escapes; there
+ * is no `dangerouslySetInnerHTML` anywhere, and a raw `<script>` in a message is shown as those characters.
+ *
+ * What it understands - the everyday subset of Markdown people type into chat:
+ *
+ * - Blocks: paragraphs (a single line break is kept as a break), `#`/`##`/`###` headings, `>` quotes, `-`/`*`/`+`
+ * bulleted and `1.` numbered lists, and ``` fenced code blocks.
+ * - Inline: `**bold**`/`__bold__`, `*italic*`/`_italic_`, `~~strikethrough~~`, `` `code` ``, `[text](url)` links,
+ * `![alt](url)` images, and a backslash to keep any of those characters literal.
+ * - A bare `http(s)://` address becomes a link - and when it points at an image (by its file extension, as a GIF
+ * from the GIF picker does), the image itself is shown instead, falling back to the link if it doesn't load.
+ * - A message of nothing but one to three emoji is shown large.
+ *
+ * Only `http:`, `https:` and `mailto:` links are made clickable (anything else, `javascript:` included, stays text);
+ * links open in a new tab without a referrer, and images load without one either.
+ */
+import React from "react";
+/** `url` when it is safe to link to (`http:`, `https:`, `mailto:`), else `undefined`. */
+export declare function safeLinkUrl(url: string): string | undefined;
+/** `url` when it is safe to load as an image (`http:`, `https:`), else `undefined`. */
+export declare function safeImageUrl(url: string): string | undefined;
+/** Whether `url` names an image by its path's file extension (query and fragment aside). */
+export declare function isImageUrl(url: string): boolean;
+/** Whether `text` is just one to three emoji (and whitespace) - shown large. */
+export declare function isEmojiOnly(text: string): boolean;
+/** The end of a bare URL starting at the beginning of `text`: trailing punctuation that more likely ends the sentence
+ * than the address is left out, and a closing parenthesis only stays when the address opened one. */
+export declare function bareUrlLength(text: string): number;
+type Block = {
+    type: "paragraph";
+    lines: string[];
+} | {
+    type: "heading";
+    level: 1 | 2 | 3;
+    text: string;
+} | {
+    type: "code";
+    text: string;
+} | {
+    type: "quote";
+    blocks: Block[];
+} | {
+    type: "list";
+    ordered: boolean;
+    start: number;
+    items: string[];
+};
+/** Splits `text` into blocks - see this module's doc comment for which. */
+export declare function parseBlocks(text: string, depth?: number): Block[];
+/** Renders `text`'s inline formatting - see this module's doc comment. `inLink` stops a link nesting in a link. */
+export declare function renderInline(text: string, keyPrefix?: string, depth?: number, inLink?: boolean): React.ReactNode[];
+/** An image in a message, linking to itself. One that fails to load becomes a plain link (`fallbackLabel`, its
+ * address, for a bare URL) or, for `![alt](url)`, its alt text as a link. */
+export declare function ChatImage({ src, alt, fallbackLabel }: {
+    src: string;
+    alt: string;
+    fallbackLabel?: string;
+}): React.JSX.Element;
+/** One chat message's text, rendered - see this module's doc comment. */
+export default function ChatMarkdown({ text }: {
+    text: string;
+}): React.JSX.Element;
+export {};

package/dist/apps/shared/collab/chatMarkdown.js

@@ -0,0 +1,311 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+///////////////////////////////////////////////////////////////////////////////
+// Copyright (C) 2026 Jean-Philippe Steinmetz. All rights reserved.
+// SPDX-License-Identifier: MPL-2.0
+///////////////////////////////////////////////////////////////////////////////
+/**
+ * Renders a chat message's Markdown as React elements - never as HTML. A message is another participant's text, so it
+ * is parsed here into a small set of known elements and everything else stays literal text that React escapes; there
+ * is no `dangerouslySetInnerHTML` anywhere, and a raw `<script>` in a message is shown as those characters.
+ *
+ * What it understands - the everyday subset of Markdown people type into chat:
+ *
+ * - Blocks: paragraphs (a single line break is kept as a break), `#`/`##`/`###` headings, `>` quotes, `-`/`*`/`+`
+ * bulleted and `1.` numbered lists, and ``` fenced code blocks.
+ * - Inline: `**bold**`/`__bold__`, `*italic*`/`_italic_`, `~~strikethrough~~`, `` `code` ``, `[text](url)` links,
+ * `![alt](url)` images, and a backslash to keep any of those characters literal.
+ * - A bare `http(s)://` address becomes a link - and when it points at an image (by its file extension, as a GIF
+ * from the GIF picker does), the image itself is shown instead, falling back to the link if it doesn't load.
+ * - A message of nothing but one to three emoji is shown large.
+ *
+ * Only `http:`, `https:` and `mailto:` links are made clickable (anything else, `javascript:` included, stays text);
+ * links open in a new tab without a referrer, and images load without one either.
+ */
+import React, { useState } from "react";
+const IMAGE_EXTENSIONS = /\.(png|jpe?g|gif|webp|avif|bmp|svg)$/i;
+const BARE_URL = /^https?:\/\/[^\s<>"'`]+/i;
+const ONLY_EMOJI = /^(?:\p{Extended_Pictographic}|\p{Emoji_Modifier}|\p{Regional_Indicator}|‍|️|⃣|[#*0-9]️?⃣|\s)+$/u;
+/** The deepest a quote may nest, or inline formatting may nest inside itself. */
+const MAX_DEPTH = 4;
+/** `url` when it is safe to link to (`http:`, `https:`, `mailto:`), else `undefined`. */
+export function safeLinkUrl(url) {
+    try {
+        const parsed = new URL(url);
+        return ["http:", "https:", "mailto:"].includes(parsed.protocol) ? parsed.href : undefined;
+    }
+    catch {
+        return undefined;
+    }
+}
+/** `url` when it is safe to load as an image (`http:`, `https:`), else `undefined`. */
+export function safeImageUrl(url) {
+    const safe = safeLinkUrl(url);
+    return safe && !safe.startsWith("mailto:") ? safe : undefined;
+}
+/** Whether `url` names an image by its path's file extension (query and fragment aside). */
+export function isImageUrl(url) {
+    try {
+        const parsed = new URL(url);
+        return (parsed.protocol === "http:" || parsed.protocol === "https:") && IMAGE_EXTENSIONS.test(parsed.pathname);
+    }
+    catch {
+        return false;
+    }
+}
+/** Whether `text` is just one to three emoji (and whitespace) - shown large. */
+export function isEmojiOnly(text) {
+    const trimmed = text.trim();
+    if (!trimmed || !ONLY_EMOJI.test(trimmed) || !/\p{Extended_Pictographic}|\p{Regional_Indicator}|[#*0-9]️?⃣/u.test(trimmed)) {
+        return false;
+    }
+    // Count what a reader sees as one emoji each: a ZWJ sequence, skin tone or variation selector belongs to the emoji
+    // before it, and a flag is a pair of regional indicators.
+    const base = trimmed.replace(/\s+/g, "").replace(/‍\p{Extended_Pictographic}/gu, "").replace(/[\p{Emoji_Modifier}️⃣]/gu, "");
+    const flags = (base.match(/\p{Regional_Indicator}/gu)?.length ?? 0) / 2;
+    const others = base.replace(/\p{Regional_Indicator}/gu, "").match(/\p{Extended_Pictographic}|[#*0-9]/gu)?.length ?? 0;
+    return Math.ceil(flags) + others <= 3;
+}
+/** The end of a bare URL starting at the beginning of `text`: trailing punctuation that more likely ends the sentence
+ * than the address is left out, and a closing parenthesis only stays when the address opened one. */
+export function bareUrlLength(text) {
+    const match = BARE_URL.exec(text);
+    if (!match) {
+        return 0;
+    }
+    let url = match[0];
+    for (;;) {
+        const last = url[url.length - 1];
+        if (".,;:!?'\"*_~".includes(last)) {
+            url = url.slice(0, -1);
+        }
+        else if (last === ")" && (url.match(/\(/g)?.length ?? 0) < (url.match(/\)/g)?.length ?? 0)) {
+            url = url.slice(0, -1);
+        }
+        else {
+            break;
+        }
+    }
+    return url.length;
+}
+const FENCE = /^\s*```/;
+const QUOTE = /^\s*>\s?(.*)$/;
+const BULLET = /^\s*[-*+]\s+(.*)$/;
+const NUMBERED = /^\s*(\d{1,9})[.)]\s+(.*)$/;
+const HEADING = /^(#{1,3})\s+(.*)$/;
+/** Splits `text` into blocks - see this module's doc comment for which. */
+export function parseBlocks(text, depth = 0) {
+    const lines = text.replace(/\r\n?/g, "\n").split("\n");
+    const blocks = [];
+    let i = 0;
+    while (i < lines.length) {
+        const line = lines[i];
+        if (!line.trim()) {
+            i++;
+            continue;
+        }
+        if (FENCE.test(line)) {
+            const body = [];
+            i++;
+            while (i < lines.length && !FENCE.test(lines[i])) {
+                body.push(lines[i++]);
+            }
+            i++;
+            blocks.push({ type: "code", text: body.join("\n") });
+            continue;
+        }
+        if (QUOTE.test(line) && depth < MAX_DEPTH) {
+            const body = [];
+            while (i < lines.length && QUOTE.test(lines[i])) {
+                body.push(QUOTE.exec(lines[i++])[1]);
+            }
+            blocks.push({ type: "quote", blocks: parseBlocks(body.join("\n"), depth + 1) });
+            continue;
+        }
+        const heading = HEADING.exec(line);
+        if (heading) {
+            blocks.push({ type: "heading", level: heading[1].length, text: heading[2] });
+            i++;
+            continue;
+        }
+        if (BULLET.test(line) || NUMBERED.test(line)) {
+            const ordered = !BULLET.test(line);
+            const pattern = ordered ? NUMBERED : BULLET;
+            const items = [];
+            const start = ordered ? Number(NUMBERED.exec(line)[1]) : 1;
+            while (i < lines.length && pattern.test(lines[i])) {
+                const match = pattern.exec(lines[i++]);
+                items.push(ordered ? match[2] : match[1]);
+            }
+            blocks.push({ type: "list", ordered, start, items });
+            continue;
+        }
+        const paragraph = [];
+        // Past MAX_DEPTH a quote line is plain text - stopping at it here would leave `i` where it is, for ever.
+        while (i < lines.length && lines[i].trim() && !FENCE.test(lines[i]) && (depth >= MAX_DEPTH || !QUOTE.test(lines[i])) && !HEADING.test(lines[i]) && !BULLET.test(lines[i]) && !NUMBERED.test(lines[i])) {
+            paragraph.push(lines[i++]);
+        }
+        blocks.push({ type: "paragraph", lines: paragraph });
+    }
+    return blocks;
+}
+const ESCAPABLE = "\\`*_~[]()!#>-+.";
+const EMPHASIS = [
+    { marker: "**", tag: "strong" },
+    { marker: "__", tag: "strong" },
+    { marker: "~~", tag: "del" },
+    { marker: "*", tag: "em" },
+    { marker: "_", tag: "em" },
+];
+/** Where the `[text](url)` (or image) starting at `open` (the `[`) ends, with its parts - or `undefined`. */
+function readLink(text, open) {
+    let depth = 0;
+    let close = -1;
+    for (let j = open; j < text.length; j++) {
+        if (text[j] === "\\") {
+            j++;
+        }
+        else if (text[j] === "[") {
+            depth++;
+        }
+        else if (text[j] === "]" && --depth === 0) {
+            close = j;
+            break;
+        }
+    }
+    if (close < 0 || text[close + 1] !== "(") {
+        return undefined;
+    }
+    const end = text.indexOf(")", close + 2);
+    if (end < 0) {
+        return undefined;
+    }
+    const url = text.slice(close + 2, end).trim();
+    return url && !/\s/.test(url) ? { label: text.slice(open + 1, close), url, end: end + 1 } : undefined;
+}
+/** Renders `text`'s inline formatting - see this module's doc comment. `inLink` stops a link nesting in a link. */
+export function renderInline(text, keyPrefix = "i", depth = 0, inLink = false) {
+    const nodes = [];
+    let plain = "";
+    const flush = () => {
+        if (plain) {
+            nodes.push(plain);
+            plain = "";
+        }
+    };
+    const key = () => `${keyPrefix}-${nodes.length}`;
+    let i = 0;
+    while (i < text.length) {
+        const ch = text[i];
+        if (ch === "\\" && i + 1 < text.length && ESCAPABLE.includes(text[i + 1])) {
+            plain += text[i + 1];
+            i += 2;
+            continue;
+        }
+        if (ch === "`") {
+            const close = text.indexOf("`", i + 1);
+            if (close > i + 1) {
+                flush();
+                nodes.push(_jsx("code", { className: "px-1 rounded bg-black/30 font-mono text-[0.9em]", children: text.slice(i + 1, close) }, key()));
+                i = close + 1;
+                continue;
+            }
+        }
+        if (ch === "!" && text[i + 1] === "[" && !inLink) {
+            const link = readLink(text, i + 1);
+            const src = link && safeImageUrl(link.url);
+            if (link && src) {
+                flush();
+                nodes.push(_jsx(ChatImage, { src: src, alt: link.label }, key()));
+                i = link.end;
+                continue;
+            }
+        }
+        if (ch === "[" && !inLink) {
+            const link = readLink(text, i);
+            const href = link && safeLinkUrl(link.url);
+            if (link && href) {
+                flush();
+                nodes.push(_jsx(ChatLink, { href: href, children: depth < MAX_DEPTH ? renderInline(link.label, key(), depth + 1, true) : link.label }, key()));
+                i = link.end;
+                continue;
+            }
+        }
+        if ((ch === "h" || ch === "H") && !inLink && (i === 0 || !/[\w/]/.test(text[i - 1]))) {
+            const length = bareUrlLength(text.slice(i));
+            if (length > 0) {
+                const url = text.slice(i, i + length);
+                const href = safeLinkUrl(url);
+                if (href) {
+                    flush();
+                    nodes.push(isImageUrl(href) ? _jsx(ChatImage, { src: href, alt: "", fallbackLabel: url }, key()) : _jsx(ChatLink, { href: href, children: url }, key()));
+                    i += length;
+                    continue;
+                }
+            }
+        }
+        const emphasis = depth < MAX_DEPTH ? EMPHASIS.find(({ marker }) => text.startsWith(marker, i)) : undefined;
+        if (emphasis) {
+            const { marker, tag } = emphasis;
+            const contentStart = i + marker.length;
+            // An underscore inside a word (snake_case) is not emphasis.
+            const intraword = marker[0] === "_" && i > 0 && /\w/.test(text[i - 1]);
+            let close = text.indexOf(marker, contentStart);
+            while (close > contentStart && marker === "*" && text[close + 1] === "*") {
+                close = text.indexOf(marker, close + 2);
+            }
+            const inner = close > contentStart ? text.slice(contentStart, close) : "";
+            const closesIntraword = marker[0] === "_" && /\w/.test(text[close + marker.length] ?? "");
+            if (!intraword && inner && !/^\s/.test(inner) && !/\s$/.test(inner) && !closesIntraword) {
+                flush();
+                const Tag = tag;
+                nodes.push(_jsx(Tag, { children: renderInline(inner, key(), depth + 1, inLink) }, key()));
+                i = close + marker.length;
+                continue;
+            }
+        }
+        plain += ch;
+        i++;
+    }
+    flush();
+    return nodes;
+}
+function ChatLink({ href, children }) {
+    return (_jsx("a", { href: href, target: "_blank", rel: "noopener noreferrer nofollow", className: "text-[#8ab4f8] underline break-all", children: children }));
+}
+/** An image in a message, linking to itself. One that fails to load becomes a plain link (`fallbackLabel`, its
+ * address, for a bare URL) or, for `![alt](url)`, its alt text as a link. */
+export function ChatImage({ src, alt, fallbackLabel }) {
+    const [failed, setFailed] = useState(false);
+    if (failed) {
+        return _jsx(ChatLink, { href: src, children: fallbackLabel ?? (alt || src) });
+    }
+    return (_jsx("a", { href: src, target: "_blank", rel: "noopener noreferrer nofollow", className: "block my-1 w-fit", children: _jsx("img", { src: src, alt: alt, loading: "lazy", referrerPolicy: "no-referrer", className: "max-h-60 max-w-full rounded-lg", onError: () => setFailed(true) }) }));
+}
+function renderBlocks(blocks, keyPrefix) {
+    return blocks.map((block, index) => {
+        const key = `${keyPrefix}-${index}`;
+        switch (block.type) {
+            case "paragraph":
+                return (_jsx("p", { className: "whitespace-pre-wrap break-words", children: block.lines.map((line, n) => (_jsxs(React.Fragment, { children: [n > 0 && _jsx("br", {}), renderInline(line, `${key}-${n}`)] }, n))) }, key));
+            case "heading": {
+                const sizes = { 1: "text-lg", 2: "text-base", 3: "text-sm" };
+                return (_jsx("p", { role: "heading", "aria-level": block.level, className: `${sizes[block.level]} font-semibold break-words`, children: renderInline(block.text, key) }, key));
+            }
+            case "code":
+                return (_jsx("pre", { className: "my-1 p-2 rounded-lg bg-black/30 font-mono text-xs overflow-x-auto", children: _jsx("code", { children: block.text }) }, key));
+            case "quote":
+                return (_jsx("blockquote", { className: "my-1 pl-2 border-l-2 border-white/30 text-white/80", children: renderBlocks(block.blocks, key) }, key));
+            case "list": {
+                const items = block.items.map((item, n) => (_jsx("li", { className: "break-words", children: renderInline(item, `${key}-${n}`) }, n)));
+                return block.ordered ? (_jsx("ol", { start: block.start, className: "list-decimal pl-5", children: items }, key)) : (_jsx("ul", { className: "list-disc pl-5", children: items }, key));
+            }
+        }
+    });
+}
+/** One chat message's text, rendered - see this module's doc comment. */
+export default function ChatMarkdown({ text }) {
+    if (isEmojiOnly(text)) {
+        return _jsx("p", { className: "text-4xl leading-tight", children: text.trim() });
+    }
+    return _jsx("div", { className: "space-y-1 text-sm", children: renderBlocks(parseBlocks(text), "b") });
+}

package/dist/apps/shared/collab/color.d.ts

@@ -0,0 +1,18 @@
+/** Hue/saturation/value conversions for the whiteboard's color wheel (`apps/meet/_ColorWheel.tsx`). Hue is in degrees
+ * [0, 360), saturation and value in [0, 1]; colors are lowercase `#rrggbb`. */
+export interface Hsv {
+    h: number;
+    s: number;
+    v: number;
+}
+/** `[r, g, b]`, each 0-255, of an HSV color. */
+export declare function hsvToRgb({ h, s, v }: Hsv): [number, number, number];
+export declare function hsvToHex(hsv: Hsv): string;
+/** The HSV of a `#rrggbb` color; black for anything else. */
+export declare function hexToHsv(hex: string): Hsv;
+/** The hue and saturation at (`x`, `y`) on a wheel of `radius` centered at (`radius`, `radius`): hue by angle
+ * (red at the right, going clockwise), saturation by distance from the center, clamped to the rim. */
+export declare function wheelPoint(x: number, y: number, radius: number): {
+    h: number;
+    s: number;
+};

package/dist/apps/shared/collab/color.js

@@ -0,0 +1,59 @@
+///////////////////////////////////////////////////////////////////////////////
+// Copyright (C) 2026 Jean-Philippe Steinmetz. All rights reserved.
+// SPDX-License-Identifier: MPL-2.0
+///////////////////////////////////////////////////////////////////////////////
+/** Hue/saturation/value conversions for the whiteboard's color wheel (`apps/meet/_ColorWheel.tsx`). Hue is in degrees
+ * [0, 360), saturation and value in [0, 1]; colors are lowercase `#rrggbb`. */
+/** `[r, g, b]`, each 0-255, of an HSV color. */
+export function hsvToRgb({ h, s, v }) {
+    const hue = ((h % 360) + 360) % 360;
+    const c = v * s;
+    const x = c * (1 - Math.abs(((hue / 60) % 2) - 1));
+    const m = v - c;
+    const sector = Math.floor(hue / 60);
+    const [r, g, b] = [
+        [c, x, 0],
+        [x, c, 0],
+        [0, c, x],
+        [0, x, c],
+        [x, 0, c],
+        [c, 0, x],
+    ][sector];
+    return [Math.round((r + m) * 255), Math.round((g + m) * 255), Math.round((b + m) * 255)];
+}
+export function hsvToHex(hsv) {
+    return `#${hsvToRgb(hsv)
+        .map((channel) => channel.toString(16).padStart(2, "0"))
+        .join("")}`;
+}
+/** The HSV of a `#rrggbb` color; black for anything else. */
+export function hexToHsv(hex) {
+    const match = /^#([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})$/i.exec(hex);
+    if (!match) {
+        return { h: 0, s: 0, v: 0 };
+    }
+    const [r, g, b] = match.slice(1).map((part) => parseInt(part, 16) / 255);
+    const max = Math.max(r, g, b);
+    const delta = max - Math.min(r, g, b);
+    let h = 0;
+    if (delta > 0) {
+        if (max === r) {
+            h = 60 * (((g - b) / delta) % 6);
+        }
+        else if (max === g) {
+            h = 60 * ((b - r) / delta + 2);
+        }
+        else {
+            h = 60 * ((r - g) / delta + 4);
+        }
+    }
+    return { h: (h + 360) % 360, s: max === 0 ? 0 : delta / max, v: max };
+}
+/** The hue and saturation at (`x`, `y`) on a wheel of `radius` centered at (`radius`, `radius`): hue by angle
+ * (red at the right, going clockwise), saturation by distance from the center, clamped to the rim. */
+export function wheelPoint(x, y, radius) {
+    const dx = x - radius;
+    const dy = y - radius;
+    const h = ((Math.atan2(dy, dx) * 180) / Math.PI + 360) % 360;
+    return { h, s: Math.min(1, Math.hypot(dx, dy) / radius) };
+}