@bendyline/squisq-formats 2.6.16 → 2.6.18

package/dist/{chunk-TLDBJH7D.js → chunk-JY3T4KOP.js}

@@ -285,8 +285,11 @@ function escapeHtml(str) {
 
 // src/html/plainHtml.ts
 import {
+  findBlockVideoEmbed,
   sanitizeHtmlNodes,
   sanitizeUrl,
+  videoEmbedFromIframe,
+  videoEmbedIframeAttributes,
   readFrontmatterThemeId as readFrontmatterThemeId2
 } from "@bendyline/squisq/markdown";
 import { resolveFontFamily, buildGoogleFontsUrl } from "@bendyline/squisq/schemas";
@@ -299,12 +302,13 @@ function markdownDocToPlainHtml(doc, options = {}) {
     themeId,
     iconsCss,
     htmlPolicy = "sanitize",
-    externalResources = "deny"
+    externalResources = "deny",
+    videoEmbeds
   } = options;
   const resolveId = themeId ?? readFrontmatterThemeId2(doc.frontmatter);
   const theme = options.theme ?? (resolveId ? resolveThemeForDoc(doc, resolveId, options.themeRegistry) : void 0);
   const footnotes = new FootnoteIndex(doc);
-  const ctx = { images, links, htmlPolicy, footnotes };
+  const ctx = { images, links, htmlPolicy, footnotes, videoEmbeds };
   const body = renderTopLevel(doc.children, ctx) + renderFootnotesSection(footnotes, ctx);
   const fontsLink = theme && externalResources === "allow" ? renderFontsLink(theme) : "";
   const usesIcons = docUsesIcons(doc);
@@ -316,8 +320,10 @@ ${escapeStyleText(iconsCss)}
 ` : externalResources === "allow" ? FONT_AWESOME_LINK : "";
   }
   const themedCss = theme ? renderThemedCss(theme) : DEFAULT_CSS;
+  const videoCss = docUsesVideoEmbeds(doc, htmlPolicy) ? `
+${VIDEO_EMBED_CSS}` : "";
   const safeCss = escapeStyleText(`${themedCss}
-${FEATURE_CSS}`);
+${FEATURE_CSS}${videoCss}`);
   return `<!DOCTYPE html>
 <html lang="en">
 <head>
@@ -350,6 +356,22 @@ function docUsesIcons(doc) {
   }
   return visit(doc);
 }
+function docUsesVideoEmbeds(doc, htmlPolicy) {
+  const iframeIn = (nodes) => nodes.some(
+    (node) => node.type === "htmlElement" && (videoEmbedFromIframe(node) !== null || iframeIn(node.children))
+  );
+  const visit = (node) => {
+    if (!node || typeof node !== "object") return false;
+    const n = node;
+    if (htmlPolicy !== "strip" && Array.isArray(n.htmlChildren) && iframeIn(n.htmlChildren)) {
+      return true;
+    }
+    return Array.isArray(n.children) && n.children.some(visit);
+  };
+  return doc.children.some(
+    (node) => node.type === "paragraph" && findBlockVideoEmbed(node) !== null || visit(node)
+  );
+}
 function renderTopLevel(children, ctx) {
   const out = [];
   for (let i = 0; i < children.length; i++) {
@@ -365,6 +387,11 @@ function renderTopLevel(children, ctx) {
         continue;
       }
     }
+    const video = node && node.type === "paragraph" ? findBlockVideoEmbed(node) : null;
+    if (video) {
+      out.push(videoEmbedToHtml(video.embed, video.title, ctx));
+      continue;
+    }
     out.push(nodeToHtml(node, ctx));
   }
   return out.join("\n");
@@ -541,7 +568,8 @@ var FEATURE_CSS = `  .squisq-feature {
     .squisq-feature, .squisq-feature--right { flex-direction: column; }
     .squisq-feature__media { flex-basis: auto; width: 100%; }
   }`;
-var DEFAULT_CSS = `  body { font-family: system-ui, -apple-system, sans-serif; max-width: 800px; margin: 2em auto; padding: 0 1em; line-height: 1.6; color: #1f2937; }
+var DEFAULT_CSS = `  :root { color-scheme: light; }
+  body { font-family: system-ui, -apple-system, sans-serif; max-width: 800px; margin: 2em auto; padding: 0 1em; line-height: 1.6; color: #1f2937; background: #fff; }
   h1, h2, h3, h4, h5, h6 { margin-top: 1.5em; margin-bottom: 0.5em; }
   pre { background: #f3f4f6; padding: 1em; border-radius: 4px; overflow-x: auto; }
   code { background: #f3f4f6; padding: 0.15em 0.3em; border-radius: 3px; font-size: 0.9em; }
@@ -735,9 +763,12 @@ function nodeToHtml(node, ctx) {
       return `<i class="fa-${family} fa-${name}" data-icon="${token}" aria-hidden="true"></i>`;
     }
     case "htmlBlock":
-    case "htmlInline":
+    case "htmlInline": {
       if (resolveHtmlPolicy(ctx) === "strip") return "";
+      const video = node.type === "htmlBlock" ? findBlockVideoEmbed(node) : null;
+      if (video) return videoEmbedToHtml(video.embed, video.title, ctx);
       return htmlChildrenToHtml(resolveHtmlNodes(node.htmlChildren, ctx), ctx);
+    }
     default: {
       const withChildren = node;
       if (Array.isArray(withChildren.children)) {
@@ -799,6 +830,13 @@ function htmlChildrenToHtml(nodes, ctx) {
       continue;
     }
     const tag = node.tagName.toLowerCase();
+    if (tag === "iframe") {
+      const video = videoEmbedFromIframe(node);
+      if (video) {
+        out.push(videoEmbedToHtml(video.embed, video.title, ctx, true));
+        continue;
+      }
+    }
     const attrs = { ...node.attributes };
     if ((tag === "img" || tag === "video" || tag === "audio" || tag === "source") && typeof attrs.src === "string") {
       attrs.src = ctx?.images?.get(attrs.src) ?? attrs.src;
@@ -832,6 +870,32 @@ function htmlChildrenToHtml(nodes, ctx) {
   }
   return out.join("");
 }
+function videoEmbedToHtml(embed, title, ctx, inline = false) {
+  const root = inline ? "span" : "figure";
+  const orientation = embed.aspectRatio < 1 ? "portrait" : "landscape";
+  const ratio = `aspect-ratio: ${embed.aspectRatio < 1 ? "9 / 16" : "16 / 9"}`;
+  const watchUrl = escapeAttr(embed.watchUrl);
+  let frame;
+  if (ctx?.videoEmbeds === "poster") {
+    const label = title ? `Watch \u201C${title}\u201D on ${embed.providerName}` : `Watch on ${embed.providerName}`;
+    const thumbnail = embed.thumbnailUrl ? `<img src="${escapeAttr(embed.thumbnailUrl)}" alt="" loading="lazy" />` : "";
+    frame = `<a class="squisq-video-embed-frame squisq-video-embed-poster" href="${watchUrl}" style="${ratio}" aria-label="${escapeAttr(label)}">${thumbnail}<span class="squisq-video-embed-play" aria-hidden="true"></span><span class="squisq-video-embed-provider" aria-hidden="true">${escapeHtml2(embed.providerName)}</span></a>`;
+  } else {
+    const attrs = Object.entries(videoEmbedIframeAttributes(embed, title)).map(([name, value]) => value === "" ? ` ${name}` : ` ${name}="${escapeAttr(value)}"`).join("");
+    frame = `<span class="squisq-video-embed-frame" style="${ratio}"><iframe${attrs}></iframe></span>`;
+  }
+  const caption = title && !inline ? `<figcaption class="squisq-video-embed-caption"><a href="${watchUrl}">${escapeHtml2(title)}</a></figcaption>` : "";
+  return `<${root} class="squisq-video-embed" data-provider="${embed.provider}" data-orientation="${orientation}">${frame}${caption}</${root}>`;
+}
+var VIDEO_EMBED_CSS = `  .squisq-video-embed { display: block; max-width: 720px; margin: 1.25em 0; }
+  .squisq-video-embed[data-orientation="portrait"] { max-width: 340px; }
+  .squisq-video-embed-frame { position: relative; display: block; overflow: hidden; border-radius: 6px; background: #000; }
+  .squisq-video-embed-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
+  .squisq-video-embed-poster img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
+  .squisq-video-embed-play { position: absolute; left: 50%; top: 50%; width: 64px; height: 44px; margin: -22px 0 0 -32px; border-radius: 12px; background: rgba(0, 0, 0, 0.72); }
+  .squisq-video-embed-play::after { content: ''; position: absolute; left: 26px; top: 12px; border-style: solid; border-width: 10px 0 10px 16px; border-color: transparent transparent transparent #fff; }
+  .squisq-video-embed-provider { position: absolute; left: 12px; bottom: 10px; color: #fff; font-size: 0.8em; font-weight: 600; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8); }
+  .squisq-video-embed-caption { margin-top: 0.4em; font-size: 0.875em; opacity: 0.8; }`;
 function escapeHtml2(s) {
   return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
 }
@@ -1301,7 +1365,8 @@ function titleForDoc(path, mdDoc) {
 import {
   parseHtmlToNodes,
   sanitizeHtmlNodes as sanitizeHtmlNodes2,
-  stringifyMarkdown
+  stringifyMarkdown,
+  videoEmbedFromIframe as videoEmbedFromIframe2
 } from "@bendyline/squisq/markdown";
 import { docToMarkdown } from "@bendyline/squisq/doc";
 
@@ -1532,6 +1597,151 @@ var INLINE_TRANSPARENT = /* @__PURE__ */ new Set(["span", "font", "abbr", "mark"
 var isElement2 = (n) => n.type === "htmlElement";
 var isText = (n) => n.type === "htmlText";
 var collapseWs = (s) => s.replace(/\s+/g, " ");
+var HEAD_METADATA_MAX_CHARS = 1024;
+function headMetadataValue(raw) {
+  const value = collapseWs(raw.replace(/[\u0000-\u001f\u007f]/g, " ")).trim();
+  return value ? value.slice(0, HEAD_METADATA_MAX_CHARS) : void 0;
+}
+function readHeadMetadata(nodes) {
+  const metadata = {};
+  const visit = (list) => {
+    for (const node of list) {
+      if (!isElement2(node)) continue;
+      const tag = node.tagName.toLowerCase();
+      if (tag === "html" || tag === "head") {
+        visit(node.children);
+      } else if (tag === "title" && metadata.title === void 0) {
+        const title = headMetadataValue(textContent(node));
+        if (title) metadata.title = title;
+      } else if (tag === "meta" && metadata.description === void 0 && node.attributes.name?.toLowerCase() === "description") {
+        const description = headMetadataValue(node.attributes.content ?? "");
+        if (description) metadata.description = description;
+      }
+    }
+  };
+  visit(nodes);
+  return metadata;
+}
+function dropContentlessElements(nodes) {
+  return nodes.flatMap((node) => {
+    if (!isElement2(node)) return [node];
+    if (DROP.has(node.tagName.toLowerCase())) return [];
+    return [{ ...node, children: dropContentlessElements(node.children) }];
+  });
+}
+var INLINE_PARENT_TYPES = /* @__PURE__ */ new Set([
+  "strong",
+  "emphasis",
+  "delete",
+  "link",
+  "superscript",
+  "subscript"
+]);
+var isInlineParent = (node) => INLINE_PARENT_TYPES.has(node.type);
+function trimRunEnd(run) {
+  for (let last = run[run.length - 1]; last?.type === "text"; last = run[run.length - 1]) {
+    const value = last.value.replace(/ +$/, "");
+    if (value) {
+      run[run.length - 1] = { ...last, value };
+      return;
+    }
+    run.pop();
+  }
+}
+function mergeAdjacentText(run) {
+  const out = [];
+  for (const node of run) {
+    const previous = out[out.length - 1];
+    if (node.type === "text" && previous?.type === "text") {
+      out[out.length - 1] = { ...previous, value: previous.value + node.value };
+    } else if (isInlineParent(node)) {
+      out.push({ ...node, children: mergeAdjacentText(node.children) });
+    } else {
+      out.push(node);
+    }
+  }
+  return out;
+}
+function normalizeInlineWhitespace(inlines) {
+  const state = { spaced: true };
+  const walk = (run) => {
+    const out2 = [];
+    for (const node of run) {
+      if (node.type === "text") {
+        const value = state.spaced ? node.value.replace(/^ +/, "") : node.value;
+        if (!value) continue;
+        out2.push({ ...node, value });
+        state.spaced = value.endsWith(" ");
+      } else if (node.type === "break") {
+        trimRunEnd(out2);
+        out2.push(node);
+        state.spaced = true;
+      } else if (isInlineParent(node)) {
+        const children = walk(node.children);
+        const first = children[0];
+        if (first?.type === "text" && first.value.startsWith(" ")) {
+          const value = first.value.replace(/^ +/, "");
+          if (value) children[0] = { ...first, value };
+          else children.shift();
+          out2.push({ type: "text", value: " " });
+        }
+        const last = children[children.length - 1];
+        const trailing = last?.type === "text" && last.value.endsWith(" ");
+        if (trailing) trimRunEnd(children);
+        if (children.length > 0) {
+          out2.push({ ...node, children });
+        } else if (node.type === "link") {
+          out2.push({ ...node, children: [{ type: "text", value: node.url }] });
+        }
+        if (trailing) {
+          out2.push({ type: "text", value: " " });
+          state.spaced = true;
+        } else if (children.length > 0 || node.type === "link") {
+          state.spaced = false;
+        }
+      } else {
+        out2.push(node);
+        state.spaced = false;
+      }
+    }
+    return out2;
+  };
+  const out = walk(inlines);
+  trimRunEnd(out);
+  return mergeAdjacentText(out);
+}
+var blockInlines = (nodes) => normalizeInlineWhitespace(inlinesFromNodes(nodes));
+function appendMarkedInlines(output, type, input) {
+  const children = [...input];
+  let leading = "";
+  let trailing = "";
+  while (children[0]?.type === "text") {
+    const first = children[0];
+    const space = /^ +/.exec(first.value)?.[0] ?? "";
+    if (!space) break;
+    leading += space;
+    if (space.length === first.value.length) children.shift();
+    else {
+      children[0] = { ...first, value: first.value.slice(space.length) };
+      break;
+    }
+  }
+  while (children[children.length - 1]?.type === "text") {
+    const last = children[children.length - 1];
+    if (last.type !== "text") break;
+    const space = / +$/.exec(last.value)?.[0] ?? "";
+    if (!space) break;
+    trailing = space + trailing;
+    if (space.length === last.value.length) children.pop();
+    else {
+      children[children.length - 1] = { ...last, value: last.value.slice(0, -space.length) };
+      break;
+    }
+  }
+  if (leading) output.push({ type: "text", value: leading });
+  if (children.length) output.push({ type, children });
+  if (trailing) output.push({ type: "text", value: trailing });
+}
 function inlinesFromNodes(nodes) {
   const out = [];
   for (const node of nodes) {
@@ -1546,11 +1756,11 @@ function inlinesFromNodes(nodes) {
     if (tag === "br") {
       out.push({ type: "break" });
     } else if (INLINE_STRONG.has(tag)) {
-      out.push({ type: "strong", children: inlinesFromNodes(node.children) });
+      appendMarkedInlines(out, "strong", inlinesFromNodes(node.children));
     } else if (INLINE_EM.has(tag)) {
-      out.push({ type: "emphasis", children: inlinesFromNodes(node.children) });
+      appendMarkedInlines(out, "emphasis", inlinesFromNodes(node.children));
     } else if (INLINE_DEL.has(tag)) {
-      out.push({ type: "delete", children: inlinesFromNodes(node.children) });
+      appendMarkedInlines(out, "delete", inlinesFromNodes(node.children));
     } else if (INLINE_SUP.has(tag)) {
       out.push({ type: "superscript", children: inlinesFromNodes(node.children) });
     } else if (INLINE_SUB.has(tag)) {
@@ -1580,17 +1790,14 @@ function textContent(node) {
   if (isElement2(node)) return node.children.map(textContent).join("");
   return "";
 }
-var onlyWhitespace = (inlines) => inlines.every((n) => n.type === "text" && n.value.trim() === "");
 function blocksFromNodes(nodes) {
   const out = [];
   let inlineBuffer = [];
   const flush = () => {
     if (inlineBuffer.length === 0) return;
-    const inlines = inlinesFromNodes(inlineBuffer);
+    const inlines = blockInlines(inlineBuffer);
     inlineBuffer = [];
-    if (inlines.length > 0 && !onlyWhitespace(inlines)) {
-      out.push({ type: "paragraph", children: inlines });
-    }
+    if (inlines.length > 0) out.push({ type: "paragraph", children: inlines });
   };
   for (const node of nodes) {
     if (isText(node)) {
@@ -1613,15 +1820,26 @@ function blocksFromNodes(nodes) {
 }
 function blockForElement(node, tag) {
   if (tag in HEADINGS) {
-    const children = inlinesFromNodes(node.children);
+    const children = blockInlines(node.children);
     return [{ type: "heading", depth: HEADINGS[tag], children }];
   }
   if (tag === "p") {
-    const children = inlinesFromNodes(node.children);
-    return children.length > 0 && !onlyWhitespace(children) ? [{ type: "paragraph", children }] : [];
+    const children = blockInlines(node.children);
+    return children.length > 0 ? [{ type: "paragraph", children }] : [];
   }
   if (tag === "br") return "inline";
   if (tag === "hr") return [{ type: "thematicBreak" }];
+  if (tag === "iframe") {
+    const video = videoEmbedFromIframe2(node);
+    if (!video) return [];
+    const url = video.embed.watchUrl;
+    return [
+      {
+        type: "paragraph",
+        children: [{ type: "link", url, children: [{ type: "text", value: video.title ?? url }] }]
+      }
+    ];
+  }
   if (tag === "blockquote") {
     return [{ type: "blockquote", children: blocksFromNodes(node.children) }];
   }
@@ -1670,7 +1888,7 @@ function tableFromElement(node) {
         const cells = [];
         for (const cell of child.children) {
           if (isElement2(cell) && (cell.tagName.toLowerCase() === "td" || cell.tagName.toLowerCase() === "th")) {
-            cells.push({ type: "tableCell", children: inlinesFromNodes(cell.children) });
+            cells.push({ type: "tableCell", children: blockInlines(cell.children) });
           }
         }
         if (cells.length > 0) rows.push({ type: "tableRow", children: cells });
@@ -1728,7 +1946,12 @@ function htmlToMarkdownDocSync(html, options = {}) {
   const nodes = parseHtmlToNodes(html);
   const embedded = findEmbeddedSquisqDoc(nodes);
   if (embedded) return docToMarkdown(parseEmbeddedSquisqDoc(embedded));
-  const { nodes: bodyNodes, bodies, identifiers } = extractFootnoteSection(nodes);
+  const headMetadata = options.headMetadata === false ? {} : readHeadMetadata(nodes);
+  const {
+    nodes: bodyNodes,
+    bodies,
+    identifiers
+  } = extractFootnoteSection(dropContentlessElements(nodes));
   const clean = (input) => options.sanitize === false ? input : sanitizeHtmlNodes2(input);
   const children = blocksFromNodes(clean(bodyNodes));
   if (bodies.size > 0) {
@@ -1737,7 +1960,11 @@ function htmlToMarkdownDocSync(html, options = {}) {
     for (const [id, body] of bodies) definitions.set(id, blocksFromNodes(clean(body)));
     children.push(...buildFootnoteDefinitions(definitions));
   }
-  return { type: "document", children };
+  return {
+    type: "document",
+    children,
+    ...Object.keys(headMetadata).length > 0 ? { frontmatter: headMetadata } : {}
+  };
 }
 async function htmlToMarkdownDoc(data, options = {}) {
   return htmlToMarkdownDocSync(toHtmlString(data), options);

package/dist/{chunk-ZDRSDYXN.js → chunk-VJQZMIXU.js}

@@ -1,3 +1,6 @@
+import {
+  upngEncoder
+} from "./chunk-34KECNZO.js";
 import {
   FootnoteIndex
 } from "./chunk-BXWNU4T5.js";
@@ -1182,20 +1185,6 @@ function hexToRgb(hex) {
 // src/pdf/import.ts
 import { markdownToDoc } from "@bendyline/squisq/doc";
 import { stringifyMarkdown } from "@bendyline/squisq/markdown";
-
-// src/pdf/upng.ts
-import UPNG from "@pdf-lib/upng";
-function isUpngEncoder(value) {
-  return typeof value === "object" && value !== null && "encode" in value && typeof value.encode === "function";
-}
-function resolveUpngEncoder(value) {
-  if (isUpngEncoder(value)) return value;
-  if (typeof value !== "object" || value === null || !("default" in value)) return null;
-  return isUpngEncoder(value.default) ? value.default : null;
-}
-var upngEncoder = resolveUpngEncoder(UPNG);
-
-// src/pdf/import.ts
 async function pdfToMarkdownDoc(data, options = {}) {
   options.signal?.throwIfAborted();
   const bytes = data instanceof Blob ? new Uint8Array(await data.arrayBuffer()) : data instanceof ArrayBuffer ? new Uint8Array(data) : data;