Files
byre/web/dist/markdown.js
T

267 lines
9.0 KiB
JavaScript
Raw Normal View History

import { h } from "./dom.js";
const choiceMarker = /^(\([ *]\)|\[[ xX]\])\s+(\S.*?)\s*$/;
const detailsOpen = /^\s*<details>\s*(?:<summary>(.*?)<\/summary>)?\s*$/i;
const summaryLine = /^\s*<summary>(.*?)<\/summary>\s*$/i;
const detailsClose = /^\s*<\/details>\s*$/i;
const fence = /^\s*(```|~~~)/;
const heading = /^(#{1,6})\s+(.*)$/;
const bullet = /^(\s*)[-*+]\s+(.*)$/;
const ordered = /^(\s*)(\d+)[.)]\s+(.*)$/;
const quote = /^\s*>\s?(.*)$/;
const rule = /^\s*([-*_])(\s*\1){2,}\s*$/;
const tableSep = /^\s*\|?\s*:?-+:?\s*(\|\s*:?-+:?\s*)*\|?\s*$/;
export function markdown(src, className = "md", choice) {
return h("div", { class: className }, ...blocks(src.replace(/\r\n?/g, "\n").split("\n"), choice));
}
export function inlineMarkdown(src) {
return h("span", { class: "md-inline" }, ...inline(src));
}
function blocks(lines, choice) {
const out = [];
let i = 0;
while (i < lines.length) {
const line = lines[i];
if (line.trim() === "") {
i++;
continue;
}
const f = fence.exec(line);
if (f) {
const marker = f[1];
const body = [];
i++;
while (i < lines.length && !lines[i].trimStart().startsWith(marker)) {
body.push(lines[i]);
i++;
}
i++;
out.push(h("pre", { class: "md-code" }, h("code", {}, body.join("\n"))));
continue;
}
if (detailsClose.test(line)) {
i++;
continue;
}
const d = detailsOpen.exec(line);
if (d) {
let title = d[1];
i++;
if (title === undefined && i < lines.length && summaryLine.test(lines[i])) {
title = summaryLine.exec(lines[i])[1];
i++;
}
const body = [];
let depth = 1;
while (i < lines.length) {
const l = lines[i];
i++;
if (detailsOpen.test(l)) {
depth++;
}
else if (detailsClose.test(l) && --depth === 0) {
break;
}
body.push(l);
}
out.push(h("details", { class: "md-details" }, h("summary", {}, ...inline(title?.trim() || "Details")), h("div", { class: "md-details-body" }, ...blocks(body, choice))));
continue;
}
const hd = heading.exec(line);
if (hd) {
const level = Math.min(hd[1].length + 2, 6);
out.push(h(`h${level}`, {}, ...inline(hd[2])));
i++;
continue;
}
if (rule.test(line)) {
out.push(h("hr"));
i++;
continue;
}
if (quote.test(line)) {
const body = [];
while (i < lines.length && quote.test(lines[i])) {
body.push(quote.exec(lines[i])[1]);
i++;
}
out.push(h("blockquote", {}, ...blocks(body)));
continue;
}
if (bullet.test(line) || ordered.test(line)) {
const [list, next] = parseList(lines, i, choice);
out.push(list);
i = next;
continue;
}
if (line.includes("|") && i + 1 < lines.length && tableSep.test(lines[i + 1])) {
const rows = [cells(line)];
i += 2;
while (i < lines.length && lines[i].includes("|") && lines[i].trim() !== "") {
rows.push(cells(lines[i]));
i++;
}
out.push(table(rows));
continue;
}
const para = [];
while (i < lines.length && lines[i].trim() !== "" && !startsBlock(lines, i)) {
para.push(lines[i].trim());
i++;
}
out.push(h("p", {}, ...joinLines(para)));
}
return out;
}
function startsBlock(lines, i) {
const line = lines[i];
return (fence.test(line) ||
detailsOpen.test(line) ||
detailsClose.test(line) ||
heading.test(line) ||
rule.test(line) ||
quote.test(line) ||
bullet.test(line) ||
ordered.test(line) ||
(line.includes("|") && i + 1 < lines.length && tableSep.test(lines[i + 1])));
}
function joinLines(lines) {
const out = [];
lines.forEach((l, n) => {
if (n > 0) {
out.push(h("br"));
}
out.push(...inline(l));
});
return out;
}
function indentOf(line) {
return line.length - line.trimStart().length;
}
function parseList(lines, start, choice) {
const first = lines[start];
const isOrdered = !bullet.test(first);
const base = indentOf(first);
const list = isOrdered ? h("ol") : h("ul");
if (isOrdered) {
const n = Number(ordered.exec(first)[2]);
if (n !== 1) {
list.start = n;
}
}
let i = start;
while (i < lines.length) {
const line = lines[i];
const m = isOrdered ? ordered.exec(line) : bullet.exec(line);
if (!m || indentOf(line) !== base) {
break;
}
const text = isOrdered ? m[3] : m[2];
const body = [text];
i++;
while (i < lines.length) {
const next = lines[i];
if (next.trim() === "") {
const after = lines[i + 1];
if (after !== undefined && indentOf(after) > base && after.trim() !== "") {
body.push("");
i++;
continue;
}
break;
}
if (indentOf(next) <= base && (bullet.test(next) || ordered.test(next) || startsBlock(lines, i))) {
break;
}
body.push(indentOf(next) > base ? next.slice(Math.min(indentOf(next), base + 2)) : next.trim());
i++;
}
list.append(item(body, isOrdered ? undefined : choice));
while (i < lines.length && lines[i].trim() === "" && lines[i + 1] !== undefined && indentOf(lines[i + 1]) === base && (isOrdered ? ordered : bullet).test(lines[i + 1])) {
i++;
}
}
return [list, i];
}
function item(body, choice) {
const li = h("li");
const m = choice && choiceMarker.exec(body[0]);
const picker = m ? choice(m[2]) : null;
if (picker) {
li.className = "choice";
li.append(picker);
}
const first = picker ? [] : [body[0]];
const rest = body.slice(1);
if (rest.every((l) => !startsBlockLine(l)) && !rest.includes("")) {
li.append(...joinLines([...first, ...rest].map((l) => l.trim())));
return li;
}
const head = first;
let k = 1;
while (k < body.length && body[k] !== "" && !startsBlockLine(body[k])) {
head.push(body[k].trim());
k++;
}
li.append(...joinLines(head), ...blocks(body.slice(k), choice));
return li;
}
function startsBlockLine(line) {
return fence.test(line) || heading.test(line) || quote.test(line) || bullet.test(line) || ordered.test(line);
}
function cells(line) {
let s = line.trim();
if (s.startsWith("|")) {
s = s.slice(1);
}
if (s.endsWith("|")) {
s = s.slice(0, -1);
}
return s.split("|").map((c) => c.trim());
}
function table(rows) {
const [head, ...body] = rows;
return h("div", { class: "md-table" }, h("table", {}, h("thead", {}, h("tr", {}, ...head.map((c) => h("th", {}, ...inline(c))))), h("tbody", {}, ...body.map((r) => h("tr", {}, ...r.map((c) => h("td", {}, ...inline(c))))))));
}
const inlineToken = /`([^`]+)`|\*\*(.+?)\*\*|__(.+?)__|\*([^*\s][^*]*?)\*|(?<![\w])_([^_\s][^_]*?)_(?![\w])|\[([^\]]+)\]\(([^)\s]+)\)|(https?:\/\/[^\s<>()]+[^\s<>().,;:!?'"])/;
function inline(src) {
const out = [];
let rest = src;
while (rest.length > 0) {
const m = inlineToken.exec(rest);
if (!m) {
out.push(document.createTextNode(rest));
break;
}
if (m.index > 0) {
out.push(document.createTextNode(rest.slice(0, m.index)));
}
const [whole, code, strong1, strong2, em1, em2, linkText, linkHref, bare] = m;
if (code !== undefined) {
out.push(h("code", {}, code));
}
else if (strong1 !== undefined || strong2 !== undefined) {
out.push(h("strong", {}, ...inline(strong1 ?? strong2)));
}
else if (em1 !== undefined || em2 !== undefined) {
out.push(h("em", {}, ...inline(em1 ?? em2)));
}
else if (linkText !== undefined) {
out.push(link(linkHref, inline(linkText)));
}
else if (bare !== undefined) {
out.push(link(bare, [document.createTextNode(bare)]));
}
rest = rest.slice(m.index + whole.length);
}
return out;
}
function link(href, children) {
if (/^https?:\/\//i.test(href)) {
return h("a", { href, target: "_blank", rel: "noopener noreferrer" }, ...children);
}
if (href.startsWith("#/")) {
return h("a", { href }, ...children);
}
return h("span", {}, ...children);
}
//# sourceMappingURL=markdown.js.map