@bendyline/squisq-react 2.11.16 → 2.11.17

package/dist/{chunk-62UYYVCB.js → chunk-2VSD55NT.js}

@@ -1,307 +1,16 @@
-import {
-  ImageLayer,
-  MapLayer,
-  MermaidLayer,
-  PathLayer,
-  ShapeLayer,
-  TableLayer,
-  TextLayer,
-  TreeLayer,
-  VideoLayer,
-  getTransitionClass
-} from "./chunk-GFUEFU6X.js";
 import {
   useAutoSurface
 } from "./chunk-TT6ENR6T.js";
 import {
   InlineVideoPlayer,
   MarkdownRenderer
-} from "./chunk-BSDTS72D.js";
+} from "./chunk-2FZUFQO3.js";
+import {
+  BlockRenderer
+} from "./chunk-5FJZDX7H.js";
 import {
   useMediaUrl
-} from "./chunk-4L5MZ5OL.js";
-
-// src/BlockRenderer.tsx
-import { useId, useLayoutEffect, useRef, useState } from "react";
-import { resolveTransitionDuration } from "@bendyline/squisq/schemas";
-import { isGeometryBoundTemplate } from "@bendyline/squisq/doc";
-
-// src/utils/textFit.ts
-function largestFittingTextScale(fits, maximum = 2) {
-  if (maximum <= 1 || !fits(1)) return 1;
-  if (fits(maximum)) return maximum;
-  let low = 1;
-  let high = maximum;
-  for (let attempt = 0; attempt < 10; attempt += 1) {
-    const candidate = (low + high) / 2;
-    if (fits(candidate)) low = candidate;
-    else high = candidate;
-  }
-  return Math.max(1, Math.floor(low * 100) / 100);
-}
-
-// src/BlockRenderer.tsx
-import { jsx, jsxs } from "react/jsx-runtime";
-var DEFAULT_VIEWPORT = {
-  width: 1920,
-  height: 1080
-};
-var FIT_TOLERANCE_PX = 1;
-function applyTextScale(targets, scale) {
-  for (const target of targets) {
-    if (target.dataset.squisqTextFit === "html") {
-      const baseFontSize = Number(target.dataset.squisqBaseFontSize);
-      if (Number.isFinite(baseFontSize)) target.style.fontSize = `${baseFontSize * scale}px`;
-    } else {
-      target.style.transform = `scale(${scale})`;
-    }
-  }
-}
-function cssPixels(value) {
-  const parsed = parseFloat(value);
-  return Number.isFinite(parsed) ? parsed : 0;
-}
-function htmlTargetFits(target) {
-  const content = target.querySelector('[data-squisq-text-content="true"]');
-  if (!content || content.scrollWidth <= 0 || content.scrollHeight <= 0) return false;
-  const view = target.ownerDocument.defaultView;
-  const computed = view?.getComputedStyle(target);
-  const horizontalInset = computed ? cssPixels(computed.paddingLeft) + cssPixels(computed.paddingRight) + cssPixels(computed.borderLeftWidth) + cssPixels(computed.borderRightWidth) : 0;
-  const verticalInset = computed ? cssPixels(computed.paddingTop) + cssPixels(computed.paddingBottom) + cssPixels(computed.borderTopWidth) + cssPixels(computed.borderBottomWidth) : 0;
-  const availableWidth = Math.max(0, target.clientWidth - horizontalInset);
-  const availableHeight = Math.max(0, target.clientHeight - verticalInset);
-  if (content.scrollWidth > availableWidth + FIT_TOLERANCE_PX || content.scrollHeight > availableHeight + FIT_TOLERANCE_PX) {
-    return false;
-  }
-  for (const scrollRegion of content.querySelectorAll("[data-squisq-table-scroll]")) {
-    if (scrollRegion.clientWidth > 0 && scrollRegion.scrollWidth > scrollRegion.clientWidth + FIT_TOLERANCE_PX || scrollRegion.clientHeight > 0 && scrollRegion.scrollHeight > scrollRegion.clientHeight + FIT_TOLERANCE_PX) {
-      return false;
-    }
-  }
-  return true;
-}
-function svgTargetFits(target, scale) {
-  const content = target.querySelector('[data-squisq-text-content="true"]');
-  if (!content || typeof content.getBBox !== "function") return false;
-  try {
-    const box = content.getBBox();
-    const availableWidth = Number(target.dataset.squisqFitWidth);
-    const availableHeight = Number(target.dataset.squisqFitHeight);
-    return box.width > 0 && box.height > 0 && box.width * scale <= availableWidth + FIT_TOLERANCE_PX && box.height * scale <= availableHeight + FIT_TOLERANCE_PX;
-  } catch {
-    return false;
-  }
-}
-function renderedTextRects(targets) {
-  return targets.map(
-    (target) => target.querySelector('[data-squisq-text-content="true"]')?.getBoundingClientRect()
-  ).filter((rect) => !!rect && rect.width > 0 && rect.height > 0);
-}
-function overlapPairs(rects) {
-  const pairs = /* @__PURE__ */ new Set();
-  for (let left = 0; left < rects.length; left += 1) {
-    for (let right = left + 1; right < rects.length; right += 1) {
-      const a = rects[left];
-      const b = rects[right];
-      if (a.left < b.right - FIT_TOLERANCE_PX && a.right > b.left + FIT_TOLERANCE_PX && a.top < b.bottom - FIT_TOLERANCE_PX && a.bottom > b.top + FIT_TOLERANCE_PX) {
-        pairs.add(`${left}:${right}`);
-      }
-    }
-  }
-  return pairs;
-}
-function BlockRenderer({
-  block,
-  blockTime,
-  basePath,
-  isEntering = false,
-  isExiting = false,
-  transition,
-  viewport = DEFAULT_VIEWPORT,
-  isPlaying,
-  muted = false,
-  animationsEnabled = true,
-  theme,
-  tableContentRenderer,
-  growTextToFit = false
-}) {
-  let transitionClass = "";
-  const transitionStyle = {};
-  const activeTransition = animationsEnabled ? transition ?? block.transition : void 0;
-  if (activeTransition && isEntering) {
-    transitionClass = getTransitionClass(activeTransition.type, true, activeTransition.direction);
-    transitionStyle["--transition-duration"] = `${resolveTransitionDuration(activeTransition)}s`;
-  } else if (activeTransition && isExiting) {
-    transitionClass = getTransitionClass(activeTransition.type, false, activeTransition.direction);
-    transitionStyle["--transition-duration"] = `${resolveTransitionDuration(activeTransition)}s`;
-  }
-  const instanceId = useId().replace(/:/g, "");
-  const clipId = `vb-clip-${instanceId}-${block.id}`;
-  const svgRef = useRef(null);
-  const [textScale, setTextScale] = useState(1);
-  const growText = growTextToFit && !isGeometryBoundTemplate(block.template);
-  useLayoutEffect(() => {
-    const svg = svgRef.current;
-    let cancelled = false;
-    if (!svg) return;
-    const measure = () => {
-      if (cancelled) return;
-      const targets = Array.from(svg.querySelectorAll("[data-squisq-text-fit]"));
-      if (!growText || targets.length === 0) {
-        applyTextScale(targets, 1);
-        setTextScale(1);
-        return;
-      }
-      applyTextScale(targets, 1);
-      const baselineOverlaps = overlapPairs(renderedTextRects(targets));
-      const fits = (scale) => {
-        applyTextScale(targets, scale);
-        if (targets.some(
-          (target) => target.dataset.squisqTextFit === "html" ? !htmlTargetFits(target) : !svgTargetFits(target, scale)
-        )) {
-          return false;
-        }
-        const candidateOverlaps = overlapPairs(renderedTextRects(targets));
-        for (const pair of candidateOverlaps) {
-          if (!baselineOverlaps.has(pair)) return false;
-        }
-        return true;
-      };
-      const nextScale = largestFittingTextScale(fits);
-      applyTextScale(targets, nextScale);
-      setTextScale((current) => current === nextScale ? current : nextScale);
-    };
-    measure();
-    const fonts = svg.ownerDocument?.fonts;
-    if (fonts && fonts.status !== "loaded") void fonts.ready.then(measure);
-    return () => {
-      cancelled = true;
-    };
-  }, [block.layers, growText, viewport.height, viewport.width]);
-  return /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      ref: svgRef,
-      className: `block-svg ${transitionClass}`,
-      style: transitionStyle,
-      viewBox: `0 0 ${viewport.width} ${viewport.height}`,
-      preserveAspectRatio: "xMidYMid meet",
-      overflow: "hidden",
-      "data-block-id": block.id,
-      "data-squisq-text-scale": growText ? textScale : void 0,
-      children: [
-        /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { id: clipId, children: /* @__PURE__ */ jsx("rect", { x: "0", y: "0", width: viewport.width, height: viewport.height }) }) }),
-        /* @__PURE__ */ jsx("g", { clipPath: `url(#${clipId})`, children: (block.layers ?? []).map((layer) => /* @__PURE__ */ jsx(
-          LayerRenderer,
-          {
-            block,
-            layer,
-            basePath,
-            viewport,
-            blockTime,
-            isPlaying,
-            muted,
-            animationsEnabled,
-            theme,
-            tableContentRenderer,
-            textScale
-          },
-          layer.id
-        )) })
-      ]
-    }
-  );
-}
-function LayerRenderer({
-  block,
-  layer,
-  basePath,
-  viewport,
-  blockTime,
-  isPlaying,
-  muted,
-  animationsEnabled,
-  theme,
-  tableContentRenderer,
-  textScale
-}) {
-  const renderedLayer = animationsEnabled || !layer.animation ? layer : { ...layer, animation: void 0 };
-  switch (renderedLayer.type) {
-    case "image":
-      return /* @__PURE__ */ jsx(
-        ImageLayer,
-        {
-          layer: renderedLayer,
-          basePath,
-          viewport,
-          blockTime,
-          animationsEnabled
-        }
-      );
-    case "text":
-      return /* @__PURE__ */ jsx(
-        TextLayer,
-        {
-          layer: renderedLayer,
-          viewport,
-          blockTime,
-          textScale
-        }
-      );
-    case "shape":
-      return /* @__PURE__ */ jsx(ShapeLayer, { layer: renderedLayer, viewport, blockTime });
-    case "path":
-      return /* @__PURE__ */ jsx(PathLayer, { layer: renderedLayer, viewport, blockTime });
-    case "map":
-      return /* @__PURE__ */ jsx(
-        MapLayer,
-        {
-          layer: renderedLayer,
-          basePath,
-          viewport,
-          blockTime
-        }
-      );
-    case "video":
-      return /* @__PURE__ */ jsx(
-        VideoLayer,
-        {
-          layer: renderedLayer,
-          basePath,
-          viewport,
-          blockTime,
-          isPlaying,
-          muted
-        }
-      );
-    case "table":
-      return /* @__PURE__ */ jsx(
-        TableLayer,
-        {
-          block,
-          layer: renderedLayer,
-          viewport,
-          blockTime,
-          contentRenderer: tableContentRenderer
-        }
-      );
-    case "tree":
-      return /* @__PURE__ */ jsx(TreeLayer, { layer: renderedLayer, viewport, blockTime });
-    case "mermaid":
-      return /* @__PURE__ */ jsx(
-        MermaidLayer,
-        {
-          layer: renderedLayer,
-          viewport,
-          blockTime,
-          theme
-        }
-      );
-    default:
-      console.warn(`Unknown layer type: ${renderedLayer.type}`);
-      return null;
-  }
-}
+} from "./chunk-63G5OJWY.js";
 
 // src/page/PageViewContext.ts
 import { createContext, useContext } from "react";
