@bettercms-ai/ui 0.20.1 → 0.23.1

package/dist/renderer.js

@@ -67,6 +67,24 @@ var PT_TYPES = {
   pullQuote: "pullQuote",
   /** Key takeaways — see `PortableTextKeyTakeaways`. The V2 kit's `<aside data-rt="takeaways">`. */
   keyTakeaways: "keyTakeaways",
+  /**
+   * A third-party embed (X, CodePen, Figma, Maps, Spotify, Podcasts, audio, a link card) — see
+   * `PortableTextEmbed` and `embed.ts`. The V2 kit's `<figure data-rt="embed">`. Gated by the
+   * `embed` feature; YouTube and Vimeo links still resolve here too, through the video resolver.
+   */
+  embed: "embed",
+  /** A gallery of images, a grid or a carousel — see `PortableTextGallery`. The V2 kit's `<figure data-rt="gallery">`. */
+  gallery: "gallery",
+  /** A table of contents built from the headings — see `PortableTextTableOfContents`. The V2 kit's `<nav data-rt="toc">`. */
+  tableOfContents: "tableOfContents",
+  /** A footnote, an INLINE object in body text — see `PortableTextFootnote`. The V2 kit's `<sup data-rt="fn">`. */
+  footnote: "footnote",
+  /** Columns of text — see `PortableTextColumns`. The V2 kit's `<div data-rt="columns">`; the legacy `builtin:columns` reads the same way. */
+  columns: "columns",
+  /** An author bio — see `PortableTextAuthorBio`. The V2 kit's `<aside data-rt="author">`. */
+  authorBio: "authorBio",
+  /** Related posts — see `PortableTextRelatedPosts`. The V2 kit's `<aside data-rt="related">`. */
+  relatedPosts: "relatedPosts",
   /**
    * A table. Spelled `table`, unprefixed, because that is what every other Portable Text
    * producer calls one — the Sanity-shaped `{_type:"table", rows}` this platform used to refuse
@@ -93,7 +111,13 @@ var STORABLE_BLOCK_TYPES = /* @__PURE__ */ new Set([
   PT_TYPES.video,
   PT_TYPES.file,
   PT_TYPES.pullQuote,
-  PT_TYPES.keyTakeaways
+  PT_TYPES.keyTakeaways,
+  PT_TYPES.embed,
+  PT_TYPES.gallery,
+  PT_TYPES.tableOfContents,
+  PT_TYPES.columns,
+  PT_TYPES.authorBio,
+  PT_TYPES.relatedPosts
 ]);
 var EMBEDDED_COMPONENT_KEY = "component";
 
@@ -568,16 +592,109 @@ function keyTakeawaysView(value) {
   return { title, points };
 }
 
-// ../richtext/src/component-copy.ts
+// ../richtext/src/image-layout.ts
+import {
+  focalInCrop,
+  formatImageRect,
+  imageValueUrl,
+  normalizeImageCrop,
+  normalizeImageFocal,
+  objectPosition,
+  parseImageRect
+} from "@bettercms-ai/image-url";
+function richTextImageFrame(src, crop, focal) {
+  const c = normalizeImageCrop(crop);
+  const f = normalizeImageFocal(focal);
+  if (!c && !f) return { src, crop: null, focal: null, position: null, data: [] };
+  const drawn = imageValueUrl({ url: src, crop: c, focal: f }) ?? src;
+  const data = [];
+  if (drawn !== src) data.push(["data-src", src]);
+  if (c) data.push(["data-crop", formatImageRect(c)]);
+  if (f) data.push(["data-focal", `${f.x},${f.y}`]);
+  return { src: drawn, crop: c, focal: f, position: f ? objectPosition(focalInCrop(f, c)) : null, data };
+}
+
+// ../richtext/src/gallery.ts
 var isRecord3 = (v) => !!v && typeof v === "object" && !Array.isArray(v);
-var fieldsOf = (value) => isRecord3(value) && value.schemaKey === EMBEDDED_COMPONENT_KEY && isRecord3(value.fields) ? value.fields : null;
+var galleryMediaSrc = (raw) => safeHref(raw) ?? (raw !== "" && !raw.startsWith("//") && !/[:\s]/.test(raw) ? raw : null);
+var GALLERY_STYLES = {
+  grid: {
+    ul: "display:grid;grid-template-columns:repeat(auto-fill,minmax(12rem,1fr));gap:1rem;list-style:none;margin:0;padding:0",
+    li: "margin:0",
+    figure: "margin:0",
+    img: "display:block;width:100%;height:auto"
+  },
+  carousel: {
+    ul: "display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;list-style:none;margin:0;padding:0",
+    li: "flex:0 0 100%;scroll-snap-align:start;margin:0",
+    figure: "margin:0",
+    img: "display:block;width:100%;height:auto"
+  }
+};
+function galleryView(value) {
+  const v = isRecord3(value) ? value : {};
+  const layout = v.layout === "carousel" ? "carousel" : "grid";
+  const images = [];
+  (Array.isArray(v.images) ? v.images : []).forEach((item, i) => {
+    if (!isRecord3(item) || !isRecord3(item.image)) return;
+    const src = galleryMediaSrc(typeof item.image.src === "string" ? item.image.src.trim() : "");
+    if (!src) return;
+    const frame = richTextImageFrame(src, item.image.crop, item.image.focal);
+    images.push({
+      key: typeof item._key === "string" && item._key ? item._key : `i${i}`,
+      src: frame.src,
+      position: frame.position,
+      data: frame.data,
+      alt: typeof item.image.alt === "string" ? item.image.alt : "",
+      caption: typeof item.caption === "string" ? item.caption.trim() : ""
+    });
+  });
+  return { layout, images };
+}
+
+// ../richtext/src/columns.ts
+var PT_COLUMNS_LIMITS = { min: 2, max: 4 };
+var BUILTIN_COLUMNS_KEY = "builtin:columns";
+var isRecord4 = (v) => !!v && typeof v === "object" && !Array.isArray(v);
+var COLUMNS_STYLES = {
+  s: { row: "display:flex;flex-wrap:wrap;gap:0.75rem", col: "flex:1 1 14rem;min-width:0" },
+  m: { row: "display:flex;flex-wrap:wrap;gap:1.25rem", col: "flex:1 1 14rem;min-width:0" },
+  l: { row: "display:flex;flex-wrap:wrap;gap:2rem", col: "flex:1 1 14rem;min-width:0" }
+};
+var legacyContent = (text, key) => text.split(/\n{2,}/).filter((p) => p.trim() !== "").map((p, i) => ({ _type: "block", _key: `${key}p${i}`, style: "normal", markDefs: [], children: [{ _type: "span", _key: `${key}s${i}`, text: p, marks: [] }] }));
+function columnsView(node) {
+  if (!isRecord4(node)) return null;
+  if (node._type === PT_TYPES.columns) {
+    const gap = node.gap === "s" || node.gap === "l" ? node.gap : "m";
+    const columns = (Array.isArray(node.columns) ? node.columns : []).map((c, i) => ({
+      key: isRecord4(c) && typeof c._key === "string" && c._key ? c._key : `c${i}`,
+      content: isRecord4(c) && Array.isArray(c.content) ? c.content : []
+    }));
+    return { gap, columns };
+  }
+  if (node._type === PT_TYPES.block && node.schemaKey === BUILTIN_COLUMNS_KEY) {
+    const f = isRecord4(node.fields) ? node.fields : {};
+    if (!Array.isArray(f.columns) || !f.columns.every((c) => typeof c === "string")) return null;
+    const gap = f.gap === "small" ? "s" : f.gap === "large" ? "l" : "m";
+    const columns = (Array.isArray(f.columns) ? f.columns : []).slice(0, PT_COLUMNS_LIMITS.max).map((c, i) => ({
+      key: `c${i}`,
+      content: legacyContent(typeof c === "string" ? c : "", `c${i}`)
+    }));
+    return { gap, columns };
+  }
+  return null;
+}
+
+// ../richtext/src/component-copy.ts
+var isRecord5 = (v) => !!v && typeof v === "object" && !Array.isArray(v);
+var fieldsOf = (value) => isRecord5(value) && value.schemaKey === EMBEDDED_COMPONENT_KEY && isRecord5(value.fields) ? value.fields : null;
 function detachedComponentCopy(value) {
   const f = fieldsOf(value);
   if (!f || f.detached !== true || !Array.isArray(f.blocks)) return null;
   return {
-    id: isRecord3(value) && typeof value._key === "string" ? value._key : "",
+    id: isRecord5(value) && typeof value._key === "string" ? value._key : "",
     componentId: typeof f.componentId === "string" ? f.componentId : "",
-    props: isRecord3(f.props) ? f.props : {},
+    props: isRecord5(f.props) ? f.props : {},
     blocks: f.blocks,
     ...typeof f.sourcePublishedAt === "string" ? { sourcePublishedAt: f.sourcePublishedAt } : {},
     ...typeof f.variant === "string" ? { variant: f.variant } : {}
@@ -590,7 +707,7 @@ function componentCopyLines(copy) {
       const t = v.replace(/<[^>]+>/g, " ").replace(/&nbsp;/g, " ").replace(/\s+/g, " ").trim();
       return t || null;
     }
-    if (isRecord3(v)) return line(v.label ?? v.text ?? v.title);
+    if (isRecord5(v)) return line(v.label ?? v.text ?? v.title);
     return null;
   };
   return Object.values(copy.props).map(line).filter((s) => !!s);
@@ -617,6 +734,18 @@ function portableTextToPlainText(value) {
       lines.push(...title ? [title] : [], ...points);
       continue;
     }
+    if (node._type === PT_TYPES.gallery) {
+      lines.push(...galleryView(node).images.map((x) => x.caption).filter(Boolean));
+      continue;
+    }
+    const cols = columnsView(node);
+    if (cols) {
+      for (const c of cols.columns) {
+        const text = portableTextToPlainText(c.content);
+        if (text) lines.push(text);
+      }
+      continue;
+    }
     const table = migrateTable(node);
     if (table) {
       lines.push(...tableLines(table));
@@ -655,20 +784,121 @@ var pullQuoteLines = (v) => {
   return [text(v.quote), ...by ? [`\u2014 ${by}`] : []].filter(Boolean);
 };
 
+// ../richtext/src/toc.ts
+import { slugify } from "@bettercms-ai/types";
+var isRecord6 = (v) => !!v && typeof v === "object" && !Array.isArray(v);
+var isHeadingAnchor = (v) => typeof v === "string" && /^[A-Za-z0-9][A-Za-z0-9_:.-]{0,127}$/.test(v);
+var headingText = (node) => (Array.isArray(node.children) ? node.children : []).map((c) => isRecord6(c) && typeof c.text === "string" ? c.text : "").join("").replace(/​/g, "").trim();
+function outlineOf(value) {
+  const heads = [];
+  const used = /* @__PURE__ */ new Set();
+  for (const node of Array.isArray(value) ? value : []) {
+    if (!isRecord6(node) || node._type !== "block" || node.listItem || node.style !== "h2" && node.style !== "h3") continue;
+    const text = headingText(node);
+    if (!text) continue;
+    const anchor = isHeadingAnchor(node.anchor) && !used.has(node.anchor) ? node.anchor : null;
+    if (anchor) used.add(anchor);
+    heads.push({ node, text, anchor });
+  }
+  const items = [];
+  const nodes = /* @__PURE__ */ new WeakMap();
+  for (const { node, text, anchor } of heads) {
+    let id = anchor;
+    if (!id) {
+      const base = slugify(text);
+      id = base;
+      for (let n = 2; used.has(id); n++) id = `${base}-${n}`;
+      used.add(id);
+    }
+    nodes.set(node, id);
+    items.push({ id, text, depth: node.style === "h2" ? 2 : 3 });
+  }
+  return { items, nodes };
+}
+function tocTree(items, depth) {
+  const out = [];
+  for (const it of items) {
+    if (it.depth === 3 && depth === "2") continue;
+    const last = out[out.length - 1];
+    if (it.depth === 3 && last) last.children.push(it);
+    else out.push({ ...it, children: [] });
+  }
+  return out;
+}
+function tocView(value) {
+  const v = isRecord6(value) ? value : {};
+  const title = typeof v.title === "string" ? v.title.trim() : "";
+  return { title, label: title || "Table of contents", depth: v.depth === "2" ? "2" : "3" };
+}
+
+// ../richtext/src/footnote.ts
+var isRecord7 = (v) => !!v && typeof v === "object" && !Array.isArray(v);
+function footnoteOrder(value) {
+  const notes = [];
+  const nodes = /* @__PURE__ */ new WeakMap();
+  for (const node of Array.isArray(value) ? value : []) {
+    if (!isRecord7(node) || node._type !== "block" || !Array.isArray(node.children)) continue;
+    for (const child of node.children) {
+      if (!isRecord7(child) || child._type !== PT_TYPES.footnote) continue;
+      nodes.set(child, notes.push(typeof child.note === "string" ? child.note : ""));
+    }
+  }
+  return { notes, nodes };
+}
+
+// ../richtext/src/references.ts
+var PT_RELATED_LIMITS = { titleChars: 40, minCount: 1, maxCount: 6, posts: 6 };
+var isRecord8 = (v) => !!v && typeof v === "object" && !Array.isArray(v);
+var refOf = (v) => isRecord8(v) && typeof v._ref === "string" ? v._ref : "";
+var imageSrc = (raw) => safeHref(raw) ?? (raw !== "" && !raw.startsWith("//") && !/[:\s]/.test(raw) ? raw : null);
+function relatedPostsView(value, resolved = {}) {
+  const v = isRecord8(value) ? value : {};
+  const title = typeof v.title === "string" ? v.title.trim() : "";
+  const mode = v.mode === "manual" || v.mode === "newest" ? v.mode : "topic";
+  const n = typeof v.count === "number" && Number.isInteger(v.count) ? v.count : 3;
+  const count = Math.min(PT_RELATED_LIMITS.maxCount, Math.max(PT_RELATED_LIMITS.minCount, n));
+  const picked = (Array.isArray(v.posts) ? v.posts : []).map(refOf).filter(Boolean);
+  const key = typeof v._key === "string" ? v._key : "";
+  const ids = mode === "manual" ? picked : (resolved.related?.[key] ?? []).slice(0, count);
+  const items = [];
+  for (const id of ids) {
+    const post = resolved.posts?.[id];
+    const url = post && typeof post.url === "string" ? safeHref(post.url) : null;
+    if (post && typeof post.title === "string" && url) items.push({ ...post, id, url });
+  }
+  return { key, title, mode, count, picked, items };
+}
+function authorBioView(value, resolved = {}) {
+  const key = isRecord8(value) && typeof value._key === "string" ? value._key : "";
+  const id = refOf(isRecord8(value) ? value.author : void 0);
+  const a = id ? resolved.authors?.[id] : void 0;
+  if (!a || typeof a.name !== "string") return { key, id, author: null };
+  const avatar = typeof a.avatar === "string" ? imageSrc(a.avatar.trim()) : null;
+  return {
+    key,
+    id,
+    author: {
+      name: a.name,
+      ...avatar ? { avatar } : {},
+      ...typeof a.bio === "string" && a.bio.trim() ? { bio: a.bio.trim() } : {}
+    }
+  };
+}
+
 // ../richtext/src/read.ts
-var isRecord4 = (v) => !!v && typeof v === "object" && !Array.isArray(v);
+var isRecord9 = (v) => !!v && typeof v === "object" && !Array.isArray(v);
 function normalizePortableText(value, key = randomKey) {
   if (!Array.isArray(value)) return [];
   return value.flatMap((raw) => {
-    if (!isRecord4(raw) || typeof raw._type !== "string") return [];
+    if (!isRecord9(raw) || typeof raw._type !== "string") return [];
     const table = migrateTable(raw, key, (v, cellKey) => normalizePortableText(v, cellKey));
     if (table) return [table];
-    const node = { ...raw, _key: isRecord4(raw) && typeof raw._key === "string" && raw._key ? raw._key : key() };
+    const node = { ...raw, _key: isRecord9(raw) && typeof raw._key === "string" && raw._key ? raw._key : key() };
     if (node._type === "block") {
       if (!Array.isArray(node.markDefs)) node.markDefs = [];
       if (typeof node.style !== "string") node.style = "normal";
       node.children = (Array.isArray(node.children) ? node.children : []).map((c) => {
-        if (!isRecord4(c)) return c;
+        if (!isRecord9(c)) return c;
         const child = { ...c, _key: typeof c._key === "string" && c._key ? c._key : key() };
         if (child._type === "span" && !Array.isArray(child.marks)) child.marks = [];
         return child;
@@ -678,12 +908,219 @@ function normalizePortableText(value, key = randomKey) {
   });
 }
 function readStructuredContent(props) {
-  if (!isRecord4(props)) return null;
+  if (!isRecord9(props)) return null;
   const candidate = props.content ?? props.value;
-  const arr = Array.isArray(candidate) ? candidate : isRecord4(candidate) ? Array.isArray(candidate.content) ? candidate.content : Array.isArray(candidate.value) ? candidate.value : null : null;
+  const arr = Array.isArray(candidate) ? candidate : isRecord9(candidate) ? Array.isArray(candidate.content) ? candidate.content : Array.isArray(candidate.value) ? candidate.value : null : null;
   return arr && arr.length > 0 ? arr : null;
 }
 
+// ../richtext/src/video.ts
+var videoId = (value) => value && /^[a-zA-Z0-9_-]{6,32}$/.test(value) ? value : null;
+function resolveVideoSource(value) {
+  if (typeof value !== "string" || !value.trim()) return null;
+  let parsed;
+  try {
+    parsed = new URL(value.trim());
+  } catch {
+    return null;
+  }
+  if (parsed.protocol !== "http:" && parsed.protocol !== "https:") return null;
+  const host = parsed.hostname.toLowerCase().replace(/^www\./, "");
+  let id = null;
+  if (host === "youtu.be") id = videoId(parsed.pathname.split("/").filter(Boolean)[0]);
+  if (host === "youtube.com" || host === "m.youtube.com" || host === "youtube-nocookie.com") {
+    id = videoId(
+      parsed.searchParams.get("v") ?? parsed.pathname.match(/^\/(?:embed|shorts)\/([^/?#]+)/)?.[1]
+    );
+  }
+  if (id) {
+    return {
+      kind: "iframe",
+      src: `https://www.youtube-nocookie.com/embed/${id}`,
+      provider: "YouTube"
+    };
+  }
+  if (host === "vimeo.com" || host === "player.vimeo.com") {
+    const segments = parsed.pathname.split("/").filter(Boolean);
+    let vimeoId = null;
+    for (let i = segments.length - 1; i >= 0; i -= 1) {
+      if (/^\d+$/.test(segments[i])) {
+        vimeoId = segments[i];
+        break;
+      }
+    }
+    if (vimeoId) {
+      return {
+        kind: "iframe",
+        src: `https://player.vimeo.com/video/${vimeoId}`,
+        provider: "Vimeo"
+      };
+    }
+  }
+  if (/\.(?:m4v|mp4|og[gv]|webm)$/i.test(parsed.pathname)) {
+    return { kind: "video", src: parsed.toString(), provider: "Video file" };
+  }
+  return null;
+}
+
+// ../richtext/src/embed.ts
+var EMBED_ASPECTS = ["16:9", "4:3", "1:1", "9:16"];
+var isEmbedAspect = (v) => EMBED_ASPECTS.includes(v);
+function detectEmbed(url) {
+  const u = url.trim();
+  let host = "";
+  try {
+    host = new URL(u).hostname.replace(/^www\./, "");
+  } catch {
+    host = "";
+  }
+  const is = (re) => re.test(u);
+  if (is(/(?:youtube\.com\/(?:watch\?|embed\/|shorts\/|live\/)|youtu\.be\/)/i)) return { provider: "youtube", label: "YouTube", host };
+  if (is(/vimeo\.com\/(?:video\/)?\d+/i)) return { provider: "vimeo", label: "Vimeo", host };
+  if (is(/(?:twitter|x)\.com\/[^/]+\/status\/\d+/i)) return { provider: "x", label: "X post", host };
+  if (is(/codepen\.io\/[^/]+\/(?:pen|embed)\//i)) return { provider: "codepen", label: "CodePen", host };
+  if (is(/figma\.com\/(?:file|design|proto|board)\//i)) return { provider: "figma", label: "Figma", host };
+  if (is(/(?:google\.[a-z.]+\/maps|maps\.app\.goo\.gl|goo\.gl\/maps)/i)) return { provider: "maps", label: "Google Maps", host };
+  if (is(/open\.spotify\.com\/(?:episode|track|show|playlist|album)\//i)) return { provider: "spotify", label: "Spotify", host };
+  if (is(/podcasts\.apple\.com\//i)) return { provider: "podcast", label: "Apple Podcasts", host };
+  if (is(/\.(?:mp3|m4a|wav|ogg|aac)(?:\?|$)/i)) return { provider: "audio", label: "Audio", host };
+  return { provider: "link", label: host || "Link", host };
+}
+function detectMore(url) {
+  const host = url.hostname.toLowerCase().replace(/^www\./, "");
+  const path = url.pathname;
+  if (host === "youtube-nocookie.com" && path.startsWith("/embed/")) return { provider: "youtube", label: "YouTube" };
+  if (host === "open.spotify.com" && /^\/embed\/(?:episode|track|show|playlist|album)\//.test(path)) return { provider: "spotify", label: "Spotify" };
+  if (host === "calendly.com") return { provider: "calendly", label: "Calendly" };
+  if (host.endsWith(".typeform.com") && /^\/to\//.test(path)) return { provider: "typeform", label: "Typeform" };
+  if (host === "loom.com" && /^\/(?:share|embed)\//.test(path)) return { provider: "loom", label: "Loom" };
+  if (host === "airtable.com") return { provider: "airtable", label: "Airtable" };
+  if (host === "docs.google.com") {
+    const kind = path.split("/")[1];
+    const label = { forms: "Google Forms", document: "Google Docs", spreadsheets: "Google Sheets", presentation: "Google Slides" }[kind ?? ""];
+    if (label) return { provider: "google", label };
+  }
+  return null;
+}
+var FRAME_SIZE = {
+  "16:9": ["640", "360"],
+  "4:3": ["640", "480"],
+  "1:1": ["640", "640"],
+  "9:16": ["360", "640"]
+};
+var ID = /^[A-Za-z0-9_-]{1,64}$/;
+var FULL_WIDTH_HEIGHT = { calendly: "700", typeform: "500", airtable: "533" };
+function frameOf(provider, url) {
+  const parts = url.pathname.split("/").filter(Boolean);
+  switch (provider) {
+    case "youtube":
+    case "vimeo": {
+      const video = resolveVideoSource(url.href);
+      return video?.kind === "iframe" ? { src: video.src } : null;
+    }
+    case "codepen": {
+      const [user, mode, id] = parts;
+      return user && ID.test(user) && (mode === "pen" || mode === "embed") && id && ID.test(id) ? { src: `https://codepen.io/${user}/embed/${id}?default-tab=result` } : null;
+    }
+    case "figma": {
+      const [mode, key] = parts;
+      if (!mode || !["file", "design", "proto", "board"].includes(mode) || !key || !ID.test(key)) return null;
+      const frame = new URL(`https://embed.figma.com/${mode}/${key}`);
+      const node = url.searchParams.get("node-id");
+      if (node && /^[0-9A-Za-z:_-]{1,64}$/.test(node)) frame.searchParams.set("node-id", node);
+      frame.searchParams.set("embed-host", "bettercms");
+      return { src: frame.href };
+    }
+    case "maps": {
+      if (!/^(?:www\.)?google\.[a-z.]+$/i.test(url.hostname)) return null;
+      const pb = url.searchParams.get("pb");
+      if (parts[0] === "maps" && parts[1] === "embed" && pb && /^[!A-Za-z0-9._:%+-]{1,2000}$/.test(pb)) {
+        return { src: `https://www.google.com/maps/embed?pb=${encodeURIComponent(pb)}` };
+      }
+      const at = /@(-?\d{1,3}(?:\.\d+)?),(-?\d{1,3}(?:\.\d+)?)/.exec(url.pathname);
+      const place = parts[0] === "maps" && parts[1] === "place" && parts[2] ? decodeURIComponent(parts[2]).replace(/\+/g, " ") : null;
+      const q = at ? `${at[1]},${at[2]}` : url.searchParams.get("q") ?? place;
+      if (!q || q.length > 200) return null;
+      return { src: `https://maps.google.com/maps?q=${encodeURIComponent(q)}&output=embed` };
+    }
+    case "spotify": {
+      const [type, id] = parts[0] === "embed" ? parts.slice(1) : parts;
+      if (!type || !["episode", "track", "show", "playlist", "album"].includes(type) || !id || !ID.test(id)) return null;
+      return { src: `https://open.spotify.com/embed/${type}/${id}`, height: type === "track" || type === "episode" ? "152" : "352" };
+    }
+    case "podcast":
+      return (url.hostname === "podcasts.apple.com" || url.hostname === "embed.podcasts.apple.com") && parts.length >= 2 ? { src: `https://embed.podcasts.apple.com${url.pathname}${url.search}`, height: url.searchParams.has("i") ? "175" : "450" } : null;
+    case "calendly":
+      return parts.length >= 1 && parts.length <= 2 && parts.every((p) => ID.test(p)) ? { src: `https://calendly.com/${parts.join("/")}?embed_type=Inline&hide_gdpr_banner=1` } : null;
+    case "typeform": {
+      const id = parts[0] === "to" ? parts[1] : void 0;
+      return id && /^[A-Za-z0-9]{4,32}$/.test(id) ? { src: `https://form.typeform.com/to/${id}` } : null;
+    }
+    case "loom": {
+      const id = parts[1];
+      return (parts[0] === "share" || parts[0] === "embed") && id && /^[0-9a-f]{32}$/.test(id) ? { src: `https://www.loom.com/embed/${id}` } : null;
+    }
+    case "airtable": {
+      const ids = parts[0] === "embed" ? parts.slice(1) : parts;
+      return ids.length >= 1 && ids.length <= 3 && ids.every((p) => /^(?:app|shr|tbl|viw)[A-Za-z0-9]{14}$/.test(p)) && ids.some((p) => p.startsWith("shr")) ? { src: `https://airtable.com/embed/${ids.join("/")}` } : null;
+    }
+    case "google": {
+      const [kind, d, maybeE, maybeId] = parts;
+      if (d !== "d") return null;
+      const published = maybeE === "e";
+      const id = published ? maybeId : maybeE;
+      if (!id || !/^[A-Za-z0-9_-]{10,128}$/.test(id)) return null;
+      const base = `https://docs.google.com/${kind}/d/${published ? `e/${id}` : id}`;
+      if (kind === "forms") return { src: `${base}/viewform?embedded=true`, height: "800" };
+      if (kind === "document") return { src: published ? `${base}/pub?embedded=true` : `${base}/preview`, height: "600" };
+      if (kind === "spreadsheets") return { src: published ? `${base}/pubhtml?widget=true&headers=false` : `${base}/preview`, height: "600" };
+      if (kind === "presentation") return { src: published ? `${base}/embed` : `${base}/preview` };
+      return null;
+    }
+    default:
+      return null;
+  }
+}
+var X_STATUS = /^\/([A-Za-z0-9_]{1,15})\/status\/(\d{1,25})(?:\/|$)/;
+var X_HOSTS = /^(?:www\.|mobile\.)?(?:twitter|x)\.com$/i;
+function canonicalEmbedUrl(raw) {
+  const url = typeof raw === "string" ? raw.trim() : "";
+  const safe = url ? safeHref(url) : null;
+  if (!safe || !/^https?:\/\//i.test(safe)) return null;
+  let parsed;
+  try {
+    parsed = new URL(safe);
+  } catch {
+    return null;
+  }
+  const status = X_HOSTS.test(parsed.hostname) ? X_STATUS.exec(parsed.pathname) : null;
+  if (status) return `https://x.com/${status[1].toLowerCase()}/status/${status[2]}`;
+  parsed.hash = "";
+  return parsed.href;
+}
+function resolveEmbed(rawUrl, aspect = "16:9") {
+  const url = typeof rawUrl === "string" ? rawUrl.trim() : "";
+  const v2 = detectEmbed(url);
+  const safe = url ? safeHref(url) : null;
+  let parsed = null;
+  try {
+    parsed = safe && /^https?:\/\//i.test(safe) ? new URL(safe) : null;
+  } catch {
+    parsed = null;
+  }
+  const { provider, label } = v2.provider === "link" && parsed ? detectMore(parsed) ?? v2 : v2;
+  const link = { kind: "link", provider, label, url: safe };
+  if (!parsed) return link;
+  if (provider === "x") return { kind: "card", provider: "x", label, url: canonicalEmbedUrl(parsed.href) ?? parsed.href };
+  if (provider === "audio") return parsed.protocol === "https:" ? { kind: "audio", provider: "audio", label, src: parsed.href } : link;
+  const frame = frameOf(provider, parsed);
+  if (!frame) return link;
+  const height = frame.height ?? FULL_WIDTH_HEIGHT[provider];
+  if (height) return { kind: "frame", provider, label, src: frame.src, width: "100%", height };
+  const [width, h] = FRAME_SIZE[isEmbedAspect(aspect) ? aspect : "16:9"];
+  return { kind: "frame", provider, label, src: frame.src, width, height: h };
+}
+
 // src/blocks/portableText.tsx
 import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime";
 var TOKEN = /^[a-z0-9-]+$/i;
@@ -815,8 +1252,119 @@ function Table({ value }) {
     ] }) : notes ? /* @__PURE__ */ jsx2("p", { "data-notes": "", id: notesId, children: notes }) : null
   ] }) : table;
 }
-function buildComponents(renderBlock) {
-  return {
+function CheckItem({ checked, address, children }) {
+  return /* @__PURE__ */ jsxs("li", { ...address, "data-checked": String(checked), children: [
+    /* @__PURE__ */ jsx2("input", { type: "checkbox", disabled: true, defaultChecked: checked }),
+    children
+  ] });
+}
+function XCard({ url, card }) {
+  return /* @__PURE__ */ jsxs("blockquote", { className: "twitter-tweet bcms-embed-card", cite: url, children: [
+    /* @__PURE__ */ jsx2("p", { children: card.text }),
+    "\u2014 ",
+    card.authorName,
+    " ",
+    /* @__PURE__ */ jsx2("a", { href: url, children: card.date || "View on X" })
+  ] });
+}
+function RelatedPosts({ value, resolved }) {
+  const { key, title, mode, count, picked, items } = relatedPostsView(value, resolved);
+  if (!resolved) {
+    return /* @__PURE__ */ jsx2("aside", { "data-rt": "related", "data-key": key, "data-mode": mode, "data-count": count, "data-posts": picked.join(","), "data-title": title || void 0 });
+  }
+  if (!items.length) return null;
+  return /* @__PURE__ */ jsxs("aside", { "data-rt": "related", "data-mode": mode, "data-count": count, "data-posts": picked.join(","), children: [
+    title ? /* @__PURE__ */ jsx2("p", { "data-title": "", children: title }) : null,
+    items.length ? /* @__PURE__ */ jsx2("ul", { children: items.map((p) => /* @__PURE__ */ jsx2("li", { children: /* @__PURE__ */ jsx2("a", { href: p.url, children: p.title }) }, p.id)) }) : null
+  ] });
+}
+function AuthorBio({ value, resolved }) {
+  const { key, id, author } = authorBioView(value, resolved);
+  if (!resolved) return /* @__PURE__ */ jsx2("aside", { "data-rt": "author", "data-key": key, "data-author": id });
+  if (!author) return null;
+  return /* @__PURE__ */ jsxs("aside", { "data-rt": "author", "data-author": id, children: [
+    author?.avatar ? /* @__PURE__ */ jsx2("img", { src: author.avatar, alt: "" }) : null,
+    author ? /* @__PURE__ */ jsx2("p", { "data-name": "", children: author.name }) : null,
+    author?.bio ? /* @__PURE__ */ jsx2("p", { "data-bio": "", children: author.bio }) : null
+  ] });
+}
+function Columns({ value, components }) {
+  const view = columnsView(value);
+  if (!view) return null;
+  const s = COLUMNS_STYLES[view.gap];
+  return /* @__PURE__ */ jsx2("div", { "data-rt": "columns", "data-gap": view.gap, "data-cols": view.columns.length, style: styleObject(s.row), children: view.columns.map((c) => /* @__PURE__ */ jsx2("div", { "data-col": "true", style: styleObject(s.col), children: c.content.length ? /* @__PURE__ */ jsx2(PT, { value: c.content, components }) : null }, c.key)) });
+}
+function FootnoteMark({ value, footnotes }) {
+  const note = typeof value.note === "string" ? value.note : "";
+  const n = footnotes.nodes.get(value);
+  if (!n) return /* @__PURE__ */ jsx2("sup", { "data-rt": "fn", "data-note": note });
+  return /* @__PURE__ */ jsx2("sup", { "data-rt": "fn", id: `fnref-${n}`, "data-note": note, children: /* @__PURE__ */ jsx2("a", { href: `#fn-${n}`, "aria-label": `Footnote ${n}`, children: n }) });
+}
+function FootnoteList({ notes }) {
+  if (!notes.length) return null;
+  return /* @__PURE__ */ jsx2("ol", { className: "cs-footnotes", "data-rt": "footnotes", "aria-label": "Footnotes", children: notes.map((note, i) => /* @__PURE__ */ jsxs("li", { id: `fn-${i + 1}`, children: [
+    note,
+    " ",
+    /* @__PURE__ */ jsx2("a", { href: `#fnref-${i + 1}`, "aria-label": `Back to reference ${i + 1}`, children: "\u21A9" })
+  ] }, i)) });
+}
+function Toc({ value, outline }) {
+  const { title, label, depth } = tocView(value);
+  const link = (o) => /* @__PURE__ */ jsx2("a", { href: `#${o.id}`, children: o.text });
+  return /* @__PURE__ */ jsxs("nav", { "data-rt": "toc", "data-depth": depth, "aria-label": label, children: [
+    title ? /* @__PURE__ */ jsx2("p", { "data-title": "", children: title }) : null,
+    /* @__PURE__ */ jsx2("ol", { children: tocTree(outline.items, depth).map((e) => /* @__PURE__ */ jsxs("li", { children: [
+      link(e),
+      e.children.length ? /* @__PURE__ */ jsx2("ol", { children: e.children.map((c) => /* @__PURE__ */ jsx2("li", { children: link(c) }, c.id)) }) : null
+    ] }, e.id)) })
+  ] });
+}
+function Gallery({ value }) {
+  const { layout, images } = galleryView(value);
+  const s = GALLERY_STYLES[layout];
+  return /* @__PURE__ */ jsx2("figure", { "data-rt": "gallery", "data-layout": layout, children: /* @__PURE__ */ jsx2("ul", { style: styleObject(s.ul), tabIndex: layout === "carousel" ? 0 : void 0, children: images.map((x) => /* @__PURE__ */ jsx2("li", { style: styleObject(s.li), children: /* @__PURE__ */ jsxs("figure", { style: styleObject(s.figure), children: [
+    /* @__PURE__ */ jsx2(
+      "img",
+      {
+        alt: x.alt,
+        style: styleObject(x.position ? `${s.img};object-position:${x.position}` : s.img),
+        loading: "lazy",
+        ...Object.fromEntries(x.data),
+        src: x.src
+      }
+    ),
+    x.caption ? /* @__PURE__ */ jsx2("figcaption", { children: x.caption }) : null
+  ] }) }, x.key)) }) });
+}
+function Embed({ value, embeds }) {
+  const v = value ?? {};
+  const url = typeof v.url === "string" ? v.url.trim() : "";
+  const aspect = isEmbedAspect(v.aspect) ? v.aspect : "16:9";
+  const title = typeof v.title === "string" ? v.title.trim() : "";
+  const r = resolveEmbed(url, aspect);
+  const label = title || r.label;
+  const card = r.kind === "card" ? embeds.cards?.[r.url] : void 0;
+  let body = null;
+  if (r.kind === "frame") {
+    body = /* @__PURE__ */ jsx2("iframe", { src: r.src, title: label, width: r.width, height: r.height, loading: "lazy", referrerPolicy: "strict-origin-when-cross-origin", allowFullScreen: true });
+  } else if (r.kind === "audio") {
+    body = /* @__PURE__ */ jsx2("audio", { controls: true, preload: "none", src: r.src, title: label });
+  } else if (r.kind === "card" && card) {
+    body = /* @__PURE__ */ jsx2(XCard, { url: r.url, card });
+  } else if (r.url) {
+    body = /* @__PURE__ */ jsx2("a", { href: r.url, children: label });
+  }
+  return /* @__PURE__ */ jsx2("figure", { "data-rt": "embed", "data-url": url, "data-provider": r.provider, "data-aspect": aspect, "aria-label": title, children: body });
+}
+function buildComponents(renderBlock, embeds = {}, outline = { items: [], nodes: /* @__PURE__ */ new WeakMap() }, footnotes = { notes: [], nodes: /* @__PURE__ */ new WeakMap() }, resolved) {
+  const components = {
+    // RT5: every top-level h2 and h3 carries its outline id, as html.ts writes it.
+    block: {
+      h2: ({ value, children }) => /* @__PURE__ */ jsx2("h2", { id: outline.nodes.get(value), children }),
+      h3: ({ value, children }) => /* @__PURE__ */ jsx2("h3", { id: outline.nodes.get(value), children })
+    },
+    list: { check: ({ children }) => /* @__PURE__ */ jsx2("ul", { "data-task": "true", children }) },
+    listItem: { check: ({ value, children }) => /* @__PURE__ */ jsx2(CheckItem, { checked: value.checked === true, children }) },
     types: {
       [PT_TYPES.divider]: () => /* @__PURE__ */ jsx2("hr", {}),
       [PT_TYPES.table]: ({ value }) => /* @__PURE__ */ jsx2(Table, { value }),
@@ -837,6 +1385,7 @@ function buildComponents(renderBlock) {
         if (rendered !== void 0) return /* @__PURE__ */ jsx2(Fragment, { children: rendered });
         const builtIn = calloutOrToggle(value);
         if (builtIn) return builtIn;
+        if (columnsView(value)) return /* @__PURE__ */ jsx2(Columns, { value, components });
         const copy = detachedComponentCopy(value);
         if (copy) {
           return /* @__PURE__ */ jsx2("div", { className: "bcms-block bcms-block--component", "data-bcms-component-copy": copy.componentId, "data-bcms-instance": copy.id, children: /* @__PURE__ */ jsx2(BlocksRenderer, { blocks: copy.blocks }) });
@@ -866,6 +1415,12 @@ function buildComponents(renderBlock) {
           ] }) : null
         ] });
       },
+      [PT_TYPES.embed]: ({ value }) => /* @__PURE__ */ jsx2(Embed, { value, embeds }),
+      [PT_TYPES.gallery]: ({ value }) => /* @__PURE__ */ jsx2(Gallery, { value }),
+      [PT_TYPES.tableOfContents]: ({ value }) => /* @__PURE__ */ jsx2(Toc, { value, outline }),
+      [PT_TYPES.columns]: ({ value }) => /* @__PURE__ */ jsx2(Columns, { value, components }),
+      [PT_TYPES.relatedPosts]: ({ value }) => /* @__PURE__ */ jsx2(RelatedPosts, { value, resolved }),
+      [PT_TYPES.authorBio]: ({ value }) => /* @__PURE__ */ jsx2(AuthorBio, { value, resolved }),
       /**
        * Key takeaways — the React half of `portableTextToHtml`'s, and the same DOM: the V2 kit's
        * `<aside data-rt="takeaways">`, read through the one `keyTakeawaysView` both renderers share.
@@ -878,6 +1433,7 @@ function buildComponents(renderBlock) {
           /* @__PURE__ */ jsx2("ul", { children: points.map((p, i) => /* @__PURE__ */ jsx2("li", { children: p }, i)) })
         ] });
       },
+      [PT_TYPES.footnote]: ({ value }) => /* @__PURE__ */ jsx2(FootnoteMark, { value, footnotes }),
       [PT_TYPES.mention]: ({ value }) => {
         const v = value;
         return /* @__PURE__ */ jsx2("span", { className: "bcms-mention", children: typeof v.label === "string" ? v.label : "" });
@@ -893,7 +1449,7 @@ function buildComponents(renderBlock) {
         const href = typeof v.href === "string" ? safeHref(v.href) : null;
         if (!href) return /* @__PURE__ */ jsx2(Fragment, { children });
         const blank = v.target === "_blank";
-        return /* @__PURE__ */ jsx2("a", { href, ...blank ? { target: "_blank", rel: "noopener noreferrer" } : {}, children });
+        return /* @__PURE__ */ jsx2("a", { ...v.button === true ? { "data-button": "true" } : {}, href, ...blank ? { target: "_blank", rel: "noopener noreferrer" } : {}, children });
       },
       /**
        * The site's own inline markup, rendered as itself — the React half of
@@ -942,6 +1498,7 @@ function buildComponents(renderBlock) {
     unknownType: ({ children }) => /* @__PURE__ */ jsx2(Fragment, { children: children ?? null }),
     unknownBlockStyle: ({ children }) => /* @__PURE__ */ jsx2("p", { children })
   };
+  return components;
 }
 var isListItem = (node) => node._type === "block" && typeof node.listItem === "string" && !!node.listItem;
 function runsOf(blocks) {
@@ -982,22 +1539,42 @@ function calloutOrToggle(value) {
   }
   return null;
 }
-function PortableText({ value, bindingBase, renderBlock }) {
+function PortableText({ value, bindingBase, renderBlock, embeds, resolved }) {
   const blocks = React.useMemo(() => normalizePortableText(readValue(value)), [value]);
-  const components = React.useMemo(() => buildComponents(renderBlock), [renderBlock]);
+  const outline = React.useMemo(() => outlineOf(blocks), [blocks]);
+  const footnotes = React.useMemo(() => footnoteOrder(blocks), [blocks]);
+  const components = React.useMemo(
+    () => buildComponents(renderBlock, embeds, outline, footnotes, resolved),
+    [renderBlock, embeds, outline, footnotes, resolved]
+  );
   const listComponents = React.useMemo(() => {
     if (!bindingBase) return null;
     const keys = new Set(blocks.map((b) => b._key));
     return {
       ...components,
-      listItem: ({ value: item, children }) => keys.has(item._key) ? /* @__PURE__ */ jsx2("li", { "data-bcms-field": `${bindingBase}#${item._key}`, "data-bcms-kind": "richtext", children }) : /* @__PURE__ */ jsx2("li", { children })
+      listItem: ({ value: item, children }) => {
+        const address = keys.has(item._key) ? { "data-bcms-field": `${bindingBase}#${item._key}`, "data-bcms-kind": "richtext" } : void 0;
+        if (item.listItem === "check") {
+          return /* @__PURE__ */ jsx2(CheckItem, { checked: item.checked === true, address, children });
+        }
+        return /* @__PURE__ */ jsx2("li", { ...address, children });
+      }
     };
   }, [bindingBase, blocks, components]);
   if (blocks.length === 0) return null;
-  if (!bindingBase || !listComponents) return /* @__PURE__ */ jsx2(PT, { value: blocks, components });
-  return /* @__PURE__ */ jsx2(Fragment, { children: runsOf(blocks).map(
-    (run) => isListItem(run[0]) ? /* @__PURE__ */ jsx2(PT, { value: run, components: listComponents }, run[0]._key) : /* @__PURE__ */ jsx2(Bound, { base: bindingBase, nodeKey: run[0]._key, children: /* @__PURE__ */ jsx2(PT, { value: run, components }) }, run[0]._key)
-  ) });
+  const notes = /* @__PURE__ */ jsx2(FootnoteList, { notes: footnotes.notes });
+  if (!bindingBase || !listComponents) {
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx2(PT, { value: blocks, components }),
+      notes
+    ] });
+  }
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    runsOf(blocks).map(
+      (run) => isListItem(run[0]) ? /* @__PURE__ */ jsx2(PT, { value: run, components: listComponents }, run[0]._key) : /* @__PURE__ */ jsx2(Bound, { base: bindingBase, nodeKey: run[0]._key, children: /* @__PURE__ */ jsx2(PT, { value: run, components }) }, run[0]._key)
+    ),
+    notes
+  ] });
 }
 function readValue(value) {
   if (Array.isArray(value)) return value;
@@ -1171,7 +1748,7 @@ function Spacer({ height = 32, className = "" }) {
 // src/blocks/Columns.tsx
 import "react";
 import { jsx as jsx7 } from "react/jsx-runtime";
-function Columns({
+function Columns2({
   columns,
   gap = 16,
   className = "",
@@ -1425,7 +2002,7 @@ var BLOCK_REGISTRY = {
     icon: "minus"
   },
   columns: {
-    component: Columns,
+    component: Columns2,
     label: "Columns",
     icon: "columns"
   },