@unoverse-platform/studio 0.1.103 → 0.1.104

package/vendor/sdk/lib/dom/markdownParse.ts

@@ -0,0 +1,440 @@
+/**
+ * THE TEXT PARSER: the markdown a component's text may carry, read into a tree of tags
+ * (docs/unoverse/design/authoring/UNOVERSE_MARKDOWN.md §11 is the whole list). Our own code,
+ * no package. It decides structure only; ./markdown draws each tag with the served recipe.
+ *
+ * Anything not on the list shows as the words typed, HTML included: a model's answer cannot
+ * place elements on the page.
+ */
+import type { MarkdownTree } from "./types";
+
+type El = Exclude<MarkdownTree, string>;
+const el = (tag: string, props: Record<string, unknown> = {}, children: MarkdownTree[] = []): El => ({ tag, props, children });
+
+/** A heading's id: its words, lower case, accents folded, spaces as hyphens. */
+export function slugify(s: string): string {
+  return s
+    .replace(/[ÀÁÂÃÄÅàáâãäåæÆ]/g, "a")
+    .replace(/[çÇ]/g, "c")
+    .replace(/[ðÐ]/g, "d")
+    .replace(/[ÈÉÊËéèêë]/g, "e")
+    .replace(/[ÏïÎîÍíÌì]/g, "i")
+    .replace(/[Ññ]/g, "n")
+    .replace(/[øØœŒÕõÔôÓóÒò]/g, "o")
+    .replace(/[ÜüÛûÚúÙù]/g, "u")
+    .replace(/[ŸÿÝý]/g, "y")
+    .replace(/[^a-z0-9- ]/gi, "")
+    .replace(/ /g, "-")
+    .toLowerCase();
+}
+
+// ── block patterns ──────────────────────────────────────────────────────────
+const BLANK = /^\s*$/;
+const FENCE = /^ {0,3}(`{3,}|~{3,})\s*([^\s`]*)[^`]*$/;
+const ATX = /^ {0,3}(#{1,6})(?:\s+(.*?))?(?:\s+#+)?\s*$/;
+const HR = /^ {0,3}([-*_])(?:\s*\1){2,}\s*$/;
+const QUOTE = /^ {0,3}> ?/;
+const BULLET = /^( *)([-*+])( +|$)/;
+const ORDERED = /^( *)(\d{1,9})\.( +|$)/;
+const FOOTDEF = /^\[\^([^\]]+)\]:\s?(.*)$/;
+const SETEXT = /^ {0,3}(=+|-+)\s*$/;
+const TABLE_RULE = /^\s*\|?\s*:?-+:?\s*(\|\s*:?-+:?\s*)*\|?\s*$/;
+
+const isTableStart = (lines: string[], i: number) => lines[i].includes("|") && i + 1 < lines.length && TABLE_RULE.test(lines[i + 1]) && lines[i + 1].includes("-");
+
+/** Whether a line opens a block that ends the paragraph above it. */
+const interrupts = (lines: string[], i: number) => {
+  const l = lines[i];
+  return FENCE.test(l) || ATX.test(l) || HR.test(l) || QUOTE.test(l) || BULLET.test(l) || ORDERED.test(l) || isTableStart(lines, i);
+};
+
+/** The cells of one table row, split on unescaped pipes, the outer pipes dropped. */
+function cells(row: string): string[] {
+  let s = row.trim();
+  if (s.startsWith("|")) s = s.slice(1);
+  if (s.endsWith("|") && !s.endsWith("\\|")) s = s.slice(0, -1);
+  const out: string[] = [];
+  let cur = "";
+  for (let i = 0; i < s.length; i++) {
+    if (s[i] === "\\" && s[i + 1] === "|") {
+      cur += "|";
+      i++;
+    } else if (s[i] === "|") {
+      out.push(cur);
+      cur = "";
+    } else cur += s[i];
+  }
+  out.push(cur);
+  // A cell of only spaces is empty.
+  return out.map((c) => (c.trim() ? c : ""));
+}
+
+const alignOf = (rule: string): string | undefined => {
+  const r = rule.trim();
+  return r.startsWith(":") && r.endsWith(":") ? "center" : r.startsWith(":") ? "left" : r.endsWith(":") ? "right" : undefined;
+};
+
+interface Footnotes {
+  defs: [string, string][];
+}
+
+/** Read lines into blocks. */
+function blocks(lines: string[], notes: Footnotes): MarkdownTree[] {
+  const out: MarkdownTree[] = [];
+  let i = 0;
+  while (i < lines.length) {
+    const line = lines[i];
+    if (BLANK.test(line)) {
+      i++;
+      continue;
+    }
+    let m: RegExpExecArray | null;
+    // Fenced code: kept exactly as written.
+    if ((m = FENCE.exec(line))) {
+      const fence = m[1];
+      const lang = m[2];
+      const body: string[] = [];
+      i++;
+      while (i < lines.length && !new RegExp(`^ {0,3}${fence[0]}{${fence.length},}\\s*$`).test(lines[i])) body.push(lines[i++]);
+      i++;
+      out.push(el("pre", {}, [el("code", lang ? { className: `lang-${lang}` } : {}, [body.join("\n") + (body.length ? "\n" : "")])]));
+      continue;
+    }
+    // Indented code (four spaces).
+    if (/^ {4}\S/.test(line)) {
+      const body: string[] = [];
+      while (i < lines.length && (/^ {4}/.test(lines[i]) || (BLANK.test(lines[i]) && /^ {4}/.test(lines[i + 1] ?? "")))) body.push(lines[i++].slice(4));
+      out.push(el("pre", {}, [el("code", {}, [body.join("\n")])]));
+      continue;
+    }
+    if ((m = ATX.exec(line))) {
+      const text = (m[2] ?? "").trim();
+      out.push(el(`h${m[1].length}`, { id: slugify(text) }, inline(text, notes)));
+      i++;
+      continue;
+    }
+    if (HR.test(line)) {
+      out.push(el("hr"));
+      i++;
+      continue;
+    }
+    if (QUOTE.test(line)) {
+      const body: string[] = [];
+      while (i < lines.length && !BLANK.test(lines[i]) && (QUOTE.test(lines[i]) || body.length)) {
+        if (!QUOTE.test(lines[i]) && interrupts(lines, i)) break;
+        body.push(lines[i++].replace(QUOTE, ""));
+        // A `>` line that is empty keeps the quote going across a paragraph break.
+        while (i < lines.length && /^ {0,3}>\s*$/.test(lines[i])) body.push(lines[i++].replace(QUOTE, ""));
+      }
+      out.push(el("blockquote", {}, blocks(body, notes)));
+      continue;
+    }
+    if (isTableStart(lines, i)) {
+      const head = cells(lines[i]);
+      const aligns = cells(lines[i + 1]).map(alignOf);
+      i += 2;
+      const rows: string[][] = [];
+      while (i < lines.length && !BLANK.test(lines[i]) && lines[i].includes("|")) rows.push(cells(lines[i++]));
+      const style = (c: number) => (aligns[c] ? { textAlign: aligns[c] } : {});
+      out.push(
+        el("table", {}, [
+          el("thead", {}, [el("tr", {}, head.map((h, c) => el("th", { style: style(c) }, inline(h, notes))))]),
+          el("tbody", {}, rows.map((r) => el("tr", {}, r.map((d, c) => el("td", { style: style(c) }, inline(d, notes)))))),
+        ]),
+      );
+      continue;
+    }
+    if (BULLET.test(line) || ORDERED.test(line)) {
+      const [list, next] = readList(lines, i, notes);
+      out.push(list);
+      i = next;
+      continue;
+    }
+    if ((m = FOOTDEF.exec(line))) {
+      notes.defs.push([m[1], m[2]]);
+      i++;
+      continue;
+    }
+    // A paragraph: lines up to a blank or a block that interrupts it.
+    const para: string[] = [line];
+    i++;
+    while (i < lines.length && !BLANK.test(lines[i])) {
+      if (SETEXT.test(lines[i])) {
+        const level = lines[i].trim()[0] === "=" ? 1 : 2;
+        i++;
+        out.push(el(`h${level}`, {}, inline(para.join("\n").trim(), notes)));
+        para.length = 0;
+        break;
+      }
+      if (interrupts(lines, i)) break;
+      para.push(lines[i++]);
+    }
+    if (para.length) out.push(el("p", {}, inline(para.join("\n").trim(), notes)));
+  }
+  return out;
+}
+
+/** A list from line `i`: its items, each with its own lines; returns the list and the next line. */
+function readList(lines: string[], start: number, notes: Footnotes): [El, number] {
+  const first = (BULLET.exec(lines[start]) ?? ORDERED.exec(lines[start]))!;
+  const ordered = !BULLET.test(lines[start]);
+  const indent = first[1].length;
+  const items: string[][] = [];
+  let loose = false;
+  let i = start;
+  const marker = (l: string) => {
+    const m = ordered ? ORDERED.exec(l) : BULLET.exec(l);
+    return m && m[1].length <= indent + 1 ? m : null;
+  };
+  while (i < lines.length) {
+    const m = marker(lines[i]);
+    if (!m) break;
+    const content = m[0].length;
+    const item = [lines[i].slice(content)];
+    i++;
+    while (i < lines.length) {
+      const l = lines[i];
+      if (BLANK.test(l)) {
+        // A blank line inside the list: the item goes on if what follows is indented, the
+        // list goes on if another item follows, and either way the list is loose.
+        let j = i;
+        while (j < lines.length && BLANK.test(lines[j])) j++;
+        if (j < lines.length && /^\s+/.test(lines[j]) && lines[j].search(/\S/) >= content) {
+          loose = true;
+          for (; i < j; i++) item.push("");
+          continue;
+        }
+        if (j < lines.length && marker(lines[j])) loose = true;
+        break;
+      }
+      if (marker(l)) break;
+      const lead = l.search(/\S/);
+      // A line indented to the item's text belongs to it; an unindented one continues its
+      // paragraph unless it opens a block.
+      if (lead >= content || lead > indent) item.push(l.slice(Math.min(lead, content)));
+      else if (!interrupts(lines, i)) item.push(l.trim());
+      else break;
+      i++;
+    }
+    items.push(item);
+    while (i < lines.length && BLANK.test(lines[i]) && marker(lines[i + 1] ?? "")) i++;
+  }
+  const lis = items.map((item) => listItem(item, loose, notes));
+  return [el(ordered ? "ol" : "ul", ordered ? { start: Number(first[2]) } : {}, lis), i];
+}
+
+/** One item: a checkbox if it opens with `[ ]` or `[x]`, then its text and any nested blocks. */
+function listItem(lines: string[], loose: boolean, notes: Footnotes): El {
+  const kids: MarkdownTree[] = [];
+  const task = /^\[([ xX])\] /.exec(lines[0]);
+  if (task) {
+    kids.push(el("input", { checked: task[1] !== " ", readOnly: true, type: "checkbox" }));
+    lines = [" " + lines[0].slice(4), ...lines.slice(1)];
+  }
+  if (loose) return el("li", {}, [...kids, ...blocks(lines, notes)]);
+  // Tight: the item's own text inline, then whatever block follows it (a nested list).
+  let n = 0;
+  while (n < lines.length && !(n > 0 && interrupts(lines, n))) n++;
+  const text = lines.slice(0, n).join("\n");
+  const rest = lines.slice(n);
+  const words = inline(task ? text : text.trim(), notes);
+  if (rest.length && words.length) {
+    const last = words[words.length - 1];
+    if (typeof last === "string") words[words.length - 1] = last + "\n";
+    else words.push("\n");
+  }
+  return el("li", {}, [...kids, ...words, ...blocks(rest, notes)]);
+}
+
+// ── inline ──────────────────────────────────────────────────────────────────
+const PUNCT = /[!"#$%&'()*+,\-./:;<=>?@[\\\]^_`{|}~]/;
+const UNSAFE_HREF = /^\s*(javascript|vbscript|data):/i;
+const URL_AT = /^https?:\/\/[^\s<]+[^\s<.,;:!?'")\]]/;
+
+/** A link target `(href "title")` from `s[i]` = "("; returns it and the index after ")". */
+function target(s: string, i: number): { href: string; title?: string; end: number } | null {
+  let depth = 0;
+  let j = i;
+  for (; j < s.length; j++) {
+    if (s[j] === "\\") {
+      j++;
+      continue;
+    }
+    if (s[j] === "(") depth++;
+    else if (s[j] === ")" && --depth === 0) break;
+    else if (s[j] === "\n" && s[j + 1] === "\n") return null;
+  }
+  if (j >= s.length) return null;
+  const inner = s.slice(i + 1, j).trim();
+  const m = /^(\S*?)(?:\s+["'(]([\s\S]*)["')])?$/.exec(inner);
+  if (!m || /\s/.test(m[1])) return null;
+  return { href: m[1], title: m[2], end: j + 1 };
+}
+
+/** The `]` that closes the `[` at `i`, nesting allowed. */
+function closeBracket(s: string, i: number): number {
+  let depth = 0;
+  for (let j = i; j < s.length; j++) {
+    if (s[j] === "\\") j++;
+    else if (s[j] === "[") depth++;
+    else if (s[j] === "]" && --depth === 0) return j;
+  }
+  return -1;
+}
+
+const word = (c: string | undefined) => c != null && /[\p{L}\p{N}]/u.test(c);
+const space = (c: string | undefined) => c == null || /\s/.test(c);
+
+/** The run of `ch` that closes one opened with `len` of them at `from`, or -1. */
+function closer(s: string, from: number, ch: string, len: number): number {
+  for (let j = from; j < s.length; j++) {
+    if (s[j] === "\\") {
+      j++;
+      continue;
+    }
+    if (s[j] === "`") {
+      const run = /^`+/.exec(s.slice(j))![0];
+      const end = s.indexOf(run, j + run.length);
+      if (end > 0) j = end + run.length - 1;
+      continue;
+    }
+    if (s[j] !== ch) continue;
+    let k = j;
+    while (s[k] === ch) k++;
+    const run = k - j;
+    // A closing run sits right after text, and `_` never closes inside a word.
+    if (run >= len && !space(s[j - 1]) && !(ch === "_" && word(s[k]))) return run === len || len === 3 ? j : j + run - len;
+    j = k - 1;
+  }
+  return -1;
+}
+
+const TAGS: Record<string, [string, number]> = { "~": ["del", 2], "=": ["mark", 2] };
+
+/** Read a line's marks into a tree; adjacent text is one string. */
+function inline(s: string, notes: Footnotes, inLink = false): MarkdownTree[] {
+  const out: MarkdownTree[] = [];
+  let text = "";
+  const flush = () => {
+    if (text) out.push(text);
+    text = "";
+  };
+  const push = (t: MarkdownTree) => {
+    flush();
+    out.push(t);
+  };
+  let i = 0;
+  while (i < s.length) {
+    const c = s[i];
+    if (c === "\\" && PUNCT.test(s[i + 1] ?? "")) {
+      text += s[i + 1];
+      i += 2;
+      continue;
+    }
+    // Two spaces before a line end: a line break.
+    if (c === "\n" && / {2,}$/.test(text)) {
+      text = text.replace(/ +$/, "");
+      push(el("br"));
+      i++;
+      continue;
+    }
+    if (c === "`") {
+      const run = /^`+/.exec(s.slice(i))![0];
+      const end = s.indexOf(run, i + run.length);
+      if (end > 0) {
+        push(el("code", {}, [s.slice(i + run.length, end)]));
+        i = end + run.length;
+        continue;
+      }
+      text += run;
+      i += run.length;
+      continue;
+    }
+    if (c === "!" && s[i + 1] === "[") {
+      const close = closeBracket(s, i + 1);
+      const t = close > 0 && s[close + 1] === "(" ? target(s, close + 1) : null;
+      if (t) {
+        push(el("img", { alt: s.slice(i + 2, close), ...(t.title != null ? { title: t.title } : {}), src: t.href }));
+        i = t.end;
+        continue;
+      }
+    }
+    if (c === "[") {
+      // A footnote marker `[^id]`.
+      const fn = /^\[\^([^\]\s]+)\](?!:)/.exec(s.slice(i));
+      if (fn) {
+        push(el("a", { href: `#${slugify(fn[1])}` }, [el("sup", {}, [fn[1]])]));
+        i += fn[0].length;
+        continue;
+      }
+      const close = closeBracket(s, i);
+      const t = close > 0 && s[close + 1] === "(" ? target(s, close + 1) : null;
+      if (t) {
+        const props: Record<string, unknown> = UNSAFE_HREF.test(t.href) ? {} : { href: t.href };
+        if (t.title != null) props.title = t.title;
+        push(el("a", props, inline(s.slice(i + 1, close), notes, true)));
+        i = t.end;
+        continue;
+      }
+    }
+    if (c === "<") {
+      const auto = /^<((?:https?:\/\/|mailto:)[^\s>]+)>/.exec(s.slice(i));
+      if (auto) {
+        push(el("a", { href: auto[1] }, [auto[1]]));
+        i += auto[0].length;
+        continue;
+      }
+    }
+    if (c === "h" && !inLink && !word(s[i - 1])) {
+      const url = URL_AT.exec(s.slice(i));
+      if (url) {
+        push(el("a", { href: url[0] }, [url[0]]));
+        i += url[0].length;
+        continue;
+      }
+    }
+    if (c === "*" || c === "_") {
+      let k = i;
+      while (s[k] === c) k++;
+      const len = Math.min(k - i, 3);
+      const opens = !space(s[k]) && !(c === "_" && word(s[i - 1]));
+      const end = opens ? closer(s, k, c, len) : -1;
+      if (end > 0) {
+        const inner = inline(s.slice(i + len, end), notes, inLink);
+        push(len === 3 ? el("strong", {}, [el("em", {}, inner)]) : el(len === 2 ? "strong" : "em", {}, inner));
+        i = end + len;
+        continue;
+      }
+      text += s.slice(i, k);
+      i = k;
+      continue;
+    }
+    if (TAGS[c] && s[i + 1] === c && !space(s[i + 2])) {
+      const [tag, len] = TAGS[c];
+      const end = s.indexOf(c.repeat(len), i + len);
+      if (end > 0 && !space(s[end - 1])) {
+        push(el(tag, {}, inline(s.slice(i + len, end), notes, inLink)));
+        i = end + len;
+        continue;
+      }
+    }
+    text += c;
+    i++;
+  }
+  flush();
+  return out;
+}
+
+/**
+ * The text as tags. One block is returned as itself; none or several, and any footnotes, come
+ * inside one `div`, the notes last in a `footer`.
+ */
+export function parseMarkdown(source: string): MarkdownTree {
+  // An HTML comment is a note to whoever reads the source, never shown.
+  const lines = source.replace(/<!--[\s\S]*?-->/g, "").replace(/\r\n?/g, "\n").replace(/\t/g, "    ").split("\n");
+  const notes: Footnotes = { defs: [] };
+  const out = blocks(lines, notes);
+  if (notes.defs.length)
+    out.push(el("footer", {}, notes.defs.map(([id, body]) => el("div", { id: slugify(id) }, [id, ...inline(`: ${body}`, notes)]))));
+  return out.length === 1 ? out[0] : el("div", {}, out);
+}

package/vendor/sdk/lib/dom/mounted.ts

@@ -0,0 +1,29 @@
+/**
+ * Work that needs the element ON THE PAGE (measuring, observers, the orb's drawing) waits for
+ * it: queued while a view updates, run once the update is over and the host is in the
+ * document. A host that is not there yet is checked again each frame.
+ */
+export function mountQueue(onPage: () => boolean): (fn: () => void) => void {
+  let queue: (() => void)[] = [];
+  let scheduled = false;
+  const run = () => {
+    scheduled = false;
+    if (!queue.length) return;
+    if (!onPage()) {
+      if (typeof requestAnimationFrame === "function") {
+        scheduled = true;
+        requestAnimationFrame(run);
+      }
+      return;
+    }
+    const jobs = queue;
+    queue = [];
+    for (const job of jobs) job();
+  };
+  return (fn) => {
+    queue.push(fn);
+    if (scheduled) return;
+    scheduled = true;
+    queueMicrotask(run);
+  };
+}