@liquidcars/atlas 0.1.48 → 0.1.49

package/src/panel-content.js

@@ -0,0 +1,84 @@
+const escapeHtml = value => String(value ?? "").replace(/[&<>"']/g, char =>
+  ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" })[char]);
+
+const allowedTags = new Set(["P", "BR", "H1", "H2", "H3", "H4", "UL", "OL", "LI", "STRONG", "EM", "CODE", "PRE", "BLOCKQUOTE", "A", "HR", "TABLE", "THEAD", "TBODY", "TR", "TH", "TD"]);
+
+export function sanitizePanelHtml(html, { title = "" } = {}) {
+  const document = new DOMParser().parseFromString(String(html || ""), "text/html");
+  const first = document.body.firstElementChild;
+  if (first && /^H[1-4]$/.test(first.tagName) && title && first.textContent.trim().toLocaleLowerCase() === String(title).trim().toLocaleLowerCase()) first.remove();
+  // Preserve href values while dropping all event handlers and other attributes.
+  for (const anchor of document.body.querySelectorAll("a")) {
+    const href = anchor.getAttribute("href") || "";
+    anchor.dataset.atlasSafeHref = /^(atlas:|https?:\/\/)/i.test(href) ? href : "";
+  }
+  const walk = node => {
+    for (const child of [...node.children]) {
+      const href = child.tagName === "A" ? child.dataset.atlasSafeHref : "";
+      for (const attribute of [...child.attributes]) child.removeAttribute(attribute.name);
+      if (!allowedTags.has(child.tagName)) {
+        child.replaceWith(...child.childNodes);
+        walk(node);
+        continue;
+      }
+      if (href) {
+        child.setAttribute("href", href);
+        if (/^https?:\/\//i.test(href)) {
+          child.setAttribute("target", "_blank");
+          child.setAttribute("rel", "noopener noreferrer");
+        }
+      }
+      walk(child);
+    }
+  };
+  walk(document.body);
+  return document.body.innerHTML;
+}
+
+function inlineMarkdown(source) {
+  const escaped = escapeHtml(source);
+  return escaped
+    .replace(/`([^`]+)`/g, "<code>$1</code>")
+    .replace(/\*\*([^*]+)\*\*/g, "<strong>$1</strong>")
+    .replace(/\*([^*]+)\*/g, "<em>$1</em>")
+    .replace(/\[([^\]]+)\]\((atlas:[^)]+|https?:\/\/[^)]+)\)/g, '<a href="$2">$1</a>');
+}
+
+export function renderPanelContent(content, options = {}) {
+  if (!content || typeof content !== "object") return "";
+  if (content.format === "html") return sanitizePanelHtml(content.value || "", options);
+  if (content.format !== "markdown") return "";
+  const blocks = [];
+  let list = [];
+  let listKind = "ul";
+  let code = [];
+  let inCode = false;
+  const flushList = () => {
+    if (list.length) blocks.push("<" + listKind + ">" + list.map(line => "<li>" + inlineMarkdown(line) + "</li>").join("") + "</" + listKind + ">");
+    list = [];
+  };
+  for (const line of String(content.value || "").split(/\r?\n/)) {
+    if (/^\s*```/.test(line)) {
+      flushList();
+      if (inCode) { blocks.push("<pre><code>" + escapeHtml(code.join("\n")) + "</code></pre>"); code = []; }
+      inCode = !inCode;
+    } else if (inCode) code.push(line);
+    else if (/^\s*([-*]|\d+\.) /.test(line)) {
+      const kind = /^\s*\d+\./.test(line) ? "ol" : "ul";
+      if (listKind !== kind) flushList();
+      listKind = kind;
+      list.push(line.replace(/^\s*([-*]|\d+\.) /, ""));
+    }
+    else {
+      flushList();
+      if (!line.trim()) continue;
+      if (/^\s*---+\s*$/.test(line)) { blocks.push("<hr>"); continue; }
+      if (/^>\s?/.test(line)) { blocks.push("<blockquote>" + inlineMarkdown(line.replace(/^>\s?/, "")) + "</blockquote>"); continue; }
+      const heading = /^(#{1,4})\s+(.+)$/.exec(line);
+      blocks.push(heading ? `<h${heading[1].length}>${inlineMarkdown(heading[2])}</h${heading[1].length}>` : "<p>" + inlineMarkdown(line) + "</p>");
+    }
+  }
+  flushList();
+  if (code.length) blocks.push("<pre><code>" + escapeHtml(code.join("\n")) + "</code></pre>");
+  return sanitizePanelHtml(blocks.join(""), options);
+}