@bendyline/squisq 2.13.0 → 2.13.2

package/dist/{chunk-FVFTJ64H.js → chunk-YY3OQ3MI.js}

@@ -27,7 +27,7 @@ import {
   profileBlockContents,
   renderMarkdownBlocksHtml,
   treeToTemplateData
-} from "./chunk-JDYWKGG7.js";
+} from "./chunk-HGCIIXHP.js";
 import {
   anchorPoint,
   base64ToUtf8,
@@ -57,7 +57,7 @@ import {
   validateCustomTemplateDefinition,
   validateTheme,
   withAlpha
-} from "./chunk-HYJ63N6V.js";
+} from "./chunk-WNEH3BZP.js";
 import {
   mediaEditValuesFromAttributes,
   mediaEditValuesFromParams,
@@ -84,7 +84,7 @@ import {
   parseVideoEmbedUrl,
   readFrontmatterThemeId,
   walkMarkdownTree
-} from "./chunk-MWSGNEH6.js";
+} from "./chunk-HE3HQZWU.js";
 import {
   resolveBlockTransition
 } from "./chunk-P53Z4RYC.js";
@@ -1791,12 +1791,12 @@ function statHighlight(input, context) {
   const statTop = groupTop;
   const descTop = statTop + statBoxH + gap;
   const detailTop = descTop + descBoxH + detailGap;
-  const pct = (px) => `${Number((px / frameH * 100).toFixed(3))}%`;
+  const pct2 = (px) => `${Number((px / frameH * 100).toFixed(3))}%`;
   const box = (top, height) => ({
     x: accentLayout.textCenterX,
-    y: pct(top + height / 2),
+    y: pct2(top + height / 2),
     width: accentLayout.textWidth,
-    height: pct(height),
+    height: pct2(height),
     anchor: "center"
   });
   layers.push({
@@ -1880,7 +1880,7 @@ function quoteBlock(input, context) {
   const accentImage = accentForViewport(input.accentImage, viewport);
   const H = viewport.height;
   const W = viewport.width;
-  const pct = (px) => `${Number((px / H * 100).toFixed(3))}%`;
+  const pct2 = (px) => `${Number((px / H * 100).toFixed(3))}%`;
   const accentLayout = accentImage ? getAccentLayout(accentImage.position) : DEFAULT_LAYOUT;
   const yShiftPx = accentLayout.adjustY ? accentLayout.textYAdjust / 100 * H : 0;
   const colWidthPct = parseFloat(accentLayout.textWidth);
@@ -1938,9 +1938,9 @@ function quoteBlock(input, context) {
       },
       position: {
         x: colLeft,
-        y: pct(bandTopPx),
+        y: pct2(bandTopPx),
         width: accentLayout.textWidth,
-        height: pct(titleFit.heightPx),
+        height: pct2(titleFit.heightPx),
         anchor: "top-left"
       },
       animation: { type: "fadeIn", duration: 0.8 }
@@ -1994,7 +1994,7 @@ function quoteBlock(input, context) {
       },
       position: {
         x: accentLayout.textCenterX,
-        y: pct(quoteTopPx - decoMarginPx - decoFontSize * 0.6),
+        y: pct2(quoteTopPx - decoMarginPx - decoFontSize * 0.6),
         anchor: "center"
       }
     });
@@ -2020,9 +2020,9 @@ function quoteBlock(input, context) {
     },
     position: {
       x: colLeft,
-      y: pct(quoteTopPx),
+      y: pct2(quoteTopPx),
       width: accentLayout.textWidth,
-      height: pct(quoteFit.heightPx),
+      height: pct2(quoteFit.heightPx),
       anchor: "top-left"
     },
     animation: motionEntrance(context, { type: "fadeIn", duration: 2 })
@@ -2047,9 +2047,9 @@ function quoteBlock(input, context) {
       },
       position: {
         x: colLeft,
-        y: pct(quoteBottomPx + attrGapPx),
+        y: pct2(quoteBottomPx + attrGapPx),
         width: accentLayout.textWidth,
-        height: pct(attrFit.heightPx),
+        height: pct2(attrFit.heightPx),
         anchor: "top-left"
       },
       animation: { type: "fadeIn", duration: 1, delay: 1.5 }
@@ -2133,12 +2133,12 @@ function factCard(input, context) {
   const factTop = groupTop;
   const explainTop = factTop + factBoxH + gap;
   const sourceTop = explainTop + explainBoxH + sourceGap;
-  const pct = (px) => `${Number((px / frameH * 100).toFixed(3))}%`;
+  const pct2 = (px) => `${Number((px / frameH * 100).toFixed(3))}%`;
   const box = (top, height) => ({
     x: accentLayout.textCenterX,
-    y: pct(top + height / 2),
+    y: pct2(top + height / 2),
     width: accentLayout.textWidth,
-    height: pct(height),
+    height: pct2(height),
     anchor: "center"
   });
   layers.push({
@@ -3090,7 +3090,7 @@ function fullBleedQuote(input, context) {
   const colors = resolveColorScheme(context, colorScheme);
   const H = viewport.height;
   const W = viewport.width;
-  const pct = (px) => `${Number((px / H * 100).toFixed(3))}%`;
+  const pct2 = (px) => `${Number((px / H * 100).toFixed(3))}%`;
   const impactFontSize = themedFontSize(120, context, true);
   const baseFontSize = Math.round(impactFontSize * lengthFactor(text));
   const bandHeightPx = (BAND_BOTTOM3 - BAND_TOP3) * H;
@@ -3141,9 +3141,9 @@ function fullBleedQuote(input, context) {
       },
       position: {
         x: `${COLUMN_LEFT * 100}%`,
-        y: pct(topPx),
+        y: pct2(topPx),
         width: `${COLUMN_WIDTH * 100}%`,
-        height: pct(fit.heightPx),
+        height: pct2(fit.heightPx),
         anchor: "top-left"
       },
       animation: motionEntrance(
@@ -3605,12 +3605,12 @@ function definitionCard(input, context) {
   const ruleTop = termTop + termH + ruleGap;
   const defTop = ruleTop + RULE_HEIGHT_PX + defGap;
   const originTop = defTop + defH + originGap;
-  const pct = (px) => `${(px / viewport.height * 100).toFixed(3)}%`;
+  const pct2 = (px) => `${(px / viewport.height * 100).toFixed(3)}%`;
   const box = (topPx, heightPx) => {
     const height = Math.round(heightPx);
     return {
       x: accentLayout.textCenterX,
-      y: pct(topPx + height / 2),
+      y: pct2(topPx + height / 2),
       width: accentLayout.textWidth,
       height,
       anchor: "center"
@@ -3657,7 +3657,7 @@ function definitionCard(input, context) {
     },
     position: {
       x: columnLeft,
-      y: pct(ruleTop),
+      y: pct2(ruleTop),
       width: "30%",
       height: `${RULE_HEIGHT_PX}px`,
       anchor: "top-left"
@@ -3883,7 +3883,7 @@ var ATTR_LINE_HEIGHT = 1.4;
 function pullQuoteLockup(options, context) {
   const { text, attribution, overMedia } = options;
   const { theme, viewport } = context;
-  const pct = (px) => px / viewport.height * 100;
+  const pct2 = (px) => px / viewport.height * 100;
   const quoteBaseSize = themedFontSize(52, context, true);
   const quoteMinSize = Math.max(18, themedFontSize(24, context, true));
   const attrFontSize = themedFontSize(26, context, false);
@@ -3910,12 +3910,12 @@ function pullQuoteLockup(options, context) {
   const gapPx = attribution ? Math.max(16, fit.fontSize * 0.6) : 0;
   const stackHeightPx = fit.heightPx + gapPx + attrHeightPx;
   const stackTopPx = Math.max(frameTopPx, viewport.height / 2 - stackHeightPx / 2);
-  const quoteTopPct = pct(stackTopPx);
-  const attrTopPct = pct(stackTopPx + fit.heightPx + gapPx);
+  const quoteTopPct = pct2(stackTopPx);
+  const attrTopPct = pct2(stackTopPx + fit.heightPx + gapPx);
   const decoHeadroomPx = stackTopPx - 0.03 * viewport.height;
   const decoFontSize = Math.min(decoBaseSize, Math.floor(decoHeadroomPx / 0.6));
   const showDeco = decoFontSize >= decoMinSize;
-  const decoYPct = quoteTopPct - pct(decoFontSize * 0.55);
+  const decoYPct = quoteTopPct - pct2(decoFontSize * 0.55);
   const shadow = overMedia ? true : shouldUseShadow(context);
   const quoteColor = overMedia ? "#ffffff" : theme.colors.text;
   const attrColor = overMedia ? "rgba(255, 255, 255, 0.85)" : theme.colors.textMuted;
@@ -6884,6 +6884,35 @@ var BOLD_CHAR_WIDTH_EM = 0.66;
 function estimateTextWidth(text, fontSize, charWidthEm = AVERAGE_CHAR_WIDTH_EM) {
   return text.length * fontSize * charWidthEm;
 }
+var DISPLAY_CHAR_EM = {
+  space: 0.27,
+  narrowLower: 0.36,
+  wideLower: 0.86,
+  lower: 0.57,
+  narrowUpper: 0.4,
+  wideUpper: 0.95,
+  upper: 0.7,
+  digit: 0.57,
+  punct: 0.34,
+  other: 0.62
+};
+function displayCharEm(ch) {
+  if (ch === " ") return DISPLAY_CHAR_EM.space;
+  if ("fijlrt".includes(ch)) return DISPLAY_CHAR_EM.narrowLower;
+  if (ch === "m" || ch === "w") return DISPLAY_CHAR_EM.wideLower;
+  if (ch >= "a" && ch <= "z") return DISPLAY_CHAR_EM.lower;
+  if (ch === "I" || ch === "J") return DISPLAY_CHAR_EM.narrowUpper;
+  if (ch === "M" || ch === "W") return DISPLAY_CHAR_EM.wideUpper;
+  if (ch >= "A" && ch <= "Z") return DISPLAY_CHAR_EM.upper;
+  if (ch >= "0" && ch <= "9") return DISPLAY_CHAR_EM.digit;
+  if (".,:;-/'\u2019!?()".includes(ch)) return DISPLAY_CHAR_EM.punct;
+  return DISPLAY_CHAR_EM.other;
+}
+function estimateDisplayTextWidth(text, fontSize) {
+  let em = 0;
+  for (const ch of text.normalize("NFD").replace(/\p{M}/gu, "")) em += displayCharEm(ch);
+  return em * fontSize;
+}
 
 // src/doc/templates/timelineBlock.ts
 var clamp01 = (value) => Math.max(0, Math.min(1, value));
@@ -9921,13 +9950,227 @@ function coverScrimGradient(background) {
   const stops = COVER_SCRIM_STOPS.map((s) => `${withAlpha(background, s.alpha)} ${s.pos}%`);
   return `linear-gradient(0deg, ${stops.join(", ")})`;
 }
+var FROSTED_LINE_HEIGHT = 1.12;
+var FROSTED_MAX_LINES = 3;
+var FROSTED_SQUARE_SHARE = 0.9;
+var FROSTED_PAD_X_EM = 0.45;
+var FROSTED_PAD_Y_EM = 0.3;
+var FROSTED_RADIUS_EM = 0.3;
+var FROSTED_BLUR_SHARE = 0.0167;
+var FROSTED_BOTTOM_MARGIN_PCT = { wide: 7, tall: 17 };
+var FROSTED_TINT_UNDER_LIGHT_TEXT = "rgba(12, 12, 14, 0.26)";
+var FROSTED_TINT_UNDER_DARK_TEXT = "rgba(250, 250, 250, 0.5)";
+var FROSTED_BACKDROP_CONTRAST = 0.65;
+var COVER_SUBTITLE_BASE_PX = 40;
+var INK_EM = { xHeight: 0.45, ascent: 0.71, accentedCapital: 0.8, descent: 0.165 };
+function opticalCentreShiftEm(lines) {
+  const first = (lines[0] ?? "").normalize("NFD");
+  const last = lines[lines.length - 1] ?? "";
+  const top = /[A-Z]\p{M}/u.test(first) ? INK_EM.accentedCapital : /[A-Zbdfhklt0-9]|[a-z]\p{M}/u.test(first) ? INK_EM.ascent : INK_EM.xHeight;
+  const bottom = /[gjpqyQ,;]/.test(last) ? INK_EM.descent : 0;
+  return Math.round(((top - bottom) / 2 - INK_EM.xHeight / 2) * 1e3) / 1e3;
+}
+function wrapDisplayLine(line, fontSize, maxWidth) {
+  const lines = [];
+  let current = "";
+  for (const word of line.trim().split(/\s+/).filter(Boolean)) {
+    const candidate = current ? `${current} ${word}` : word;
+    if (!current || estimateDisplayTextWidth(candidate, fontSize) <= maxWidth) {
+      current = candidate;
+    } else {
+      lines.push(current);
+      current = word;
+    }
+  }
+  if (current) lines.push(current);
+  return lines.length > 0 ? lines : [""];
+}
+function balancedDisplayLines(line, fontSize, maxWidth) {
+  const greedy = wrapDisplayLine(line, fontSize, maxWidth);
+  if (greedy.length < 2) return greedy;
+  let lo = Math.max(
+    ...line.split(/\s+/).filter(Boolean).map((word) => estimateDisplayTextWidth(word, fontSize))
+  );
+  let hi = maxWidth;
+  if (lo >= hi) return greedy;
+  while (hi - lo > 0.5) {
+    const mid = (lo + hi) / 2;
+    if (wrapDisplayLine(line, fontSize, mid).length <= greedy.length) hi = mid;
+    else lo = mid;
+  }
+  return wrapDisplayLine(line, fontSize, hi);
+}
+function frostedCoverLayout(title, subtitle, context) {
+  const { width: frameW, height: frameH } = context.viewport;
+  const shortSide = Math.min(frameW, frameH);
+  const maxPlateWidth = FROSTED_SQUARE_SHARE * shortSide;
+  const minSize = themedFontSize(COVER_TITLE_MIN_BASE_PX, context, true);
+  const wrapAt = (size) => {
+    const column2 = maxPlateWidth - 2 * FROSTED_PAD_X_EM * size;
+    const lines2 = title.split("\n").flatMap((line) => balancedDisplayLines(line, size, column2));
+    const width = Math.max(...lines2.map((line) => estimateDisplayTextWidth(line, size)));
+    return { lines: lines2, width, column: column2 };
+  };
+  let fontSize = themedFontSize(fitCoverTitleSize(title), context, true);
+  let wrapped = wrapAt(fontSize);
+  while ((wrapped.lines.length > FROSTED_MAX_LINES || wrapped.width > wrapped.column) && fontSize > minSize) {
+    fontSize = Math.max(minSize, Math.floor(fontSize * 0.95));
+    wrapped = wrapAt(fontSize);
+  }
+  const { lines, column } = wrapped;
+  const textWidth = Math.min(wrapped.width, column);
+  const textHeight = lines.length * fontSize * FROSTED_LINE_HEIGHT;
+  const padX = FROSTED_PAD_X_EM * fontSize;
+  const padY = FROSTED_PAD_Y_EM * fontSize;
+  let sub;
+  if (subtitle?.trim()) {
+    const subSize = themedFontSize(COVER_SUBTITLE_BASE_PX, context, false);
+    const subLines = subtitle.split("\n").flatMap((line) => wrapDisplayLine(line, subSize, column));
+    sub = {
+      lines: subLines,
+      width: Math.min(
+        column,
+        Math.max(...subLines.map((l) => estimateDisplayTextWidth(l, subSize)))
+      ),
+      height: subLines.length * subSize * 1.3,
+      fontSize: subSize,
+      gap: 0.3 * fontSize
+    };
+  }
+  const plateWidth = Math.max(textWidth, sub?.width ?? 0) + 2 * padX;
+  const plateHeight = textHeight + (sub ? sub.gap + sub.height : 0) + 2 * padY;
+  const marginPct = frameH > frameW ? FROSTED_BOTTOM_MARGIN_PCT.tall : FROSTED_BOTTOM_MARGIN_PCT.wide;
+  const plateBottom = frameH * (1 - marginPct / 100);
+  const plateY = plateBottom - plateHeight;
+  const cx = frameW / 2;
+  const longestChars = Math.max(...lines.map((line) => line.length));
+  const titleBoxWidth = Math.max(textWidth, longestChars * fontSize * 0.5 + 1);
+  return {
+    fontSize,
+    lines,
+    plate: {
+      x: cx - plateWidth / 2,
+      y: plateY,
+      width: plateWidth,
+      height: plateHeight,
+      radius: FROSTED_RADIUS_EM * fontSize
+    },
+    // The box spans the plate's padding too: shrink-to-fit measures the font's whole
+    // ascent and descent (about 1.3 em), which overflows a box of 1.12 em lines and
+    // would scale every title down by up to 14%.
+    title: {
+      cx,
+      cy: plateY + padY + textHeight / 2,
+      width: titleBoxWidth,
+      height: textHeight + 2 * padY
+    },
+    ...sub ? {
+      subtitle: {
+        cx,
+        cy: plateY + padY + textHeight + sub.gap + sub.height / 2,
+        width: Math.max(
+          sub.width,
+          Math.max(...sub.lines.map((l) => l.length)) * sub.fontSize * 0.5 + 1
+        ),
+        height: sub.height,
+        fontSize: sub.fontSize,
+        lines: sub.lines
+      }
+    } : {},
+    baselineShift: opticalCentreShiftEm(lines),
+    blur: Math.round(FROSTED_BLUR_SHARE * shortSide)
+  };
+}
+function pct(value, total) {
+  return `${Math.round(value / total * 1e4) / 100}%`;
+}
+function frostedCoverLayers(input, context) {
+  const { theme, viewport } = context;
+  const layout = frostedCoverLayout(input.title, input.subtitle, context);
+  const lightText = relativeLuminance(theme.colors.text) > 0.5;
+  const { plate } = layout;
+  const layers = [
+    {
+      type: "shape",
+      id: "cover-plate",
+      content: {
+        shape: "rect",
+        fill: lightText ? FROSTED_TINT_UNDER_LIGHT_TEXT : FROSTED_TINT_UNDER_DARK_TEXT,
+        borderRadius: Math.round(plate.radius),
+        backdropBlur: layout.blur,
+        ...lightText ? { backdropContrast: FROSTED_BACKDROP_CONTRAST } : {}
+      },
+      position: {
+        x: pct(plate.x, viewport.width),
+        y: pct(plate.y, viewport.height),
+        width: pct(plate.width, viewport.width),
+        height: pct(plate.height, viewport.height)
+      }
+    },
+    {
+      type: "text",
+      id: "cover-title",
+      content: {
+        text: layout.lines.join("\n"),
+        style: {
+          fontSize: layout.fontSize,
+          fontFamily: getThemeFont(context, "title"),
+          fontWeight: "bold",
+          color: theme.colors.text,
+          textAlign: "center",
+          verticalAlign: "middle",
+          lineHeight: FROSTED_LINE_HEIGHT,
+          baselineShift: layout.baselineShift,
+          shadow: lightText,
+          shrinkToFit: true
+        }
+      },
+      position: {
+        x: "50%",
+        y: pct(layout.title.cy, viewport.height),
+        anchor: "center",
+        width: pct(layout.title.width, viewport.width),
+        height: pct(layout.title.height, viewport.height)
+      },
+      animation: getMotionProfile(context).coverWordReveal ? { type: "wordReveal", duration: 0.5, delay: 0.1, stagger: 0.12 } : { type: "fadeIn", duration: 0.8 }
+    }
+  ];
+  if (layout.subtitle) {
+    layers.push({
+      type: "text",
+      id: "cover-subtitle",
+      content: {
+        text: layout.subtitle.lines.join("\n"),
+        style: {
+          fontSize: layout.subtitle.fontSize,
+          fontFamily: getThemeFont(context, "body"),
+          fontWeight: "normal",
+          color: lightText ? withAlpha(theme.colors.text, 0.86) : theme.colors.textMuted,
+          textAlign: "center",
+          verticalAlign: "middle",
+          lineHeight: 1.3,
+          shrinkToFit: true
+        }
+      },
+      position: {
+        x: "50%",
+        y: pct(layout.subtitle.cy, viewport.height),
+        anchor: "center",
+        width: pct(layout.subtitle.width, viewport.width),
+        height: pct(layout.subtitle.height, viewport.height)
+      },
+      animation: motionEntrance(context, { type: "fadeIn", duration: 0.8, delay: 0.2 })
+    });
+  }
+  return layers;
+}
 function coverBlock(input, context) {
   const treatment = themedImageTreatment(context, input.imageTreatment);
   const { heroSrc, heroAlt, title, subtitle, ambientMotion, heroCredit, heroLicense } = input;
   const { theme, layout, viewport } = context;
   const standardLightCover = !heroSrc && isStandardLightCover(context);
   const titleFontSize = themedFontSize(fitCoverTitleSize(title), context, true);
-  const subtitleFontSize = themedFontSize(40, context, false);
+  const subtitleFontSize = themedFontSize(COVER_SUBTITLE_BASE_PX, context, false);
   const titleYPct = subtitle ? parseFloat(layout.primaryY) : 50;
   const maxWidthPx = parseFloat(layout.maxTextWidth) / 100 * viewport.width;
   const titleH = Math.max(
@@ -9951,31 +10194,30 @@ function coverBlock(input, context) {
   const layers = [];
   if (heroSrc) {
     const imageAnimation = mapAmbientMotion(ambientMotion);
-    layers.push(
-      {
-        type: "image",
-        id: "cover-hero",
-        content: {
-          src: heroSrc,
-          alt: heroAlt || title,
-          fit: "cover",
-          credit: heroCredit,
-          license: heroLicense,
-          ...treatment ? { treatment } : {}
-        },
-        position: { x: 0, y: 0, width: "100%", height: "100%" },
-        animation: imageAnimation
+    layers.push({
+      type: "image",
+      id: "cover-hero",
+      content: {
+        src: heroSrc,
+        alt: heroAlt || title,
+        fit: "cover",
+        credit: heroCredit,
+        license: heroLicense,
+        ...treatment ? { treatment } : {}
       },
-      {
-        type: "shape",
-        id: "cover-gradient",
-        content: {
-          shape: "rect",
-          fill: coverScrimGradient(theme.colors.background)
-        },
-        position: { x: 0, y: 0, width: "100%", height: "100%" }
-      }
-    );
+      position: { x: 0, y: 0, width: "100%", height: "100%" },
+      animation: imageAnimation
+    });
+    if (input.coverStyle === "frosted") return [...layers, ...frostedCoverLayers(input, context)];
+    layers.push({
+      type: "shape",
+      id: "cover-gradient",
+      content: {
+        shape: "rect",
+        fill: coverScrimGradient(theme.colors.background)
+      },
+      position: { x: 0, y: 0, width: "100%", height: "100%" }
+    });
   } else {
     if (standardLightCover) {
       layers.push(
@@ -10084,7 +10326,8 @@ function startBlockToCoverInput(config) {
     subtitle: config.subtitle,
     ambientMotion: config.ambientMotion,
     heroCredit: config.heroCredit,
-    heroLicense: config.heroLicense
+    heroLicense: config.heroLicense,
+    ...config.coverStyle ? { coverStyle: config.coverStyle } : {}
   };
 }
 function expandCoverBlock(config, context, template = "cover") {

package/dist/doc/index.d.ts

@@ -1,12 +1,12 @@
-import { a6 as Layer, k as Block, Q as Doc, br as TemplateBlock, bs as TemplateContext, y as CustomTemplateDefinition, bu as TemplateRegistry, bA as Theme, c4 as ViewportConfig, a_ as PersistentLayerConfig, at as MotionSpec, R as DocBlock, c5 as ViewportOrientation, aZ as PersistentLayer, bN as TitleBlockInput, bf as SectionHeaderInput, j as BigTextInput, u as ContentBlockInput, bl as StatHighlightInput, b9 as QuoteBlockInput, Y as FactCardInput, bV as TwoColumnInput, J as DateEventInput, a4 as ImageWithCaptionInput, a9 as LeftFeatureInput, bc as RightFeatureInput, ae as MapBlockInput, bk as StartBlockConfig, $ as FullBleedQuoteInput, ac as ListBlockInput, b2 as PhotoGridInput, L as DefinitionCardInput, t as ComparisonBarInput, b8 as PullQuoteInput, c3 as VideoWithCaptionInput, c2 as VideoPullQuoteInput, I as DataTableInput, M as DiagramBlockInput, bQ as TreeBlockInput, bJ as TimelineBlockInput, U as DrawingBlockInput, ai as MarkerStyle, A as AccentImage, a3 as ImageTreatment, a as AccentPosition, c as Animation, d as AnimationType, au as MotionState, ar as MotionProfile, bC as ThemeColorScheme, w as CountUpSpec, bE as ThemeRegistry, aR as PageEmphasis, bD as ThemePageStyle, S as DocDiagnostic, P as DiagramTemplateNode, O as DiagramTemplateEdge, bM as TimelineTemplateTrack, bL as TimelineTemplateLink } from '../Doc-czvrR7Oy.js';
-export { V as FRONTMATTER_CUSTOM_TEMPLATES_KEY, W as FRONTMATTER_CUSTOM_THEMES_KEY, a8 as LayoutHints, bb as RenderStyle, bB as ThemeColorPalette, bH as ThemeStyle, bI as ThemeTypography, bW as VIEWPORT_PRESETS, c6 as ViewportPreset, cb as createTemplateContext, ci as getLayoutHints, cl as getTwoColumnPositions, cm as getViewport, cn as getViewportOrientation, cr as isTemplateBlock, cx as scaledFontSize } from '../Doc-czvrR7Oy.js';
+import { a6 as Layer, k as Block, Q as Doc, br as TemplateBlock, bs as TemplateContext, y as CustomTemplateDefinition, bu as TemplateRegistry, bA as Theme, c4 as ViewportConfig, a_ as PersistentLayerConfig, at as MotionSpec, R as DocBlock, c5 as ViewportOrientation, aZ as PersistentLayer, bN as TitleBlockInput, bf as SectionHeaderInput, j as BigTextInput, u as ContentBlockInput, bl as StatHighlightInput, b9 as QuoteBlockInput, Y as FactCardInput, bV as TwoColumnInput, J as DateEventInput, a4 as ImageWithCaptionInput, a9 as LeftFeatureInput, bc as RightFeatureInput, ae as MapBlockInput, bk as StartBlockConfig, $ as FullBleedQuoteInput, ac as ListBlockInput, b2 as PhotoGridInput, L as DefinitionCardInput, t as ComparisonBarInput, b8 as PullQuoteInput, c3 as VideoWithCaptionInput, c2 as VideoPullQuoteInput, I as DataTableInput, M as DiagramBlockInput, bQ as TreeBlockInput, bJ as TimelineBlockInput, U as DrawingBlockInput, ai as MarkerStyle, A as AccentImage, a3 as ImageTreatment, a as AccentPosition, c as Animation, d as AnimationType, au as MotionState, ar as MotionProfile, bC as ThemeColorScheme, w as CountUpSpec, bE as ThemeRegistry, aR as PageEmphasis, bD as ThemePageStyle, S as DocDiagnostic, P as DiagramTemplateNode, O as DiagramTemplateEdge, bM as TimelineTemplateTrack, bL as TimelineTemplateLink } from '../Doc-CYTLtFEu.js';
+export { V as FRONTMATTER_CUSTOM_TEMPLATES_KEY, W as FRONTMATTER_CUSTOM_THEMES_KEY, a8 as LayoutHints, bb as RenderStyle, bB as ThemeColorPalette, bH as ThemeStyle, bI as ThemeTypography, bW as VIEWPORT_PRESETS, c6 as ViewportPreset, cb as createTemplateContext, ci as getLayoutHints, cl as getTwoColumnPositions, cm as getViewport, cn as getViewportOrientation, cr as isTemplateBlock, cx as scaledFontSize } from '../Doc-CYTLtFEu.js';
 import { g as BuildStep, M as MarkdownBlockNode, S as MarkdownListItem, f as BuildSpec, e as BuildCursor, h as BuildTiming, V as MarkdownNode, ae as TransitionType, ad as TransitionDirection, z as MarkdownHeading, v as MarkdownDocument, a2 as MarkdownTable, q as MarkdownCodeBlock, R as MarkdownList } from '../types-Zk8qYuaT.js';
 import { C as CoercedBlockMeta } from '../annotationCoercion-hTvELpIN.js';
-import { c as PageSection } from '../materializePageSection-mTAAHNlA.js';
-export { M as MaterializePageSectionOptions, a as MaterializePageSectionsOptions, P as PageMedia, b as PageRichText, d as PageSectionDiagnostic, e as PageSectionItem, f as PageSectionMaterialization, g as PageSectionSource, h as PageSpatialKind, i as PageTransformHints, m as materializePageSection, j as materializePageSections, r as resolvePageStyle } from '../materializePageSection-mTAAHNlA.js';
+import { c as PageSection } from '../materializePageSection-CDps_xUd.js';
+export { M as MaterializePageSectionOptions, a as MaterializePageSectionsOptions, P as PageMedia, b as PageRichText, d as PageSectionDiagnostic, e as PageSectionItem, f as PageSectionMaterialization, g as PageSectionSource, h as PageSpatialKind, i as PageTransformHints, m as materializePageSection, j as materializePageSections, r as resolvePageStyle } from '../materializePageSection-CDps_xUd.js';
 import { C as ContentContainer } from '../ContentContainer-B2w9sUoL.js';
 import { V as ViewIssue } from '../viewState-lTZS-hP_.js';
-export { D as DEFAULT_THEME, g as getAvailableThemes, b as getThemeSummaries, r as resolveTheme } from '../themeLibrary-Bsn4YNuq.js';
+export { D as DEFAULT_THEME, g as getAvailableThemes, b as getThemeSummaries, r as resolveTheme } from '../themeLibrary-CMm_jh3a.js';
 
 /** Pure build planning and evaluation, shared by interactive slides and frame export. */
 
@@ -1075,7 +1075,10 @@ declare function resolveCoverSlideSettings(frontmatter: Record<string, unknown>
  *
  * Features:
  * - Full-screen hero image with Ken Burns ambient motion
- * - Gradient overlay for text readability
+ * - Gradient overlay for text readability (default `coverStyle: 'scrim'`), or a clear
+ *   photo with the title on a frosted-glass plate (`'frosted'`): the plate rests near
+ *   the bottom, grows upward for longer titles, and stays inside the frame's centre
+ *   square so a square crop (a social link card) still shows the whole title
  * - Large centered title with optional subtitle
  * - No animation delays (shown at rest, not during playback)
  *
@@ -1102,6 +1105,8 @@ interface CoverBlockInput {
     heroLicense?: string;
     /** Per-block override for the theme's photographic image grade. */
     imageTreatment?: 'none' | 'mono' | 'duotone' | 'warm' | 'cool';
+    /** How a hero cover keeps its title legible (see StartBlockConfig.coverStyle). */
+    coverStyle?: 'scrim' | 'frosted';
 }
 /**
  * Generate cover block layers from StartBlockConfig.

package/dist/doc/index.js

@@ -75,9 +75,9 @@ import {
   validateMarkdownSource,
   wordRevealDelay,
   writeDashboardLayoutsToFrontmatter
-} from "../chunk-ECPR5JKY.js";
+} from "../chunk-56TW6HE6.js";
 import "../chunk-FTN6SGW5.js";
-import "../chunk-2DXLKKTS.js";
+import "../chunk-FUQYQWQR.js";
 import {
   BASE_INPUT_DESCRIPTORS,
   BLOCK_MEDIA_LAYOUT_POLICIES,
@@ -191,7 +191,7 @@ import {
   wrapWithPersistentLayers,
   writeCustomTemplatesToFrontmatter,
   writeCustomThemesToFrontmatter
-} from "../chunk-FVFTJ64H.js";
+} from "../chunk-YY3OQ3MI.js";
 import {
   ASCII_CHAR_H,
   ASCII_CHAR_W,
@@ -243,7 +243,7 @@ import {
   treeFromMarkdownList,
   treeFromTemplateData,
   treeToTemplateData
-} from "../chunk-JDYWKGG7.js";
+} from "../chunk-HGCIIXHP.js";
 import "../chunk-SVN7T6BK.js";
 import {
   PATH_SHAPE_KINDS,
@@ -275,20 +275,20 @@ import {
   isTemplateBlock,
   resolveTheme,
   scaledFontSize2 as scaledFontSize
-} from "../chunk-HYJ63N6V.js";
+} from "../chunk-WNEH3BZP.js";
 import "../chunk-JSGIWW35.js";
 import "../chunk-L7QZORLB.js";
-import "../chunk-PVFDR3XT.js";
+import "../chunk-3A6YM375.js";
 import {
   CONTAINER_TEMPLATES,
   TABLE_FED_TEMPLATES,
   isContainerTemplate,
   resolveTemplateName
 } from "../chunk-Y25EJEZN.js";
-import "../chunk-MWSGNEH6.js";
+import "../chunk-HE3HQZWU.js";
 import "../chunk-CZ7AUSLI.js";
 import "../chunk-P53Z4RYC.js";
-import "../chunk-4OQFLZ6G.js";
+import "../chunk-5HWYSUXS.js";
 import "../chunk-GHOPHGOK.js";
 import "../chunk-XRW6P7IF.js";
 export {

package/dist/fence/index.d.ts

@@ -1,4 +1,4 @@
-import { bA as Theme } from '../Doc-czvrR7Oy.js';
+import { bA as Theme } from '../Doc-CYTLtFEu.js';
 import '../types-Zk8qYuaT.js';
 
 /**

package/dist/generate/index.d.ts

@@ -1,6 +1,6 @@
 import { E as ExtractedElement } from '../contentExtractor-BNfVJV2U.js';
 export { C as ComparisonData, D as DateData, a as DefinitionData, b as ExtractionOptions, c as ExtractionResult, d as ExtractionType, F as FactData, I as ImpactLineData, L as ListData, Q as QuoteData, S as StatData, e as extractContent, s as stripMarkdown } from '../contentExtractor-BNfVJV2U.js';
-import { r as ColorScheme, A as AccentImage, br as TemplateBlock } from '../Doc-czvrR7Oy.js';
+import { r as ColorScheme, A as AccentImage, br as TemplateBlock } from '../Doc-CYTLtFEu.js';
 import '../types-Zk8qYuaT.js';
 
 /**

package/dist/imageEdit/index.d.ts

@@ -1,8 +1,8 @@
-import { a as ImageEditDoc, b as ImageEditLayer } from '../ImageEditDoc-BDkpwCMN.js';
-export { E as EditorLayerMeta, I as ImageEditCanvas, c as ImageEditLayerKind, d as ImageEditMeta } from '../ImageEditDoc-BDkpwCMN.js';
+import { a as ImageEditDoc, b as ImageEditLayer } from '../ImageEditDoc-DZ4k_O10.js';
+export { E as EditorLayerMeta, I as ImageEditCanvas, c as ImageEditLayerKind, d as ImageEditMeta } from '../ImageEditDoc-DZ4k_O10.js';
 import { C as ContentContainer } from '../ContentContainer-B2w9sUoL.js';
 import { V as Version, C as CoalesceOptions, P as PrunePolicy } from '../types-8QjefM9J.js';
-import '../Doc-czvrR7Oy.js';
+import '../Doc-CYTLtFEu.js';
 import '../types-Zk8qYuaT.js';
 
 /**