@bendyline/squisq 2.12.0 → 2.12.2

package/dist/{chunk-W45PAVYE.js → chunk-5VFC5T4N.js}

@@ -1,19 +1,33 @@
 import {
+  asciiDiagramToTemplateData,
+  asciiTimelineToTemplateData,
+  autoTemplatePreservesContent,
+  computeDiagramLayout,
+  deriveTemplateInputs,
   detectAsciiDiagram,
   detectAsciiTimeline,
   detectTree,
+  extractEmbeddedVideos,
+  extractHostedVideos,
+  extractImages,
+  extractRichListItems,
+  extractTableFromContents,
   isEligibleAsciiFenceLang,
   isEligibleAsciiTimelineFenceLang,
   isEligibleTreeFenceLang,
   isExplicitDiagramLang,
   isExplicitTimelineLang,
   isExplicitTreeLang,
-  matchNumberHighlight,
+  isMaterializedMediaNode,
+  isPictureFence,
+  markdownBlockSeparatorLines,
   parseAsciiDiagram,
   parseAsciiTimeline,
   pickAutoTemplate,
-  profileBlockContents
-} from "./chunk-B3AFOXMA.js";
+  profileBlockContents,
+  renderMarkdownBlocksHtml,
+  treeToTemplateData
+} from "./chunk-MPEGJKFJ.js";
 import {
   anchorPoint,
   base64ToUtf8,
@@ -43,37 +57,37 @@ import {
   validateCustomTemplateDefinition,
   validateTheme,
   withAlpha
-} from "./chunk-I4L4GYDN.js";
+} from "./chunk-HYJ63N6V.js";
 import {
   mediaEditValuesFromAttributes,
   mediaEditValuesFromParams,
   parseMediaEdits
 } from "./chunk-L7QZORLB.js";
 import {
-  KNOWN_BLOCK_META_KEYS,
   TABLE_FED_TEMPLATES,
-  coerceAnnotationValues,
   isContainerTemplate,
   matchTrailingTemplateAnnotation,
-  parseNumber,
-  parseTimeSeconds,
   resolveTemplateName,
-  sanitizeUrl,
   splitKeyValueToken,
   tokenizeAttrTokens
-} from "./chunk-ZYWYSM6W.js";
+} from "./chunk-Y25EJEZN.js";
 import {
+  KNOWN_BLOCK_META_KEYS,
+  coerceAnnotationValues,
   extractPlainText,
-  findBlockVideoEmbed,
+  isSvgIslandLang,
   isVideoEmbedUrl,
   mediaKindForUrl,
+  parseNumber,
+  parseSvgIsland,
+  parseTimeSeconds,
   parseVideoEmbedUrl,
   readFrontmatterThemeId,
   walkMarkdownTree
-} from "./chunk-NNJA7ICB.js";
+} from "./chunk-MWSGNEH6.js";
 import {
   resolveBlockTransition
-} from "./chunk-M6YXFNGO.js";
+} from "./chunk-P53Z4RYC.js";
 import {
   estimateReadingTime,
   estimateSpokenWordCount
@@ -1281,6 +1295,11 @@ function sectionHeader(input, context) {
 var BIG_TEXT_LINE_HEIGHT = 1.05;
 var BIG_TEXT_WIDTH_FRACTION = 0.92;
 var BIG_TEXT_HEIGHT_FRACTION = 0.86;
+var BIG_TEXT_BANDS = {
+  center: { y: 0.5, height: BIG_TEXT_HEIGHT_FRACTION },
+  upper: { y: 0.3, height: 0.44 },
+  lower: { y: 0.7, height: 0.44 }
+};
 var BIG_TEXT_CHAR_WIDTH = 0.62;
 var BIG_TEXT_MIN_PX = 48;
 function wrappedLineCount(wordLengths, charsPerLine) {
@@ -1297,9 +1316,9 @@ function wrappedLineCount(wordLengths, charsPerLine) {
   }
   return lines;
 }
-function fitBigTextSize(title, viewport) {
+function fitBigTextSize(title, viewport, heightFraction = BIG_TEXT_HEIGHT_FRACTION) {
   const availWidth = viewport.width * BIG_TEXT_WIDTH_FRACTION;
-  const availHeight = viewport.height * BIG_TEXT_HEIGHT_FRACTION;
+  const availHeight = viewport.height * heightFraction;
   const wordLengths = title.trim().split(/\s+/).filter(Boolean).map((word) => word.length);
   if (wordLengths.length === 0) return Math.floor(availHeight / BIG_TEXT_LINE_HEIGHT);
   const longestWord = Math.max(...wordLengths);
@@ -1321,15 +1340,16 @@ function fitBigTextSize(title, viewport) {
   }
   return Math.floor(low);
 }
-function bigTextBloom(background) {
-  return `radial-gradient(ellipse at 50% 50%, ${withAlpha(background, 0.92)} 0%, ${withAlpha(background, 0.78)} 38%, ${withAlpha(background, 0.32)} 66%, ${withAlpha(background, 0)} 88%)`;
+function bigTextBloom(background, centerY = 0.5) {
+  return `radial-gradient(ellipse at 50% ${Math.round(centerY * 100)}%, ${withAlpha(background, 0.92)} 0%, ${withAlpha(background, 0.78)} 38%, ${withAlpha(background, 0.32)} 66%, ${withAlpha(background, 0)} 88%)`;
 }
 function bigText(input, context) {
   const { title = "", imageSrc, imageAlt, ambientMotion } = input;
   const { theme, viewport } = context;
+  const band = BIG_TEXT_BANDS[input.placement ?? "center"] ?? BIG_TEXT_BANDS.center;
   const treatment = themedImageTreatment(context, input.imageTreatment);
   const displayTitle = title.toUpperCase();
-  const titleFontSize = fitBigTextSize(displayTitle, viewport);
+  const titleFontSize = fitBigTextSize(displayTitle, viewport, band.height);
   const layers = [];
   if (imageSrc) {
     layers.push(
@@ -1354,7 +1374,7 @@ function bigText(input, context) {
         id: "bigtext-bloom",
         content: {
           shape: "rect",
-          fill: bigTextBloom(theme.colors.background)
+          fill: bigTextBloom(theme.colors.background, band.y)
         },
         position: { x: 0, y: 0, width: "100%", height: "100%" }
       }
@@ -1375,7 +1395,7 @@ function bigText(input, context) {
         id: "bigtext-tint",
         content: {
           shape: "rect",
-          fill: `radial-gradient(ellipse at 50% 50%, ${withAlpha(theme.colors.primary, 0.38)} 0%, ${withAlpha(theme.colors.primary, 0.14)} 48%, ${withAlpha(theme.colors.primary, 0)} 78%)`
+          fill: `radial-gradient(ellipse at 50% ${Math.round(band.y * 100)}%, ${withAlpha(theme.colors.primary, 0.38)} 0%, ${withAlpha(theme.colors.primary, 0.14)} 48%, ${withAlpha(theme.colors.primary, 0)} 78%)`
         },
         position: { x: 0, y: 0, width: "100%", height: "100%" }
       }
@@ -1399,1008 +1419,16 @@ function bigText(input, context) {
     },
     position: {
       x: "50%",
-      y: "50%",
+      y: `${band.y * 100}%`,
       anchor: "center",
       width: `${BIG_TEXT_WIDTH_FRACTION * 100}%`,
-      height: `${BIG_TEXT_HEIGHT_FRACTION * 100}%`
+      height: `${band.height * 100}%`
     },
     animation: motionEntrance(context, { type: "fadeIn", duration: 1 })
   });
   return layers;
 }
 
-// src/doc/templates/diagramLayout.ts
-var DEFAULT_OPTS = {
-  gapX: 260,
-  gapY: 140,
-  gridPad: 80,
-  gridOriginX: 80,
-  gridOriginY: 80
-};
-function computeDiagramLayout(children, options = {}) {
-  const opts = { ...DEFAULT_OPTS, ...options };
-  const warnings = [];
-  const entries = [];
-  const unpositionedIdx = [];
-  for (let i = 0; i < children.length; i++) {
-    const c = children[i];
-    const hasX = typeof c.x === "number";
-    const hasY = typeof c.y === "number";
-    if (hasX && hasY) {
-      entries.push({ child: c, pinned: true, x: c.x, y: c.y });
-    } else {
-      entries.push({ child: c, pinned: false, x: 0, y: 0 });
-      unpositionedIdx.push(i);
-    }
-  }
-  if (unpositionedIdx.length > 0) {
-    const cols = Math.max(1, Math.ceil(Math.sqrt(unpositionedIdx.length)));
-    let baseX = opts.gridOriginX;
-    let baseY = opts.gridOriginY;
-    const pinned = entries.filter((e) => e.pinned);
-    if (pinned.length > 0) {
-      const minX = Math.min(...pinned.map((e) => e.x));
-      const maxY = Math.max(...pinned.map((e) => e.y));
-      baseX = minX;
-      baseY = maxY + opts.gridPad + opts.gapY;
-    }
-    unpositionedIdx.forEach((entryIdx, k) => {
-      const col = k % cols;
-      const row = Math.floor(k / cols);
-      entries[entryIdx].x = baseX + col * opts.gapX;
-      entries[entryIdx].y = baseY + row * opts.gapY;
-    });
-  }
-  const nodes = entries.map((e) => ({
-    id: e.child.id,
-    label: e.child.title ?? e.child.id,
-    x: e.x,
-    y: e.y,
-    pinned: e.pinned,
-    ...e.child.classes && e.child.classes.length > 0 ? { classes: e.child.classes } : {}
-  }));
-  const nodeIds = new Set(nodes.map((n) => n.id));
-  const edges = [];
-  const seenEdgeIds = /* @__PURE__ */ new Set();
-  for (const child of children) {
-    if (!child.connectsTo) continue;
-    for (const conn of child.connectsTo) {
-      if (!nodeIds.has(conn.target)) {
-        warnings.push(`Edge from "${child.id}" to "${conn.target}" dropped: no such sibling node`);
-        continue;
-      }
-      const edgeId = makeEdgeId(child.id, conn);
-      if (seenEdgeIds.has(edgeId)) continue;
-      seenEdgeIds.add(edgeId);
-      edges.push({
-        id: edgeId,
-        source: child.id,
-        target: conn.target,
-        ...conn.type ? { type: conn.type } : {}
-      });
-    }
-  }
-  return { nodes, edges, warnings };
-}
-function makeEdgeId(source, conn) {
-  return conn.type ? `${source}->${conn.target}:${conn.type}` : `${source}->${conn.target}`;
-}
-
-// src/doc/asciiDiagram/types.ts
-var ASCII_CHAR_W = 14;
-var ASCII_CHAR_H = 28;
-
-// src/doc/asciiDiagram/mapping.ts
-function asciiCellToCanvas(col, row) {
-  return { x: col * ASCII_CHAR_W, y: row * ASCII_CHAR_H };
-}
-function canvasToAsciiCell(x, y) {
-  return {
-    col: Math.max(0, Math.round(x / ASCII_CHAR_W)),
-    row: Math.max(0, Math.round(y / ASCII_CHAR_H))
-  };
-}
-function asciiDiagramToTemplateData(diagram) {
-  const nodes = diagram.nodes.map((n) => ({
-    id: n.id,
-    label: n.label,
-    ...asciiCellToCanvas(n.col, n.row),
-    w: n.wCols * ASCII_CHAR_W,
-    h: n.hRows * ASCII_CHAR_H,
-    ...n.containerId ? { container: n.containerId } : {}
-  }));
-  const anchors = inferEdgeAnchors(nodes, diagram.edges);
-  const edges = diagram.edges.map((e, index) => ({
-    source: e.source,
-    target: e.target,
-    ...e.label ? { label: e.label } : {},
-    ...e.directed ? {} : { directed: false },
-    ...anchors[index],
-    routing: "orthogonal"
-  }));
-  return { nodes, edges };
-}
-function inferEdgeAnchors(nodes, edges) {
-  const nodeById = new Map(nodes.map((node) => [node.id, node]));
-  const pairs = edges.map((edge) => {
-    const source = nodeById.get(edge.source);
-    const target = nodeById.get(edge.target);
-    if (!source || !target) {
-      return {
-        sourceAnchor: { side: "right", offset: 0.5 },
-        targetAnchor: { side: "left", offset: 0.5 }
-      };
-    }
-    const sourceW = source.w ?? ASCII_CHAR_W * 12;
-    const sourceH = source.h ?? ASCII_CHAR_H * 3;
-    const targetW = target.w ?? ASCII_CHAR_W * 12;
-    const targetH = target.h ?? ASCII_CHAR_H * 3;
-    const dx = target.x + targetW / 2 - (source.x + sourceW / 2);
-    const dy = target.y + targetH / 2 - (source.y + sourceH / 2);
-    const horizontalDistance = Math.abs(dx) / Math.max(1, (sourceW + targetW) / 2);
-    const verticalDistance = Math.abs(dy) / Math.max(1, (sourceH + targetH) / 2);
-    if (verticalDistance >= horizontalDistance) {
-      return dy >= 0 ? {
-        sourceAnchor: { side: "bottom", offset: 0.5 },
-        targetAnchor: { side: "top", offset: 0.5 }
-      } : {
-        sourceAnchor: { side: "top", offset: 0.5 },
-        targetAnchor: { side: "bottom", offset: 0.5 }
-      };
-    }
-    return dx >= 0 ? {
-      sourceAnchor: { side: "right", offset: 0.5 },
-      targetAnchor: { side: "left", offset: 0.5 }
-    } : {
-      sourceAnchor: { side: "left", offset: 0.5 },
-      targetAnchor: { side: "right", offset: 0.5 }
-    };
-  });
-  distributeOffsets(pairs, edges, nodes, "source");
-  distributeOffsets(pairs, edges, nodes, "target");
-  coalesceAlignedFanOutAnchors(pairs, edges, nodes);
-  return pairs;
-}
-function coalesceAlignedFanOutAnchors(pairs, edges, nodes) {
-  const nodeById = new Map(nodes.map((node) => [node.id, node]));
-  const groups = /* @__PURE__ */ new Map();
-  edges.forEach((edge, index) => {
-    const group = groups.get(edge.source) ?? [];
-    group.push(index);
-    groups.set(edge.source, group);
-  });
-  for (const [sourceId, indexes] of groups) {
-    if (indexes.length < 2) continue;
-    const source = nodeById.get(sourceId);
-    const targets = indexes.map((index) => nodeById.get(edges[index].target)).filter((node) => node !== void 0);
-    if (!source || targets.length !== indexes.length) continue;
-    const sourceW = source.w ?? ASCII_CHAR_W * 12;
-    const sourceH = source.h ?? ASCII_CHAR_H * 3;
-    const sourceRight = source.x + sourceW;
-    const sourceBottom = source.y + sourceH;
-    const targetRight = (target) => target.x + (target.w ?? ASCII_CHAR_W * 12);
-    const targetBottom = (target) => target.y + (target.h ?? ASCII_CHAR_H * 3);
-    let sourceSide;
-    let targetSide;
-    if (targets.every((target) => target.y >= sourceBottom)) {
-      sourceSide = "bottom";
-      targetSide = "top";
-    } else if (targets.every((target) => targetBottom(target) <= source.y)) {
-      sourceSide = "top";
-      targetSide = "bottom";
-    } else if (targets.every((target) => target.x >= sourceRight)) {
-      sourceSide = "right";
-      targetSide = "left";
-    } else if (targets.every((target) => targetRight(target) <= source.x)) {
-      sourceSide = "left";
-      targetSide = "right";
-    }
-    if (!sourceSide || !targetSide) continue;
-    for (const index of indexes) {
-      pairs[index] = {
-        sourceAnchor: { side: sourceSide, offset: 0.5 },
-        targetAnchor: { side: targetSide, offset: 0.5 }
-      };
-    }
-  }
-}
-function distributeOffsets(pairs, edges, nodes, endpoint) {
-  const nodeById = new Map(nodes.map((node) => [node.id, node]));
-  const groups = /* @__PURE__ */ new Map();
-  for (let index = 0; index < edges.length; index++) {
-    const edge = edges[index];
-    const anchor = endpoint === "source" ? pairs[index].sourceAnchor : pairs[index].targetAnchor;
-    const nodeId = endpoint === "source" ? edge.source : edge.target;
-    const key = `${nodeId}:${anchor.side}`;
-    const group = groups.get(key) ?? [];
-    group.push(index);
-    groups.set(key, group);
-  }
-  for (const indexes of groups.values()) {
-    if (indexes.length < 2) continue;
-    const side = endpoint === "source" ? pairs[indexes[0]].sourceAnchor.side : pairs[indexes[0]].targetAnchor.side;
-    indexes.sort((a, b) => {
-      const oppositeA = nodeById.get(endpoint === "source" ? edges[a].target : edges[a].source);
-      const oppositeB = nodeById.get(endpoint === "source" ? edges[b].target : edges[b].source);
-      const axisA = side === "top" || side === "bottom" ? oppositeA?.x ?? 0 : oppositeA?.y ?? 0;
-      const axisB = side === "top" || side === "bottom" ? oppositeB?.x ?? 0 : oppositeB?.y ?? 0;
-      return axisA - axisB || a - b;
-    });
-    indexes.forEach((edgeIndex, rank) => {
-      const anchor = endpoint === "source" ? pairs[edgeIndex].sourceAnchor : pairs[edgeIndex].targetAnchor;
-      anchor.offset = (rank + 1) / (indexes.length + 1);
-    });
-  }
-}
-function asciiDiagramFromTemplateData(nodes, edges, options = {}) {
-  const ids = new Set(nodes.map((n) => n.id));
-  const outNodes = nodes.map((n) => {
-    const { col, row } = canvasToAsciiCell(n.x, n.y);
-    const labelLines = n.label.length > 0 ? n.label.split("\n") : [];
-    const innerW = labelLines.reduce((w, l) => Math.max(w, l.length), 0);
-    const wCols = typeof n.w === "number" ? Math.max(3, Math.round(n.w / ASCII_CHAR_W)) : innerW + 4;
-    const hRows = typeof n.h === "number" ? Math.max(3, Math.round(n.h / ASCII_CHAR_H)) : labelLines.length + 2;
-    return {
-      id: n.id,
-      label: n.label,
-      col,
-      row,
-      wCols: Math.max(wCols, 3),
-      hRows: Math.max(hRows, 3),
-      ...n.container && ids.has(n.container) && n.container !== n.id ? { containerId: n.container } : {}
-    };
-  });
-  return {
-    nodes: outNodes,
-    edges: edges.filter((e) => ids.has(e.source) && ids.has(e.target)).map((e) => ({
-      source: e.source,
-      target: e.target,
-      ...e.label ? { label: e.label } : {},
-      directed: e.directed !== false
-    })),
-    style: options.style ?? "unicode",
-    warnings: []
-  };
-}
-function asciiDiagramFromBlocks(children, options = {}) {
-  const layout = computeDiagramLayout(children);
-  const nodes = layout.nodes.map((n) => ({
-    id: n.id,
-    label: n.label,
-    x: n.x,
-    y: n.y
-  }));
-  const edges = layout.edges.map((e) => ({
-    source: e.source,
-    target: e.target,
-    ...e.type ? { label: e.type } : {}
-  }));
-  const diagram = asciiDiagramFromTemplateData(nodes, edges, options);
-  diagram.warnings.push(...layout.warnings);
-  return diagram;
-}
-
-// src/doc/asciiTimeline/mapping.ts
-function asciiTimelineToTemplateData(timeline) {
-  const globalStart = timeline.tracks.length > 0 ? Math.min(...timeline.tracks.map((track) => track.startColumn)) : 0;
-  const globalEnd = timeline.tracks.length > 0 ? Math.max(...timeline.tracks.map((track) => track.endColumn)) : 1;
-  const span = Math.max(1, globalEnd - globalStart);
-  const tracks = timeline.tracks.map((track) => ({
-    id: track.id,
-    ...track.label ? { label: track.label } : {},
-    ...track.endLabel ? { endLabel: track.endLabel } : {},
-    events: track.events.map((event) => ({
-      id: event.id,
-      label: event.label,
-      ...event.description ? { description: event.description } : {},
-      position: clamp01((event.column - globalStart) / span),
-      ...event.side ? { side: event.side } : {},
-      ...event.descriptionSide ? { descriptionSide: event.descriptionSide } : {},
-      ...event.callout === false ? { callout: false } : {},
-      ...event.marker ? { marker: event.marker } : {}
-    }))
-  }));
-  const links = timeline.links.map((link) => ({ ...link }));
-  return { tracks, links };
-}
-function clamp01(value) {
-  return Math.max(0, Math.min(1, value));
-}
-
-// src/doc/treeview/mapping.ts
-function treeToTemplateData(tree) {
-  return { items: tree.roots.map(toItem) };
-}
-function toItem(node) {
-  return {
-    id: node.id,
-    label: node.label,
-    ...node.isDir ? { isDir: true } : {},
-    ...node.comment ? { comment: node.comment } : {},
-    children: node.children.map(toItem)
-  };
-}
-function treeFromTemplateData(items, options = {}) {
-  const roots = items.map(fromItem);
-  return { roots, style: options.style ?? "unicode", warnings: [] };
-}
-function fromItem(item) {
-  const children = Array.isArray(item.children) ? item.children.map(fromItem) : [];
-  return {
-    id: typeof item.id === "string" && item.id ? item.id : "node",
-    label: typeof item.label === "string" ? item.label : "",
-    children,
-    isDir: item.isDir === true || children.length > 0,
-    ...item.comment ? { comment: item.comment } : {}
-  };
-}
-function treeFromMarkdownList(list) {
-  const usedIds = /* @__PURE__ */ new Map();
-  const slugify2 = (s) => s.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "") || "node";
-  const idFor = (label) => {
-    const base = slugify2(label.replace(/\/$/, ""));
-    const count = usedIds.get(base) ?? 0;
-    usedIds.set(base, count + 1);
-    return count === 0 ? base : `${base}-${count + 1}`;
-  };
-  const itemToNode = (item) => {
-    const labelNode = item.children.find((c) => c.type !== "list");
-    const label = labelNode ? extractPlainText(labelNode).trim() : "";
-    const childLists = item.children.filter((c) => c.type === "list");
-    const children = [];
-    for (const cl of childLists) for (const ci of cl.children) children.push(itemToNode(ci));
-    return {
-      id: idFor(label),
-      label,
-      children,
-      isDir: label.endsWith("/") || children.length > 0
-    };
-  };
-  return { roots: list.children.map(itemToNode), style: "unicode", warnings: [] };
-}
-function findFirstList(contents) {
-  return contents?.find((n) => n.type === "list");
-}
-
-// src/doc/templateInputs.ts
-var VIDEO_FILE_RE = /\.(?:webm|mp4|mov|m4v|ogv)(?:[?#].*)?$/i;
-function extractHostedVideos(contents, limit = Infinity) {
-  const found = [];
-  const seen = /* @__PURE__ */ new Set();
-  for (const node of contents ?? []) {
-    if (found.length >= limit) break;
-    const video = findBlockVideoEmbed(node);
-    if (!video || seen.has(video.embed.watchUrl)) continue;
-    seen.add(video.embed.watchUrl);
-    found.push({
-      url: video.embed.watchUrl,
-      title: video.title,
-      aspectRatio: video.embed.aspectRatio
-    });
-  }
-  return found;
-}
-function isMaterializedMediaNode(node) {
-  if (node.type === "code") return node.lang?.trim().toLowerCase() === "mermaid";
-  return findBlockVideoEmbed(node) !== null;
-}
-function extractBodyPlainText(contents) {
-  if (!contents || contents.length === 0) return "";
-  return contents.filter((node) => !isMaterializedMediaNode(node)).map((n) => extractPlainText(n)).join("\n").trim();
-}
-function extractListItems(contents) {
-  return extractRichListItems(contents).map((item) => item.text);
-}
-function escapeInlineHtml(value) {
-  return value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
-}
-function renderInlineHtml(nodes) {
-  return nodes.map((node) => {
-    switch (node.type) {
-      case "text":
-        return escapeInlineHtml(node.value);
-      case "emphasis":
-        return `<em>${renderInlineHtml(node.children)}</em>`;
-      case "strong":
-        return `<strong>${renderInlineHtml(node.children)}</strong>`;
-      case "delete":
-        return `<del>${renderInlineHtml(node.children)}</del>`;
-      case "superscript":
-        return `<sup>${renderInlineHtml(node.children)}</sup>`;
-      case "subscript":
-        return `<sub>${renderInlineHtml(node.children)}</sub>`;
-      case "inlineCode":
-        return `<code>${escapeInlineHtml(node.value)}</code>`;
-      case "link": {
-        const label = renderInlineHtml(node.children);
-        const href = sanitizeUrl(node.url, "link");
-        if (!href) return label;
-        const title = node.title ? ` title="${escapeInlineHtml(node.title)}"` : "";
-        return `<a href="${escapeInlineHtml(href)}"${title}>${label}</a>`;
-      }
-      case "break":
-        return "<br>";
-      case "image":
-        return escapeInlineHtml(node.alt ?? "");
-      case "inlineMath":
-        return escapeInlineHtml(`$${node.value}$`);
-      case "footnoteReference":
-        return escapeInlineHtml(`[^${node.label ?? node.identifier}]`);
-      case "linkReference":
-      case "textDirective":
-        return renderInlineHtml(node.children);
-      case "imageReference":
-        return escapeInlineHtml(node.alt ?? "");
-      case "mention":
-        return escapeInlineHtml(`@${node.displayName}`);
-      case "inlineIcon":
-        return `<i class="fa-${node.family} fa-${node.name}" aria-hidden="true"></i>`;
-      case "htmlInline":
-        return escapeInlineHtml(node.rawHtml);
-    }
-  }).join("");
-}
-function renderMarkdownBlocksHtml(nodes, builds) {
-  const renderBlocks = (blocks) => blocks.map((node, index) => {
-    const previous = blocks[index - 1];
-    const extraBlankLines = previous ? Math.max(0, markdownBlockSeparatorLines(previous, node) - 2) : 0;
-    const sourceGap = '<div data-squisq-source-gap aria-hidden="true"><br></div>'.repeat(
-      extraBlankLines
-    );
-    const html = renderBlock(node);
-    const step = builds?.targets.get(node);
-    return `${sourceGap}${step === void 0 ? html : `<div data-squisq-build-step="${step}">${html}</div>`}`;
-  }).join("");
-  const renderList = (node) => {
-    const tag = node.ordered ? "ol" : "ul";
-    const start = node.ordered && node.start != null ? ` start="${node.start}"` : "";
-    const items = node.children.map((item, index) => {
-      const taskMarker = item.checked == null ? "" : `<span>${item.checked ? "[x]" : "[ ]"} </span>`;
-      const step = builds?.targets.get(item);
-      if (step === void 0) return `<li>${taskMarker}${renderBlocks(item.children)}</li>`;
-      const marker = item.checked == null ? node.ordered ? `${(node.start ?? 1) + index}.` : "\u2022" : item.checked ? "[x]" : "[ ]";
-      let first = true;
-      let own = [];
-      const fragments = [];
-      const flush = () => {
-        if (!first && !own.length) return;
-        fragments.push(
-          `<div data-squisq-build-step="${step}" data-squisq-build-row><span aria-hidden="true">${first ? marker : ""}</span><div>${renderBlocks(own)}</div></div>`
-        );
-        first = false;
-        own = [];
-      };
-      for (const child of item.children) {
-        if (child.type === "list") {
-          flush();
-          fragments.push(renderList(child));
-        } else own.push(child);
-      }
-      flush();
-      return `<li data-squisq-build-item>${fragments.join("")}</li>`;
-    }).join("");
-    return `<${tag}${start}>${items}</${tag}>`;
-  };
-  const renderBlock = (node) => {
-    switch (node.type) {
-      case "paragraph":
-        return `<p>${renderInlineHtml(node.children)}</p>`;
-      case "heading":
-        return `<h${node.depth}>${renderInlineHtml(node.children)}</h${node.depth}>`;
-      case "blockquote":
-        return `<blockquote>${renderBlocks(node.children)}</blockquote>`;
-      case "list":
-        return renderList(node);
-      case "code":
-        return `<pre><code>${escapeInlineHtml(node.value)}</code></pre>`;
-      case "thematicBreak":
-        return "<hr>";
-      case "table": {
-        const [head, ...body] = node.children;
-        const row = (cells, header) => `<tr>${cells.map((cell, columnIndex) => {
-          const tag = header ? "th" : "td";
-          const alignment = node.align?.[columnIndex];
-          const alignAttribute = alignment ? ` align="${alignment}"` : "";
-          return `<${tag}${alignAttribute}>${renderInlineHtml(cell.children)}</${tag}>`;
-        }).join("")}</tr>`;
-        const thead = head ? `<thead>${row(head.children, true)}</thead>` : "";
-        const tbody = body.length ? `<tbody>${body.map((item) => row(item.children, false)).join("")}</tbody>` : "";
-        return `<div data-squisq-table-scroll role="region" aria-label="Scrollable data table"><table>${thead}${tbody}</table></div>`;
-      }
-      case "math":
-        return `<pre><code>${escapeInlineHtml(node.value)}</code></pre>`;
-      case "definition":
-        return "";
-      default: {
-        const text = extractPlainText(node).trim();
-        return text ? `<p>${escapeInlineHtml(text)}</p>` : "";
-      }
-    }
-  };
-  return renderBlocks(nodes);
-}
-function markdownBlockSeparatorLines(previous, next) {
-  const previousEndLine = previous.position?.end.line;
-  const nextStartLine = next.position?.start.line;
-  if (previousEndLine == null || nextStartLine == null || nextStartLine <= previousEndLine) {
-    return 2;
-  }
-  return Math.max(2, nextStartLine - previousEndLine);
-}
-function renderListItemHtml(markdown) {
-  return markdown.map(
-    (node) => node.type === "paragraph" || node.type === "heading" ? renderInlineHtml(node.children) : escapeInlineHtml(extractPlainText(node))
-  ).join("<br>");
-}
-function extractRichListItems(contents) {
-  if (!contents) return [];
-  const items = [];
-  for (const node of contents) {
-    if (node.type !== "list") continue;
-    for (const item of node.children) {
-      const text = extractPlainText(item).trim();
-      if (!text) continue;
-      const html = renderListItemHtml(item.children);
-      const plainHtml = escapeInlineHtml(text).replace(/\r?\n/g, "<br>");
-      items.push({
-        text,
-        markdown: item.children,
-        ...html && html !== plainHtml ? { html } : {}
-      });
-    }
-  }
-  return items;
-}
-function parseDim(raw) {
-  if (raw === void 0) return void 0;
-  const n = parseFloat(raw);
-  return Number.isFinite(n) && n > 0 ? n : void 0;
-}
-function extractImages(contents, limit = Infinity) {
-  if (!contents || contents.length === 0) return [];
-  const found = [];
-  function fromHtml(nodes) {
-    for (const node of nodes) {
-      if (found.length >= limit) return;
-      if (!node || typeof node !== "object") continue;
-      const n = node;
-      if (n.type === "htmlElement" && n.tagName === "img") {
-        const attrs = n.attributes;
-        if (attrs && typeof attrs.src === "string" && attrs.src) {
-          found.push({
-            src: attrs.src,
-            alt: typeof attrs.alt === "string" ? attrs.alt : "",
-            width: parseDim(attrs.width),
-            height: parseDim(attrs.height)
-          });
-        }
-      }
-      if (Array.isArray(n.children)) fromHtml(n.children);
-    }
-  }
-  function walk(node) {
-    if (found.length >= limit) return;
-    if (!node || typeof node !== "object") return;
-    const n = node;
-    if (n.type === "image" && typeof n.url === "string" && n.url) {
-      if (!mediaKindForUrl(n.url)) {
-        found.push({ src: n.url, alt: typeof n.alt === "string" ? n.alt : "" });
-      }
-      return;
-    }
-    if ((n.type === "htmlBlock" || n.type === "htmlInline") && Array.isArray(n.htmlChildren)) {
-      fromHtml(n.htmlChildren);
-    }
-    if (Array.isArray(n.children)) {
-      for (const child of n.children) walk(child);
-    }
-  }
-  for (const node of contents) {
-    if (found.length >= limit) break;
-    walk(node);
-  }
-  return found;
-}
-function extractFirstImage(contents) {
-  return extractImages(contents, 1)[0] ?? null;
-}
-function extractEmbeddedVideos(contents, limit = Infinity) {
-  if (!contents || contents.length === 0) return [];
-  const found = [];
-  const seen = /* @__PURE__ */ new Set();
-  const add = (video) => {
-    if (!video.src || found.length >= limit || seen.has(video.src)) return;
-    seen.add(video.src);
-    found.push(video);
-  };
-  function nestedSource(children) {
-    if (!Array.isArray(children)) return void 0;
-    for (const child of children) {
-      if (!child || typeof child !== "object") continue;
-      const node = child;
-      if (node.tagName === "source") {
-        const attrs = node.attributes;
-        if (typeof attrs?.src === "string" && attrs.src) return attrs.src;
-      }
-      const nested = nestedSource(node.children);
-      if (nested) return nested;
-    }
-    return void 0;
-  }
-  function walk(node) {
-    if (found.length >= limit || !node || typeof node !== "object") return;
-    const n = node;
-    if (n.type === "htmlElement" && n.tagName === "video") {
-      const attrs = n.attributes;
-      const src = attrs?.src || nestedSource(n.children);
-      if (src) {
-        const startAt = attrs?.["data-squisq-video-start-at"] ? parseTimeSeconds(attrs["data-squisq-video-start-at"]) : null;
-        const clipStart = attrs?.["data-squisq-video-clip-start"] ? parseTimeSeconds(attrs["data-squisq-video-clip-start"]) : null;
-        const clipEnd = attrs?.["data-squisq-video-clip-end"] ? parseTimeSeconds(attrs["data-squisq-video-clip-end"]) : null;
-        add({
-          src,
-          ...attrs?.poster ? { posterSrc: attrs.poster } : {},
-          alt: attrs?.["aria-label"] || attrs?.title || attrs?.alt || "",
-          ...startAt != null ? { startAt } : {},
-          ...clipStart != null ? { clipStart } : {},
-          ...clipEnd != null ? { clipEnd } : {}
-        });
-      }
-    } else if ((n.type === "link" || n.type === "image") && typeof n.url === "string" && VIDEO_FILE_RE.test(n.url)) {
-      add({
-        src: n.url,
-        alt: typeof n.alt === "string" ? n.alt : extractPlainText(n).trim()
-      });
-    }
-    if (Array.isArray(n.children)) n.children.forEach(walk);
-    if (Array.isArray(n.htmlChildren)) n.htmlChildren.forEach(walk);
-  }
-  contents.forEach(walk);
-  return found;
-}
-function extractFirstEmbeddedVideo(contents) {
-  return extractEmbeddedVideos(contents, 1)[0] ?? null;
-}
-function extractTableFromContents(contents) {
-  if (!contents) return null;
-  for (const node of contents) {
-    if (node.type === "table") {
-      const table = node;
-      const [headerRow, ...bodyRows] = table.children;
-      if (!headerRow) return null;
-      const headers = headerRow.children.map((cell) => extractPlainText(cell).trim());
-      const rows = bodyRows.map((row) => row.children.map((cell) => extractPlainText(cell).trim()));
-      return { headers, rows, align: table.align };
-    }
-  }
-  return null;
-}
-function extractBlockquoteText(contents) {
-  if (!contents) return "";
-  for (const node of contents) {
-    if (node.type === "blockquote") return extractPlainText(node).trim();
-  }
-  return "";
-}
-function firstParagraph(contents) {
-  if (!contents) return null;
-  const index = contents.findIndex((node) => node.type === "paragraph");
-  if (index < 0) return null;
-  return {
-    node: contents[index],
-    index
-  };
-}
-function leadingStrongStat(paragraph) {
-  for (const child of paragraph.children) {
-    if (child.type === "text" && child.value.trim() === "") continue;
-    if (child.type !== "strong") return null;
-    const text = extractPlainText(child).trim();
-    const match = text.match(/^(?:[$€£¥]\s*)?[+-]?\d+(?:[.,]\d+)*(?:\s?(?:[%‰x×]|[A-Za-z]+))?/);
-    return match?.[0].trim() || null;
-  }
-  return null;
-}
-function removeStatPhrase(text, start, end) {
-  const before = text.slice(0, start).trim();
-  let after = text.slice(end);
-  if (!before) after = after.replace(/^\s*(?:[-–—:]\s*)?/, "");
-  else after = after.trim();
-  return [before, after].filter(Boolean).join(" ").trim();
-}
-function bodyWithoutParagraphStat(contents, paragraphIndex, paragraphText, start, end) {
-  if (!contents) return "";
-  return contents.map(
-    (node, index) => index === paragraphIndex ? removeStatPhrase(paragraphText, start, end) : extractPlainText(node).trim()
-  ).filter(Boolean).join("\n").trim();
-}
-function deriveStatHighlightInputs(headingText, contents, bodyText3) {
-  const paragraph = firstParagraph(contents);
-  if (paragraph) {
-    const paragraphText = extractPlainText(paragraph.node).trim();
-    const strongStat = leadingStrongStat(paragraph.node);
-    if (strongStat) {
-      const start = paragraphText.indexOf(strongStat);
-      const description = bodyWithoutParagraphStat(
-        contents,
-        paragraph.index,
-        paragraphText,
-        start,
-        start + strongStat.length
-      );
-      return {
-        stat: strongStat,
-        description: description || headingText || strongStat
-      };
-    }
-  }
-  const trimmedHeading = headingText.trim();
-  const headingStat = matchNumberHighlight(trimmedHeading);
-  if (headingStat && headingStat.index === 0 && headingStat.end === trimmedHeading.length) {
-    return { stat: headingText, description: bodyText3 || headingText };
-  }
-  if (paragraph) {
-    const paragraphText = extractPlainText(paragraph.node).trim();
-    const bodyStat = matchNumberHighlight(paragraphText);
-    if (bodyStat) {
-      const description = bodyWithoutParagraphStat(
-        contents,
-        paragraph.index,
-        paragraphText,
-        bodyStat.index,
-        bodyStat.end
-      );
-      return {
-        stat: bodyStat.value,
-        description: description || headingText || bodyStat.value
-      };
-    }
-  }
-  return { stat: headingText, description: bodyText3 || headingText };
-}
-function normalizeCoverageText(value) {
-  return value.replace(/\s+/g, " ").trim();
-}
-function autoTemplatePreservesContent(templateName, contents) {
-  const nodes = contents ?? [];
-  switch (templateName) {
-    case "quote":
-      return nodes.length === 1 && nodes[0]?.type === "blockquote";
-    case "dataTable":
-      return nodes.length === 1 && nodes[0]?.type === "table";
-    case "list":
-      return nodes.length === 1 && nodes[0]?.type === "list";
-    case "diagram":
-    case "timeline":
-      return nodes.length === 1 && nodes[0]?.type === "code";
-    case "tree":
-      return nodes.length === 1 && (nodes[0]?.type === "code" || nodes[0]?.type === "list");
-    case "photoGrid": {
-      const images = extractImages(nodes);
-      if (images.length < 2 || images.length > 4) return false;
-      const bodyText3 = normalizeCoverageText(extractBodyPlainText(nodes));
-      const representedText = normalizeCoverageText(
-        images.map((image) => image.alt).filter(Boolean).join(" ")
-      );
-      return bodyText3 === "" || bodyText3 === representedText;
-    }
-    case "videoWithCaption": {
-      const videos = extractEmbeddedVideos(nodes);
-      if (videos.length + extractHostedVideos(nodes).length !== 1) return false;
-      const bodyText3 = normalizeCoverageText(extractBodyPlainText(nodes));
-      return bodyText3 === normalizeCoverageText(videos[0]?.alt ?? "");
-    }
-    case "leftFeature":
-    case "rightFeature":
-    case "statHighlight":
-      return nodes.length > 0 && nodes.every((node) => node.type === "paragraph");
-    default:
-      return false;
-  }
-}
-function deriveTemplateInputs(templateName, headingText, contents, options = {}) {
-  const placeholders = options.placeholders === true;
-  const bodyText3 = extractBodyPlainText(contents);
-  switch (templateName) {
-    case "statHighlight": {
-      const inputs = deriveStatHighlightInputs(headingText, contents, bodyText3);
-      if (options.preserveSourceHeading && headingText && inputs.stat !== headingText && inputs.description !== headingText) {
-        return {
-          ...inputs,
-          description: headingText,
-          ...inputs.description ? { detail: inputs.description } : {}
-        };
-      }
-      return inputs;
-    }
-    case "transcript": {
-      const text = extractBlockquoteText(contents) || bodyText3;
-      if (!text && !headingText) {
-        return placeholders ? { speaker: "Speaker", text: "Message" } : null;
-      }
-      return {
-        speaker: headingText || (placeholders ? "Speaker" : ""),
-        text: text || (placeholders ? "Message" : "")
-      };
-    }
-    case "quote": {
-      const quote = extractBlockquoteText(contents) || bodyText3;
-      if (quote) return { quote, ...headingText ? { title: headingText } : {} };
-      return { quote: headingText };
-    }
-    case "fullBleedQuote": {
-      const text = extractBlockquoteText(contents) || bodyText3 || headingText;
-      return { text };
-    }
-    case "pullQuote": {
-      const text = extractBlockquoteText(contents) || bodyText3 || headingText;
-      const img = extractFirstImage(contents);
-      return {
-        text,
-        ...img ? { backgroundImage: { src: img.src, alt: img.alt || headingText } } : {}
-      };
-    }
-    case "videoPullQuote": {
-      const text = extractBlockquoteText(contents) || bodyText3 || headingText;
-      const video = extractFirstEmbeddedVideo(contents);
-      return {
-        text,
-        ...video ? {
-          backgroundVideo: {
-            src: video.src,
-            ...video.posterSrc ? { posterSrc: video.posterSrc } : {},
-            alt: video.alt || headingText,
-            ...video.clipStart != null ? { clipStart: video.clipStart } : {},
-            ...video.clipEnd != null ? { clipEnd: video.clipEnd } : {}
-          }
-        } : {}
-      };
-    }
-    case "factCard":
-      return { fact: headingText, explanation: bodyText3 };
-    case "twoColumn":
-      return headingText ? { header: headingText } : placeholders ? {} : null;
-    case "comparisonBar":
-      return placeholders ? { leftLabel: "A", leftValue: 60, rightLabel: "B", rightValue: 40 } : null;
-    case "list": {
-      const items = extractListItems(contents);
-      const firstList = (contents ?? []).find((n) => n.type === "list");
-      if (items.length > 0) {
-        return {
-          items,
-          // Bullets stay bullets: only a numbered source list renders `1.` markers.
-          ordered: firstList?.ordered === true,
-          ...headingText ? { title: headingText } : {}
-        };
-      }
-      return placeholders ? { items: ["Item 1", "Item 2", "Item 3"] } : null;
-    }
-    case "definitionCard":
-      return { term: headingText, definition: bodyText3 };
-    case "dateEvent":
-      return { date: headingText, description: bodyText3 };
-    case "dataTable": {
-      const tableData = extractTableFromContents(contents);
-      if (tableData) return { ...tableData, ...headingText ? { title: headingText } : {} };
-      return placeholders ? { headers: ["Column"], rows: [["Data"]] } : null;
-    }
-    case "barChart":
-    case "columnChart":
-    case "pieChart":
-    case "donutChart":
-    case "lineChart":
-    case "areaChart":
-    case "scatterChart": {
-      const tableData = extractTableFromContents(contents);
-      if (tableData) {
-        return {
-          headers: tableData.headers,
-          rows: tableData.rows,
-          ...headingText ? { title: headingText } : {}
-        };
-      }
-      return placeholders && !bodyText3.trim() ? {
-        headers: ["Quarter", "Revenue", "Costs"],
-        rows: [
-          ["Q1", "40", "28"],
-          ["Q2", "55", "31"],
-          ["Q3", "48", "30"],
-          ["Q4", "62", "35"]
-        ],
-        ...headingText ? { title: headingText } : {}
-      } : null;
-    }
-    case "imageWithCaption": {
-      const img = extractFirstImage(contents);
-      if (!img) return placeholders ? { caption: headingText } : null;
-      return { imageSrc: img.src, imageAlt: img.alt || headingText, caption: headingText };
-    }
-    case "bigText": {
-      const img = extractFirstImage(contents);
-      return {
-        title: headingText,
-        ...img ? { imageSrc: img.src, imageAlt: img.alt || headingText } : {}
-      };
-    }
-    case "photoGrid": {
-      const images = extractImages(contents, 4);
-      if (images.length < 2) return placeholders ? {} : null;
-      return {
-        images: images.map((i) => ({ src: i.src, alt: i.alt })),
-        caption: headingText
-      };
-    }
-    case "videoWithCaption": {
-      const video = extractFirstEmbeddedVideo(contents);
-      if (!video) {
-        const hosted = extractHostedVideos(contents, 1)[0];
-        if (hosted) {
-          return {
-            videoSrc: hosted.url,
-            videoAlt: hosted.title || headingText,
-            caption: headingText
-          };
-        }
-        return placeholders ? { caption: headingText } : null;
-      }
-      return {
-        videoSrc: video.src,
-        posterSrc: video.posterSrc,
-        videoAlt: video.alt || headingText,
-        caption: headingText
-      };
-    }
-    case "leftFeature":
-    case "rightFeature": {
-      const img = extractFirstImage(contents);
-      if (!img && !placeholders) return null;
-      return {
-        imageSrc: img?.src ?? "",
-        imageAlt: img?.alt || headingText,
-        imageWidth: img?.width,
-        imageHeight: img?.height,
-        title: headingText,
-        body: bodyText3
-      };
-    }
-    case "diagram": {
-      const fences = (contents ?? []).filter((n) => n.type === "code");
-      const fence = fences.length === 1 && isEligibleAsciiFenceLang(fences[0].lang) ? fences[0] : void 0;
-      const detection = fence ? detectAsciiDiagram(fence.value, { explicit: isExplicitDiagramLang(fence.lang) }) : void 0;
-      if (!detection?.isDiagram || !detection.diagram) return placeholders ? {} : null;
-      const { nodes, edges } = asciiDiagramToTemplateData(detection.diagram);
-      return { nodes, edges, ...headingText ? { title: headingText } : {} };
-    }
-    case "timeline": {
-      const fences = (contents ?? []).filter((n) => n.type === "code");
-      const fence = fences.length === 1 && isEligibleAsciiTimelineFenceLang(fences[0].lang) ? fences[0] : void 0;
-      const detection = fence ? detectAsciiTimeline(fence.value, { explicit: true }) : void 0;
-      if (!detection?.isTimeline || !detection.timeline) return placeholders ? {} : null;
-      const { tracks, links } = asciiTimelineToTemplateData(detection.timeline);
-      return { tracks, links, ...headingText ? { title: headingText } : {} };
-    }
-    case "tree": {
-      const fences = (contents ?? []).filter((n) => n.type === "code");
-      const fence = fences.length === 1 && isEligibleTreeFenceLang(fences[0].lang) ? fences[0] : void 0;
-      if (fence) {
-        const detection = detectTree(fence.value, { explicit: isExplicitTreeLang(fence.lang) });
-        if (detection.isTree && detection.tree) {
-          const { items } = treeToTemplateData(detection.tree);
-          return { items, ...headingText ? { title: headingText } : {} };
-        }
-      }
-      const list = findFirstList(contents);
-      if (list) {
-        const { items } = treeToTemplateData(treeFromMarkdownList(list));
-        if (items.length > 0) return { items, ...headingText ? { title: headingText } : {} };
-      }
-      return placeholders ? {} : null;
-    }
-    default:
-      return placeholders ? {} : null;
-  }
-}
-
 // src/doc/templates/tokens/resolveTokens.ts
 var TOKEN_RE = /\{(\w+)(?::([^}|]+))?(?:\|([^}]*))?\}/g;
 var ESCAPE_RE = /\{\{([^{}]*)\}\}/g;
@@ -2440,7 +1468,7 @@ function collectListItems(block) {
 }
 function getBlockBodyText(block) {
   if (!block.contents) return "";
-  return block.contents.map((node) => extractPlainText(node).trim()).filter((s) => s.length > 0).join(" ");
+  return block.contents.filter((node) => !isPictureFence(node)).map((node) => extractPlainText(node).trim()).filter((s) => s.length > 0).join(" ");
 }
 function getChildrenSummary(block) {
   if (!block.children || block.children.length === 0) return "";
@@ -7174,7 +6202,7 @@ function resolveSupplementalMediaLayout(layers, template, viewport, mediaCount,
   const policy = getBlockMediaLayoutPolicy(template);
   const shape = mediaShape(mediaCount, aspectRatios);
   const alreadyOwnsMedia = layers.some(
-    (layer) => layer.type === "image" || layer.type === "video" || layer.type === "videoEmbed" || layer.type === "map" || layer.type === "mermaid"
+    (layer) => layer.type === "image" || layer.type === "video" || layer.type === "videoEmbed" || layer.type === "map" || layer.type === "mermaid" || layer.type === "svg"
   );
   if (!alreadyOwnsMedia && (policy?.nativeLayout === "feature-left" || policy?.nativeLayout === "feature-right")) {
     const { position } = featureMediaSlot(
@@ -7301,15 +6329,19 @@ function unconsumedMedia(block) {
     seen.add(image.src);
     return true;
   });
-  const mermaid = contents.filter(
-    (node) => node.type === "code" && node.lang?.trim().toLowerCase() === "mermaid" && node.value.trim().length > 0
+  const pictures = contents.filter(
+    (node) => node.type === "code" && isPictureFence(node) && node.value.trim().length > 0
   );
   const aspectRatios = [
     ...images.map(
       (image) => image.width && image.height ? image.width / image.height : void 0
     ),
     ...videos.map(() => 16 / 9),
-    ...mermaid.map(() => 16 / 9)
+    // An SVG island knows its shape; a Mermaid diagram does not until drawn.
+    ...pictures.map((fence) => {
+      const island = isSvgIslandLang(fence.lang) ? parseSvgIsland(fence.value) : null;
+      return island?.ok ? island.island.aspectRatio : 16 / 9;
+    })
   ];
   return { count: aspectRatios.length, aspectRatios };
 }
@@ -7854,7 +6886,7 @@ function estimateTextWidth(text, fontSize, charWidthEm = AVERAGE_CHAR_WIDTH_EM)
 }
 
 // src/doc/templates/timelineBlock.ts
-var clamp012 = (value) => Math.max(0, Math.min(1, value));
+var clamp01 = (value) => Math.max(0, Math.min(1, value));
 var clamp = (value, min, max) => Math.max(min, Math.min(max, value));
 function safeId(value) {
   return value.replace(/[^a-zA-Z0-9_-]+/g, "-").replace(/^-+|-+$/g, "") || "item";
@@ -7881,7 +6913,7 @@ function coerceTracks(raw) {
         events.push({
           id: eventId,
           label: event.label,
-          position: clamp012(position),
+          position: clamp01(position),
           ...typeof event.description === "string" && event.description.trim() ? { description: event.description.trim() } : {},
           ...side ? { side } : {},
           ...descriptionSide ? { descriptionSide } : {},
@@ -8027,7 +7059,7 @@ function timelineBlock(input, context) {
   const eventFontSize = Math.min(baseEventFontSize, 28 * minViewportScale);
   const descriptionFontSize = Math.min(baseDescriptionFontSize, 20 * minViewportScale);
   const trackMarkerRadii = tracks.map((track) => {
-    const positions = track.events.map((event) => clamp012(event.position)).sort((a, b) => a - b);
+    const positions = track.events.map((event) => clamp01(event.position)).sort((a, b) => a - b);
     let minGapPx = Number.POSITIVE_INFINITY;
     for (let index = 1; index < positions.length; index++) {
       minGapPx = Math.min(minGapPx, (positions[index] - positions[index - 1]) * axisWidth);
@@ -8106,7 +7138,7 @@ function timelineBlock(input, context) {
         event,
         trackIndex,
         eventIndex,
-        x: axisStartX + axisWidth * clamp012(event.position),
+        x: axisStartX + axisWidth * clamp01(event.position),
         y
       };
       eventPoints.push(point);
@@ -8461,7 +7493,7 @@ function normalizeShapeKind(name) {
 function isShapeName(name) {
   return normalizeShapeKind(name) != null;
 }
-var DEFAULT_OPTS2 = {
+var DEFAULT_OPTS = {
   gapX: 180,
   gapY: 140,
   gridPad: 80,
@@ -8481,7 +7513,7 @@ function defaultSize(kind) {
   return DEFAULT_SIZE[kind] ?? FALLBACK_SIZE;
 }
 function computeDrawingLayout(children, options = {}) {
-  const opts = { ...DEFAULT_OPTS2, ...options };
+  const opts = { ...DEFAULT_OPTS, ...options };
   const warnings = [];
   const entries = [];
   const unpositioned = [];
@@ -8658,7 +7690,7 @@ function connectorSemantics(params, kind) {
 }
 function bodyText(block) {
   if (!block.contents || block.contents.length === 0) return "";
-  return block.contents.map((node) => extractPlainText(node)).join(" ").trim();
+  return block.contents.filter((node) => !isPictureFence(node)).map((node) => extractPlainText(node)).join(" ").trim();
 }
 
 // src/doc/templates/drawingBlock.ts
@@ -9041,7 +8073,7 @@ function numParam2(params, key) {
 }
 function bodyText2(block) {
   if (!block.contents || block.contents.length === 0) return "";
-  return block.contents.map((node) => extractPlainText(node)).join("\n").trim();
+  return block.contents.filter((node) => !isPictureFence(node)).map((node) => extractPlainText(node)).join("\n").trim();
 }
 function round3(n) {
   return Math.round(n * 100) / 100;
@@ -9996,7 +9028,7 @@ function fallbackBlockLayers(block, context, notice) {
 }
 function extractBodyText(block) {
   if (!block.contents || block.contents.length === 0) return "";
-  const text = block.contents.map((node) => extractPlainText(node)).join("\n").trim();
+  const text = block.contents.filter((node) => !isPictureFence(node)).map((node) => extractPlainText(node)).join("\n").trim();
   if (text.length <= MAX_BODY_CHARS) return text;
   return `${text.slice(0, MAX_BODY_CHARS).trimEnd()}\u2026`;
 }
@@ -10119,6 +9151,13 @@ function mermaidSources(block) {
     (node) => node.type === "code" && node.lang?.trim().toLowerCase() === "mermaid"
   ).map((node) => node.value).filter((source) => source.trim().length > 0);
 }
+function svgIslandSources(block) {
+  return (block.contents ?? []).filter((node) => node.type === "code" && isSvgIslandLang(node.lang)).map((node) => node.value).filter((source) => source.trim().length > 0);
+}
+function svgIslandAspectRatio(source) {
+  const result = parseSvgIsland(source);
+  return result.ok ? result.island.aspectRatio : 16 / 9;
+}
 function embeddedSpatialMedia(block) {
   const canonicalTemplate = block.template ? resolveTemplateName(block.template) : void 0;
   const fences = (block.contents ?? []).filter(
@@ -10178,6 +9217,9 @@ function collectRichMediaItems(layers, block) {
   const existingMermaid = new Set(
     layers.filter((layer) => layer.type === "mermaid").map((layer) => layer.content.source)
   );
+  const existingSvg = new Set(
+    layers.filter((layer) => layer.type === "svg").map((layer) => layer.content.source)
+  );
   const existingEmbeds = new Set(
     layers.filter((layer) => layer.type === "videoEmbed").map((layer) => parseVideoEmbedUrl(layer.content.url)?.watchUrl ?? layer.content.url)
   );
@@ -10191,6 +9233,7 @@ function collectRichMediaItems(layers, block) {
     return true;
   });
   const sources = mermaidSources(block).filter((source) => !existingMermaid.has(source));
+  const islands = svgIslandSources(block).filter((source) => !existingSvg.has(source));
   const hosted = extractHostedVideos(block.contents).filter(
     (video) => !existingEmbeds.has(video.url)
   );
@@ -10218,6 +9261,11 @@ function collectRichMediaItems(layers, block) {
       aspectRatio: video.aspectRatio
     })),
     ...sources.map((source) => ({ kind: "mermaid", source, aspectRatio: 16 / 9 })),
+    ...islands.map((source) => ({
+      kind: "svg",
+      source,
+      aspectRatio: svgIslandAspectRatio(source)
+    })),
     ...embeddedSpatialMedia(block)
   ];
 }
@@ -10314,6 +9362,16 @@ function richMediaLayers(item, position, block, theme, kindIndex) {
       }
     ];
   }
+  if (item.kind === "svg") {
+    return [
+      {
+        id: `${block.id}-svg-${kindIndex}`,
+        type: "svg",
+        position,
+        content: { source: item.source, color: theme.colors.text }
+      }
+    ];
+  }
   const localViewport = {
     width: position.width,
     height: position.height,
@@ -10385,6 +9443,7 @@ function appendRichContentLayers(layers, block, theme, viewport, mediaAspectRati
     video: 0,
     videoEmbed: 0,
     mermaid: 0,
+    svg: 0,
     spatial: 0
   };
   const mediaLayers = items.flatMap((item, index) => {
@@ -12403,7 +11462,7 @@ function getBlockBodyText2(block) {
   if (!block.contents || block.contents.length === 0) return "";
   const tmpl = resolveTemplateName(block.template ?? "");
   const consumedFence = tmpl === "diagram" && block.templateData !== void 0 && "nodes" in block.templateData || tmpl === "timeline" && block.templateData !== void 0 && "tracks" in block.templateData || tmpl === "tree" && block.templateData !== void 0 && "items" in block.templateData;
-  return block.contents.filter((node) => !(consumedFence && node.type === "code")).filter((node) => findBlockVideoEmbed(node) === null).map((node) => extractPlainText(node)).join("\n").trim();
+  return block.contents.filter((node) => !(consumedFence && node.type === "code")).filter((node) => !isMaterializedMediaNode(node)).map((node) => extractPlainText(node)).join("\n").trim();
 }
 var MAX_PHRASE_WORDS = 12;
 function splitIntoSentences(text) {
@@ -13000,34 +12059,6 @@ export {
   sectionHeader,
   fitBigTextSize,
   bigText,
-  computeDiagramLayout,
-  ASCII_CHAR_W,
-  ASCII_CHAR_H,
-  asciiCellToCanvas,
-  canvasToAsciiCell,
-  asciiDiagramToTemplateData,
-  asciiDiagramFromTemplateData,
-  asciiDiagramFromBlocks,
-  asciiTimelineToTemplateData,
-  treeToTemplateData,
-  treeFromTemplateData,
-  treeFromMarkdownList,
-  findFirstList,
-  extractHostedVideos,
-  isMaterializedMediaNode,
-  extractBodyPlainText,
-  extractListItems,
-  renderMarkdownBlocksHtml,
-  markdownBlockSeparatorLines,
-  extractRichListItems,
-  extractImages,
-  extractFirstImage,
-  extractEmbeddedVideos,
-  extractFirstEmbeddedVideo,
-  extractTableFromContents,
-  extractBlockquoteText,
-  autoTemplatePreservesContent,
-  deriveTemplateInputs,
   contentBlock,
   parseStatNumber,
   countUpSpecFor,