@@ -325,7 +34,7 @@ function usePageView() {
 // src/page/CanvasSection.tsx
 import { useMemo } from "react";
 import { materializeBlockLayers } from "@bendyline/squisq/doc";
-import { jsx as jsx2 } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 function CanvasSection({ section }) {
   const { renderContext, basePath, animationsEnabled, theme } = usePageView();
   const media = section.slots.media;
@@ -342,7 +51,7 @@ function CanvasSection({ section }) {
   const aspect = canvas.aspect;
   const frame = section.hints?.frame;
   const frameClass = frame === "terminal" ? " squisq-page-canvas--terminal squisq-page-canvas--framed" : " squisq-page-canvas--framed";
-  return /* @__PURE__ */ jsx2(
+  return /* @__PURE__ */ jsx(
     "div",
     {
       className: `squisq-page-canvas${frameClass}`,
@@ -353,7 +62,7 @@ function CanvasSection({ section }) {
         maxHeight: "min(70vh, 720px)",
         maxWidth: `calc(min(70vh, 720px) * ${(aspect.width / Math.max(1, aspect.height)).toFixed(4)})`
       },
-      children: /* @__PURE__ */ jsx2(
+      children: /* @__PURE__ */ jsx(
         BlockRenderer,
         {
           block: visualBlock,
@@ -370,7 +79,7 @@ function CanvasSection({ section }) {
 
 // src/page/sections.tsx
 import { sanitizeUrl } from "@bendyline/squisq/markdown";
-import { Fragment, jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime";
 function PageImg({
   media,
   eager,
@@ -380,7 +89,7 @@ function PageImg({
   const safeSrc = sanitizeUrl(media.src, "media");
   const resolved = useMediaUrl(safeSrc ?? "", basePath);
   if (!safeSrc) return null;
-  return /* @__PURE__ */ jsx3(
+  return /* @__PURE__ */ jsx2(
     "img",
     {
       className,
@@ -400,7 +109,7 @@ function BackdropVideo({ media }) {
   const safePoster = media.posterSrc ? sanitizeUrl(media.posterSrc, "media") : void 0;
   const resolvedPoster = useMediaUrl(safePoster ?? "", basePath);
   if (!safeSrc) return null;
-  return /* @__PURE__ */ jsx3(
+  return /* @__PURE__ */ jsx2(
     "video",
     {
       src: resolvedSrc,
@@ -415,11 +124,11 @@ function BackdropVideo({ media }) {
 }
 function Eyebrow({ section }) {
   if (!section.slots.eyebrow) return null;
-  return /* @__PURE__ */ jsx3("span", { className: "squisq-page-eyebrow", children: section.slots.eyebrow });
+  return /* @__PURE__ */ jsx2("span", { className: "squisq-page-eyebrow", children: section.slots.eyebrow });
 }
 function MediaCredit({ media }) {
   if (!media || media.type === "canvas" || !media.credit) return null;
-  return /* @__PURE__ */ jsxs2("span", { className: "squisq-page-media-credit", children: [
+  return /* @__PURE__ */ jsxs("span", { className: "squisq-page-media-credit", children: [
     media.credit,
     media.license ? ` \xB7 ${media.license}` : ""
   ] });
@@ -429,33 +138,33 @@ function HeroSection({ section }) {
   const media = section.slots.media;
   const image = media?.type === "image" ? media : void 0;
   const heroStyle = pageStyle.tokens.heroStyle;
-  const body = /* @__PURE__ */ jsxs2("div", { className: "squisq-page-hero-body", children: [
-    /* @__PURE__ */ jsx3(Eyebrow, { section }),
-    /* @__PURE__ */ jsx3("h1", { className: "squisq-page-hero-title", children: section.slots.title }),
-    section.slots.subtitle && /* @__PURE__ */ jsx3("p", { className: "squisq-page-hero-subtitle", children: section.slots.subtitle })
+  const body = /* @__PURE__ */ jsxs("div", { className: "squisq-page-hero-body", children: [
+    /* @__PURE__ */ jsx2(Eyebrow, { section }),
+    /* @__PURE__ */ jsx2("h1", { className: "squisq-page-hero-title", children: section.slots.title }),
+    section.slots.subtitle && /* @__PURE__ */ jsx2("p", { className: "squisq-page-hero-subtitle", children: section.slots.subtitle })
   ] });
   if (image && heroStyle === "split") {
-    return /* @__PURE__ */ jsxs2("div", { className: "squisq-page-hero-grid", children: [
+    return /* @__PURE__ */ jsxs("div", { className: "squisq-page-hero-grid", children: [
       body,
-      /* @__PURE__ */ jsxs2("div", { className: "squisq-page-hero-media squisq-page-media-frame", children: [
-        /* @__PURE__ */ jsx3(PageImg, { media: image, eager: true }),
-        /* @__PURE__ */ jsx3(MediaCredit, { media: image })
+      /* @__PURE__ */ jsxs("div", { className: "squisq-page-hero-media squisq-page-media-frame", children: [
+        /* @__PURE__ */ jsx2(PageImg, { media: image, eager: true }),
+        /* @__PURE__ */ jsx2(MediaCredit, { media: image })
       ] })
     ] });
   }
-  return /* @__PURE__ */ jsxs2(Fragment, { children: [
-    image && section.background === "media" && /* @__PURE__ */ jsx3("div", { className: "squisq-page-hero-backdrop", children: /* @__PURE__ */ jsx3(PageImg, { media: image, eager: true }) }),
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    image && section.background === "media" && /* @__PURE__ */ jsx2("div", { className: "squisq-page-hero-backdrop", children: /* @__PURE__ */ jsx2(PageImg, { media: image, eager: true }) }),
     body
   ] });
 }
 function BannerSection({ section }) {
   const media = section.slots.media;
   const image = media?.type === "image" ? media : void 0;
-  return /* @__PURE__ */ jsxs2(Fragment, { children: [
-    image && section.background === "media" && /* @__PURE__ */ jsx3("div", { className: "squisq-page-hero-backdrop", children: /* @__PURE__ */ jsx3(PageImg, { media: image }) }),
-    /* @__PURE__ */ jsxs2("div", { className: "squisq-page-banner-body", children: [
-      /* @__PURE__ */ jsx3(Eyebrow, { section }),
-      /* @__PURE__ */ jsx3("h2", { className: "squisq-page-section-title squisq-page-banner-title", children: section.slots.title })
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    image && section.background === "media" && /* @__PURE__ */ jsx2("div", { className: "squisq-page-hero-backdrop", children: /* @__PURE__ */ jsx2(PageImg, { media: image }) }),
+    /* @__PURE__ */ jsxs("div", { className: "squisq-page-banner-body", children: [
+      /* @__PURE__ */ jsx2(Eyebrow, { section }),
+      /* @__PURE__ */ jsx2("h2", { className: "squisq-page-section-title squisq-page-banner-title", children: section.slots.title })
     ] })
   ] });
 }
@@ -466,31 +175,31 @@ function StatBandSection({ section }) {
     (item) => typeof item.value === "number" ? item.value : Number.parseFloat(String(item.value ?? ""))
   );
   const maxValue = Math.max(1, ...numericValues.filter((value) => Number.isFinite(value)));
-  return /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("div", { className: "squisq-page-stats", children: items.map((item, i) => /* @__PURE__ */ jsxs2("div", { className: `squisq-page-stat${comparison ? " squisq-page-stat--bars" : ""}`, children: [
-      /* @__PURE__ */ jsx3("span", { className: "squisq-page-stat-value", children: item.value }),
-      comparison && Number.isFinite(numericValues[i]) && /* @__PURE__ */ jsx3(
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx2("div", { className: "squisq-page-stats", children: items.map((item, i) => /* @__PURE__ */ jsxs("div", { className: `squisq-page-stat${comparison ? " squisq-page-stat--bars" : ""}`, children: [
+      /* @__PURE__ */ jsx2("span", { className: "squisq-page-stat-value", children: item.value }),
+      comparison && Number.isFinite(numericValues[i]) && /* @__PURE__ */ jsx2(
         "div",
         {
           className: "squisq-page-stat-bar",
           style: { width: `${Math.max(4, numericValues[i] / maxValue * 100)}%` }
         }
       ),
-      item.title && /* @__PURE__ */ jsx3("span", { className: "squisq-page-stat-title", children: item.title }),
-      item.body && /* @__PURE__ */ jsx3("span", { className: "squisq-page-stat-body", children: item.body })
+      item.title && /* @__PURE__ */ jsx2("span", { className: "squisq-page-stat-title", children: item.title }),
+      item.body && /* @__PURE__ */ jsx2("span", { className: "squisq-page-stat-body", children: item.body })
     ] }, i)) }),
-    section.slots.meta && /* @__PURE__ */ jsx3("div", { className: "squisq-page-stat-meta", children: section.slots.meta })
+    section.slots.meta && /* @__PURE__ */ jsx2("div", { className: "squisq-page-stat-meta", children: section.slots.meta })
   ] });
 }
 function QuoteBandSection({ section }) {
   const media = section.slots.media;
   const backdrop = section.background === "media" && media && media.type !== "canvas";
-  return /* @__PURE__ */ jsxs2(Fragment, { children: [
-    backdrop && /* @__PURE__ */ jsx3("div", { className: "squisq-page-quote-backdrop", children: media.type === "image" ? /* @__PURE__ */ jsx3(PageImg, { media }) : /* @__PURE__ */ jsx3(BackdropVideo, { media }) }),
-    section.slots.title && /* @__PURE__ */ jsx3("h2", { className: "squisq-page-section-title", children: section.slots.title }),
-    /* @__PURE__ */ jsxs2("figure", { className: "squisq-page-quote-figure", style: { margin: 0 }, children: [
-      /* @__PURE__ */ jsx3("blockquote", { className: "squisq-page-quote", children: section.slots.body?.text }),
-      section.slots.attribution && /* @__PURE__ */ jsx3("figcaption", { className: "squisq-page-quote-attribution", children: section.slots.attribution })
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    backdrop && /* @__PURE__ */ jsx2("div", { className: "squisq-page-quote-backdrop", children: media.type === "image" ? /* @__PURE__ */ jsx2(PageImg, { media }) : /* @__PURE__ */ jsx2(BackdropVideo, { media }) }),
+    section.slots.title && /* @__PURE__ */ jsx2("h2", { className: "squisq-page-section-title", children: section.slots.title }),
+    /* @__PURE__ */ jsxs("figure", { className: "squisq-page-quote-figure", style: { margin: 0 }, children: [
+      /* @__PURE__ */ jsx2("blockquote", { className: "squisq-page-quote", children: section.slots.body?.text }),
+      section.slots.attribution && /* @__PURE__ */ jsx2("figcaption", { className: "squisq-page-quote-attribution", children: section.slots.attribution })
     ] })
   ] });
 }
@@ -501,15 +210,15 @@ function FeatureSplitSection({
   const media = section.slots.media;
   const image = media?.type === "image" ? media : void 0;
   const mediaRight = flip ? section.variant !== "media-right" : section.variant === "media-right";
-  return /* @__PURE__ */ jsxs2("div", { className: `squisq-page-feature${mediaRight ? " squisq-page-feature--media-right" : ""}`, children: [
-    /* @__PURE__ */ jsxs2("div", { className: "squisq-page-feature-media squisq-page-media-frame", children: [
-      image && /* @__PURE__ */ jsx3(PageImg, { media: image }),
-      /* @__PURE__ */ jsx3(MediaCredit, { media: image })
+  return /* @__PURE__ */ jsxs("div", { className: `squisq-page-feature${mediaRight ? " squisq-page-feature--media-right" : ""}`, children: [
+    /* @__PURE__ */ jsxs("div", { className: "squisq-page-feature-media squisq-page-media-frame", children: [
+      image && /* @__PURE__ */ jsx2(PageImg, { media: image }),
+      /* @__PURE__ */ jsx2(MediaCredit, { media: image })
     ] }),
-    /* @__PURE__ */ jsxs2("div", { className: "squisq-page-feature-text", children: [
-      /* @__PURE__ */ jsx3(Eyebrow, { section }),
-      section.slots.title && /* @__PURE__ */ jsx3("h3", { className: "squisq-page-section-title squisq-page-feature-title", children: section.slots.title }),
-      section.slots.body?.text && /* @__PURE__ */ jsx3("p", { className: "squisq-page-feature-body", children: section.slots.body.text })
+    /* @__PURE__ */ jsxs("div", { className: "squisq-page-feature-text", children: [
+      /* @__PURE__ */ jsx2(Eyebrow, { section }),
+      section.slots.title && /* @__PURE__ */ jsx2("h3", { className: "squisq-page-section-title squisq-page-feature-title", children: section.slots.title }),
+      section.slots.body?.text && /* @__PURE__ */ jsx2("p", { className: "squisq-page-feature-body", children: section.slots.body.text })
     ] })
   ] });
 }
@@ -517,13 +226,13 @@ function MediaFigureSection({ section }) {
   const { basePath } = usePageView();
   const media = section.slots.media;
   if (!media || media.type === "canvas") return null;
-  return /* @__PURE__ */ jsxs2("figure", { className: "squisq-page-figure", children: [
-    /* @__PURE__ */ jsx3("div", { className: "squisq-page-media-frame", children: media.type === "image" ? /* @__PURE__ */ jsx3(PageImg, { media }) : /* @__PURE__ */ jsx3(InlineVideoPlayer, { src: media.src, poster: media.posterSrc, basePath }) }),
-    (section.slots.caption || media.credit) && /* @__PURE__ */ jsxs2("figcaption", { children: [
+  return /* @__PURE__ */ jsxs("figure", { className: "squisq-page-figure", children: [
+    /* @__PURE__ */ jsx2("div", { className: "squisq-page-media-frame", children: media.type === "image" ? /* @__PURE__ */ jsx2(PageImg, { media }) : /* @__PURE__ */ jsx2(InlineVideoPlayer, { src: media.src, poster: media.posterSrc, basePath }) }),
+    (section.slots.caption || media.credit) && /* @__PURE__ */ jsxs("figcaption", { children: [
       section.slots.caption,
-      media.credit && /* @__PURE__ */ jsxs2(Fragment, { children: [
+      media.credit && /* @__PURE__ */ jsxs(Fragment, { children: [
         section.slots.caption ? " " : "",
-        /* @__PURE__ */ jsx3(MediaCredit, { media })
+        /* @__PURE__ */ jsx2(MediaCredit, { media })
       ] })
     ] })
   ] });
@@ -531,35 +240,35 @@ function MediaFigureSection({ section }) {
 function GallerySection({ section }) {
   const items = section.slots.items ?? [];
   if (items.length === 0) {
-    return /* @__PURE__ */ jsxs2("div", { className: "squisq-page-gallery-empty", children: [
-      section.slots.title && /* @__PURE__ */ jsx3("h2", { className: "squisq-page-section-title", children: section.slots.title }),
-      section.slots.body?.text && /* @__PURE__ */ jsx3("p", { children: section.slots.body.text }),
-      section.slots.caption && /* @__PURE__ */ jsx3("div", { className: "squisq-page-gallery-caption", children: section.slots.caption })
+    return /* @__PURE__ */ jsxs("div", { className: "squisq-page-gallery-empty", children: [
+      section.slots.title && /* @__PURE__ */ jsx2("h2", { className: "squisq-page-section-title", children: section.slots.title }),
+      section.slots.body?.text && /* @__PURE__ */ jsx2("p", { children: section.slots.body.text }),
+      section.slots.caption && /* @__PURE__ */ jsx2("div", { className: "squisq-page-gallery-caption", children: section.slots.caption })
     ] });
   }
-  return /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx3("div", { className: "squisq-page-gallery", children: items.map(
-      (item, i) => item.media?.type === "image" ? /* @__PURE__ */ jsx3("div", { className: "squisq-page-media-frame", children: /* @__PURE__ */ jsx3(PageImg, { media: item.media }) }, i) : null
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx2("div", { className: "squisq-page-gallery", children: items.map(
+      (item, i) => item.media?.type === "image" ? /* @__PURE__ */ jsx2("div", { className: "squisq-page-media-frame", children: /* @__PURE__ */ jsx2(PageImg, { media: item.media }) }, i) : null
     ) }),
-    section.slots.caption && /* @__PURE__ */ jsx3("div", { className: "squisq-page-gallery-caption", children: section.slots.caption })
+    section.slots.caption && /* @__PURE__ */ jsx2("div", { className: "squisq-page-gallery-caption", children: section.slots.caption })
   ] });
 }
 function CalloutSection({ section }) {
   const media = section.slots.media;
   const image = media?.type === "image" ? media : void 0;
   const framing = section.hints?.framing;
-  return /* @__PURE__ */ jsxs2(
+  return /* @__PURE__ */ jsxs(
     "div",
     {
       className: "squisq-page-callout",
       "data-hint-framing": typeof framing === "string" ? framing : void 0,
       children: [
-        image && /* @__PURE__ */ jsx3("div", { className: "squisq-page-media-frame", children: /* @__PURE__ */ jsx3(PageImg, { media: image }) }),
-        /* @__PURE__ */ jsxs2("div", { children: [
-          /* @__PURE__ */ jsx3(Eyebrow, { section }),
-          section.slots.title && /* @__PURE__ */ jsx3("h3", { className: "squisq-page-callout-title", children: section.slots.title }),
-          section.slots.body?.text && /* @__PURE__ */ jsx3("p", { className: "squisq-page-callout-body", children: section.slots.body.text }),
-          section.slots.meta && /* @__PURE__ */ jsx3("div", { className: "squisq-page-callout-meta", children: section.slots.meta })
+        image && /* @__PURE__ */ jsx2("div", { className: "squisq-page-media-frame", children: /* @__PURE__ */ jsx2(PageImg, { media: image }) }),
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx2(Eyebrow, { section }),
+          section.slots.title && /* @__PURE__ */ jsx2("h3", { className: "squisq-page-callout-title", children: section.slots.title }),
+          section.slots.body?.text && /* @__PURE__ */ jsx2("p", { className: "squisq-page-callout-body", children: section.slots.body.text }),
+          section.slots.meta && /* @__PURE__ */ jsx2("div", { className: "squisq-page-callout-meta", children: section.slots.meta })
         ] })
       ]
     }
@@ -568,18 +277,18 @@ function CalloutSection({ section }) {
 function CardGridSection({ section }) {
   const { theme } = usePageView();
   const items = section.slots.items ?? [];
-  return /* @__PURE__ */ jsxs2(Fragment, { children: [
-    section.slots.title && /* @__PURE__ */ jsx3("h2", { className: "squisq-page-section-title squisq-page-cards-title", children: section.slots.title }),
-    /* @__PURE__ */ jsx3("div", { className: "squisq-page-cards", children: items.map((item, i) => {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    section.slots.title && /* @__PURE__ */ jsx2("h2", { className: "squisq-page-section-title squisq-page-cards-title", children: section.slots.title }),
+    /* @__PURE__ */ jsx2("div", { className: "squisq-page-cards", children: items.map((item, i) => {
       const scheme = item.accentScheme ? theme.colorSchemes?.[item.accentScheme] : void 0;
-      return /* @__PURE__ */ jsxs2(
+      return /* @__PURE__ */ jsxs(
         "div",
         {
           className: "squisq-page-card",
           style: scheme ? { "--squisq-page-card-accent": scheme.accent } : void 0,
           children: [
-            item.title && /* @__PURE__ */ jsx3("h3", { className: "squisq-page-card-title", children: item.title }),
-            item.body && /* @__PURE__ */ jsx3("p", { className: "squisq-page-card-body", children: item.body })
+            item.title && /* @__PURE__ */ jsx2("h3", { className: "squisq-page-card-title", children: item.title }),
+            item.body && /* @__PURE__ */ jsx2("p", { className: "squisq-page-card-body", children: item.body })
           ]
         },
         i
@@ -590,9 +299,9 @@ function CardGridSection({ section }) {
 function ItemListSection({ section }) {
   const { theme, showCodeCopyButton, onCopyCode, fenceRenderers, htmlPolicy, linkSchemes } = usePageView();
   const items = section.slots.items ?? [];
-  return /* @__PURE__ */ jsxs2(Fragment, { children: [
-    section.slots.title && /* @__PURE__ */ jsx3("h2", { className: "squisq-page-section-title squisq-page-items-title", children: section.slots.title }),
-    /* @__PURE__ */ jsx3("ol", { className: "squisq-page-items", children: items.map((item, i) => /* @__PURE__ */ jsx3("li", { children: /* @__PURE__ */ jsx3("div", { className: "squisq-page-item-body", children: item.markdown ? /* @__PURE__ */ jsx3(
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    section.slots.title && /* @__PURE__ */ jsx2("h2", { className: "squisq-page-section-title squisq-page-items-title", children: section.slots.title }),
+    /* @__PURE__ */ jsx2("ol", { className: "squisq-page-items", children: items.map((item, i) => /* @__PURE__ */ jsx2("li", { children: /* @__PURE__ */ jsx2("div", { className: "squisq-page-item-body", children: item.markdown ? /* @__PURE__ */ jsx2(
       MarkdownRenderer,
       {
         nodes: item.markdown,
@@ -609,12 +318,12 @@ function ItemListSection({ section }) {
 function TimelineRailSection({ section }) {
   const milestone = section.slots.milestone;
   if (!milestone) return null;
-  return /* @__PURE__ */ jsxs2("div", { className: "squisq-page-milestone", "data-mood": milestone.mood, children: [
-    /* @__PURE__ */ jsx3("div", { className: "squisq-page-milestone-date", children: milestone.date }),
-    /* @__PURE__ */ jsx3("div", { className: "squisq-page-milestone-rail", "aria-hidden": "true" }),
-    /* @__PURE__ */ jsxs2("div", { className: "squisq-page-milestone-body", children: [
+  return /* @__PURE__ */ jsxs("div", { className: "squisq-page-milestone", "data-mood": milestone.mood, children: [
+    /* @__PURE__ */ jsx2("div", { className: "squisq-page-milestone-date", children: milestone.date }),
+    /* @__PURE__ */ jsx2("div", { className: "squisq-page-milestone-rail", "aria-hidden": "true" }),
+    /* @__PURE__ */ jsxs("div", { className: "squisq-page-milestone-body", children: [
       milestone.description,
-      milestone.footer && /* @__PURE__ */ jsx3("div", { className: "squisq-page-milestone-footer", children: milestone.footer })
+      milestone.footer && /* @__PURE__ */ jsx2("div", { className: "squisq-page-milestone-footer", children: milestone.footer })
     ] })
   ] });
 }
@@ -622,17 +331,17 @@ function TableSection({ section }) {
   const table = section.slots.table;
   if (!table) return null;
   const alignFor = (i) => table.align?.[i] ?? void 0;
-  return /* @__PURE__ */ jsxs2(Fragment, { children: [
-    section.slots.title && /* @__PURE__ */ jsx3("h2", { className: "squisq-page-section-title squisq-page-table-title", children: section.slots.title }),
-    /* @__PURE__ */ jsx3("div", { className: "squisq-page-table-scroll", children: /* @__PURE__ */ jsxs2("table", { className: "squisq-page-table", children: [
-      /* @__PURE__ */ jsx3("thead", { children: /* @__PURE__ */ jsx3("tr", { children: table.headers.map((header, i) => /* @__PURE__ */ jsx3("th", { style: { textAlign: alignFor(i) }, children: header }, i)) }) }),
-      /* @__PURE__ */ jsx3("tbody", { children: table.rows.map((row, r) => /* @__PURE__ */ jsx3("tr", { children: row.map((cell, c) => /* @__PURE__ */ jsx3("td", { style: { textAlign: alignFor(c) }, children: cell }, c)) }, r)) })
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    section.slots.title && /* @__PURE__ */ jsx2("h2", { className: "squisq-page-section-title squisq-page-table-title", children: section.slots.title }),
+    /* @__PURE__ */ jsx2("div", { className: "squisq-page-table-scroll", children: /* @__PURE__ */ jsxs("table", { className: "squisq-page-table", children: [
+      /* @__PURE__ */ jsx2("thead", { children: /* @__PURE__ */ jsx2("tr", { children: table.headers.map((header, i) => /* @__PURE__ */ jsx2("th", { style: { textAlign: alignFor(i) }, children: header }, i)) }) }),
+      /* @__PURE__ */ jsx2("tbody", { children: table.rows.map((row, r) => /* @__PURE__ */ jsx2("tr", { children: row.map((cell, c) => /* @__PURE__ */ jsx2("td", { style: { textAlign: alignFor(c) }, children: cell }, c)) }, r)) })
     ] }) })
   ] });
 }
 function ProseSection({ section, block }) {
   const { theme, showCodeCopyButton, onCopyCode, fenceRenderers, htmlPolicy, linkSchemes } = usePageView();
-  const heading = section.slots.title !== void 0 && block?.sourceHeading ? /* @__PURE__ */ jsx3(
+  const heading = section.slots.title !== void 0 && block?.sourceHeading ? /* @__PURE__ */ jsx2(
     MarkdownRenderer,
     {
       nodes: [block.sourceHeading],
@@ -644,9 +353,9 @@ function ProseSection({ section, block }) {
     }
   ) : null;
   const bodyNodes = section.slots.body?.markdown ?? block?.contents;
-  return /* @__PURE__ */ jsxs2("div", { className: "squisq-page-prose", children: [
+  return /* @__PURE__ */ jsxs("div", { className: "squisq-page-prose", children: [
     heading,
-    bodyNodes && bodyNodes.length > 0 && /* @__PURE__ */ jsx3(
+    bodyNodes && bodyNodes.length > 0 && /* @__PURE__ */ jsx2(
       MarkdownRenderer,
       {
         nodes: bodyNodes,
@@ -661,15 +370,15 @@ function ProseSection({ section, block }) {
   ] });
 }
 function FooterSection({ section }) {
-  return /* @__PURE__ */ jsxs2("div", { children: [
-    /* @__PURE__ */ jsx3(Eyebrow, { section }),
-    section.slots.title && /* @__PURE__ */ jsx3("h2", { className: "squisq-page-section-title", children: section.slots.title }),
-    section.slots.body?.text && /* @__PURE__ */ jsx3("p", { children: section.slots.body.text })
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx2(Eyebrow, { section }),
+    section.slots.title && /* @__PURE__ */ jsx2("h2", { className: "squisq-page-section-title", children: section.slots.title }),
+    section.slots.body?.text && /* @__PURE__ */ jsx2("p", { children: section.slots.body.text })
   ] });
 }
 
 // src/page/PageSectionView.tsx
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
 function heroHasBackdrop(section, heroStyle) {
   return section.kind === "hero" && section.background === "media" && section.slots.media?.type === "image" && heroStyle !== "split";
 }
@@ -686,36 +395,36 @@ function sectionBody(entry, featureFlip) {
   const { section, block } = entry;
   switch (section.kind) {
     case "hero":
-      return /* @__PURE__ */ jsx4(HeroSection, { section, block });
+      return /* @__PURE__ */ jsx3(HeroSection, { section, block });
     case "banner":
-      return /* @__PURE__ */ jsx4(BannerSection, { section, block });
+      return /* @__PURE__ */ jsx3(BannerSection, { section, block });
     case "stat-band":
-      return /* @__PURE__ */ jsx4(StatBandSection, { section, block });
+      return /* @__PURE__ */ jsx3(StatBandSection, { section, block });
     case "quote-band":
-      return /* @__PURE__ */ jsx4(QuoteBandSection, { section, block });
+      return /* @__PURE__ */ jsx3(QuoteBandSection, { section, block });
     case "feature-split":
-      return /* @__PURE__ */ jsx4(FeatureSplitSection, { section, block, flip: featureFlip });
+      return /* @__PURE__ */ jsx3(FeatureSplitSection, { section, block, flip: featureFlip });
     case "media-figure":
-      return /* @__PURE__ */ jsx4(MediaFigureSection, { section, block });
+      return /* @__PURE__ */ jsx3(MediaFigureSection, { section, block });
     case "gallery":
-      return /* @__PURE__ */ jsx4(GallerySection, { section, block });
+      return /* @__PURE__ */ jsx3(GallerySection, { section, block });
     case "callout":
-      return /* @__PURE__ */ jsx4(CalloutSection, { section, block });
+      return /* @__PURE__ */ jsx3(CalloutSection, { section, block });
     case "card-grid":
-      return /* @__PURE__ */ jsx4(CardGridSection, { section, block });
+      return /* @__PURE__ */ jsx3(CardGridSection, { section, block });
     case "item-list":
-      return /* @__PURE__ */ jsx4(ItemListSection, { section, block });
+      return /* @__PURE__ */ jsx3(ItemListSection, { section, block });
     case "timeline-rail":
-      return /* @__PURE__ */ jsx4(TimelineRailSection, { section, block });
+      return /* @__PURE__ */ jsx3(TimelineRailSection, { section, block });
     case "table-section":
-      return /* @__PURE__ */ jsx4(TableSection, { section, block });
+      return /* @__PURE__ */ jsx3(TableSection, { section, block });
     case "canvas-embed":
-      return /* @__PURE__ */ jsx4(CanvasSection, { section });
+      return /* @__PURE__ */ jsx3(CanvasSection, { section });
     case "footer":
-      return /* @__PURE__ */ jsx4(FooterSection, { section, block });
+      return /* @__PURE__ */ jsx3(FooterSection, { section, block });
     case "prose":
     default:
-      return /* @__PURE__ */ jsx4(ProseSection, { section, block });
+      return /* @__PURE__ */ jsx3(ProseSection, { section, block });
   }
 }
 function PageSectionView({ entry, featureFlip, isLeadProse }) {
@@ -746,7 +455,7 @@ function PageSectionView({ entry, featureFlip, isLeadProse }) {
   if (section.hints?.dropCap && isLeadProse) hintAttrs["data-hint-drop-cap"] = "";
   const headingLevel = section.kind !== "hero" && section.slots.title !== void 0 ? section.slots.headingLevel ?? entry.block?.sourceHeading?.depth : void 0;
   if (headingLevel !== void 0) hintAttrs["data-heading-level"] = String(headingLevel);
-  return /* @__PURE__ */ jsx4(
+  return /* @__PURE__ */ jsx3(
     "section",
     {
       className: classes.join(" "),
@@ -756,9 +465,9 @@ function PageSectionView({ entry, featureFlip, isLeadProse }) {
       "data-template": section.template,
       style: accentVars(section),
       ...hintAttrs,
-      children: /* @__PURE__ */ jsxs3("div", { className: "squisq-page-section-inner", children: [
+      children: /* @__PURE__ */ jsxs2("div", { className: "squisq-page-section-inner", children: [
         sectionBody(entry, featureFlip),
-        richContent && richContent.length > 0 && /* @__PURE__ */ jsx4("div", { className: "squisq-page-rich-content", children: /* @__PURE__ */ jsx4(
+        richContent && richContent.length > 0 && /* @__PURE__ */ jsx3("div", { className: "squisq-page-rich-content", children: /* @__PURE__ */ jsx3(
           MarkdownRenderer,
           {
             nodes: richContent,
@@ -776,7 +485,7 @@ function PageSectionView({ entry, featureFlip, isLeadProse }) {
 }
 
 // src/LinearDocView.tsx
-import { useEffect, useMemo as useMemo2, useRef as useRef2 } from "react";
+import { useEffect, useMemo as useMemo2, useRef } from "react";
 import {
   applySurface,
   resolveFontFamily
@@ -793,7 +502,7 @@ import {
 } from "@bendyline/squisq/doc";
 import { parseMarkdown } from "@bendyline/squisq/markdown";
 import { fenceRendererLangs } from "@bendyline/squisq/fence";
-import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
 function LinearDocView({
   doc,
   markdown,
@@ -815,7 +524,7 @@ function LinearDocView({
   htmlPolicy,
   linkSchemes
 }) {
-  const scrollRef = useRef2(null);
+  const scrollRef = useRef(null);
   const activeViewport = viewport ?? VIEWPORT_PRESETS2.landscape;
   const markdownDoc = useMemo2(
     () => !doc && markdown !== void 0 ? markdownToDoc(parseMarkdown(markdown)) : void 0,
@@ -932,7 +641,7 @@ function LinearDocView({
     return () => document.removeEventListener("keydown", handleKeyDown);
   }, [globalKeyboardShortcuts]);
   if (!resolvedDoc) {
-    return /* @__PURE__ */ jsx5("div", { ref: scrollRef, className: `squisq-linear squisq-linear--empty ${className || ""}` });
+    return /* @__PURE__ */ jsx4("div", { ref: scrollRef, className: `squisq-linear squisq-linear--empty ${className || ""}` });
   }
   const bgColor = activeTheme.colors.background;
   const textColor = activeTheme.colors.text;
@@ -949,7 +658,7 @@ function LinearDocView({
     variant === "document" ? "squisq-linear-content--document squisq-page--document" : "",
     imageDisplayMode === "thumbnail" ? "squisq-linear-content--thumbnail-images squisq-page--thumbnail-images" : ""
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsx4(
     "div",
     {
       ref: scrollRef,
@@ -974,7 +683,7 @@ function LinearDocView({
         containerType: "inline-size",
         containerName: "squisq-page"
       },
-      children: /* @__PURE__ */ jsxs4(
+      children: /* @__PURE__ */ jsxs3(
         "div",
         {
           className: contentClasses,
@@ -995,11 +704,11 @@ function LinearDocView({
             "--squisq-linear-bg": bgColor
           },
           children: [
-            /* @__PURE__ */ jsx5("style", { "data-squisq-page": "", children: PAGE_BASE_CSS }),
-            /* @__PURE__ */ jsx5(PageViewContext.Provider, { value: pageContext, children: sections.map((entry) => {
+            /* @__PURE__ */ jsx4("style", { "data-squisq-page": "", children: PAGE_BASE_CSS }),
+            /* @__PURE__ */ jsx4(PageViewContext.Provider, { value: pageContext, children: sections.map((entry) => {
               const ordinal = featureOrdinals.get(entry.section.index) ?? 0;
               const flip = !!entry.section.hints?.alternate && ordinal % 2 === 1;
-              return /* @__PURE__ */ jsx5(
+              return /* @__PURE__ */ jsx4(
                 PageSectionView,
                 {
                   entry,
@@ -1017,7 +726,6 @@ function LinearDocView({
 }
 
 export {
-  BlockRenderer,
   PageViewContext,
   usePageView,
   CanvasSection,