@sonordev/site-kit 4.2.3 → 4.2.4

package/dist/chunk-HTLWSCUQ.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/og/config.ts","../src/og/template.ts"],"names":[],"mappings":"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","file":"chunk-HTLWSCUQ.mjs","sourcesContent":["/**\n * @sonordev/site-kit/og — OG card config contract.\n *\n * THE SITE OWNS THE THEME. Sonor stores one brand_primary/secondary per\n * project; real sites have full palettes (Ludlow: red, ink, cream, scrim —\n * four tokens where Sonor stores two). So the card's colors, fonts, and\n * layout come from a repo-owned og.config.ts, typically importing the same\n * constants the site itself uses. Sonor brand data is only the zero-config\n * seed used by `sonor-setup og` when no og.config.ts exists.\n *\n * Rendering is BUILD-TIME via headless Chrome (`sonor-setup og`), writing a\n * static public/og.png: full real CSS (no Satori subset), Google Fonts load\n * in the template (no font vendoring), zero runtime cost — the right shape\n * for a force-static fleet. Per-entity runtime cards are a future tier.\n */\n\nexport interface OgTheme {\n  /** Page background behind everything. */\n  bg: string\n  /** Primary text color. */\n  text: string\n  /** Accent (kicker, bar). */\n  accent: string\n  /** Plate/surface color behind the logo. */\n  surface: string\n  /** Muted text (subtitle). Defaults derived from `text` when omitted. */\n  muted?: string\n}\n\nexport interface OgFont {\n  /** Google Fonts family name, e.g. 'Barlow Condensed'. */\n  family: string\n  weights?: number[]\n}\n\nexport interface OgBackground {\n  /** Path under public/, e.g. '/hero-frost.avif'. */\n  image: string\n  /** CSS blur radius in px. */\n  blur?: number\n  /** Overlay color, e.g. 'rgba(17,17,16,.68)'. */\n  scrim?: string\n}\n\nexport interface OgPhoto {\n  /** Path under public/ ('/team.jpg') or an absolute https URL. */\n  src: string\n  /** Pane width in px (default 430). */\n  width?: number\n  /** Corner radius in px (default 24). */\n  radius?: number\n}\n\nexport interface OgContent {\n  /** Small all-caps line above the title. */\n  kicker?: string\n  /** The big line. `\\n` for a manual break. Keep it short — previews truncate. */\n  title: string\n  /** One supporting line. */\n  subtitle?: string\n  /** Handwritten-style accent line (rendered in the last configured font). */\n  hand?: string\n  /** Bottom bar segments, e.g. ['Give an hour', 'ludlowpto.org']. */\n  bar?: string[]\n}\n\nexport interface OgCardConfig {\n  theme: OgTheme\n  /** First font = display face, second (optional) = hand/accent face. */\n  fonts?: OgFont[]\n  /** Path under public/ to the logo shown on the plate, e.g. '/logo-mark.svg'. */\n  logo?: string\n  background?: OgBackground\n  /**\n   * 'plate-left': logo plate left, copy right (the Ludlow layout).\n   * 'centered': stacked, logo above title.\n   * 'banner': no plate, full-bleed copy.\n   * 'split': copy left, content photo right — for cards that show the page's\n   *   own imagery (a project photo, a product, the storefront).\n   */\n  layout?: 'plate-left' | 'centered' | 'banner' | 'split'\n  /** Content photo for the 'split' layout (also rendered in 'plate-left' when set, replacing the plate). */\n  photo?: OgPhoto\n  content: OgContent\n  /**\n   * Per-page overrides, keyed by route path (`/services/garage`) or its slug\n   * (`services-garage`). Every static route already gets its own card built\n   * from its managed title and description; this is for the handful worth\n   * writing by hand — a campaign landing page, the flagship service.\n   *\n   * Each entry is layered over the site card, so it only states what differs.\n   * Build-time only: never rendered as part of a card.\n   */\n  cards?: Record<string, Partial<Omit<OgCardConfig, 'cards'>>>\n  /**\n   * MIDDLE escape hatch: keep the loader/renderer/verifier pipeline but\n   * produce your own document. Receives the config and the same helpers the\n   * stock template uses (esc, fontLink). Root-relative src attributes are\n   * still rewritten to public/ files automatically.\n   */\n  template?: (config: OgCardConfig, helpers: OgTemplateHelpers) => string\n  /** FULL escape hatch: raw HTML replaces everything, no helpers. */\n  html?: string\n}\n\nexport interface OgTemplateHelpers {\n  /** HTML-escape user text. */\n  esc: (s: string) => string\n  /** <link> tag loading the config's Google Fonts. */\n  fontLink: string\n  width: number\n  height: number\n}\n\n/** Identity helper for typed configs: `export default defineOgCard({...})`. */\nexport function defineOgCard(config: OgCardConfig): OgCardConfig {\n  return config\n}\n\nexport const OG_WIDTH = 1200\nexport const OG_HEIGHT = 630\n\n/**\n * Title type scale. The card opens at TITLE_MAX and the in-page fitter steps\n * down until the copy column fits, stopping at TITLE_MIN.\n *\n * The floor is a legibility floor, not a layout one: below ~56px the headline\n * stops reading at the ~300px thumbnail width platforms actually show. A card\n * that would need to go under it is a card whose copy is too long, so the\n * renderer reports that rather than shrinking into mush.\n */\nexport const TITLE_MAX_PX = 104\nexport const TITLE_MIN_PX = 56\n\n/**\n * The attribute the in-page fitter writes its findings to, read back by\n * `sonor-setup og` via Chrome's --dump-dom. Shared so the template and the CLI\n * cannot drift on the name.\n */\nexport const OG_REPORT_ATTR = 'data-og-report'\n\n/** What the in-page fitter reports back about a rendered card. */\nexport interface OgRenderReport {\n  /** Did everything land inside the frame, at or above the legibility floor? */\n  fits: boolean\n  /** Final title size after fitting. Below TITLE_MAX means the copy ran long. */\n  titlePx: number\n  /** Human-readable problems, each naming the element and the overflow. */\n  issues: string[]\n}\n","/**\n * OG card HTML template builder.\n *\n * Turns an OgCardConfig into a self-contained 1200x630 HTML document rendered\n * by headless Chrome. Layout rules baked in from the Ludlow card:\n * - content held inside the middle ~80% (platforms crop toward 2:1 and the\n *   bottom bar is the first casualty)\n * - script/hand faces never below 40px — under that they turn to mush at\n *   iMessage thumbnail width (~300px)\n * - the plate + title must survive alone if everything else is cropped\n */\n\nimport type { OgCardConfig, OgContent, OgTheme } from './config'\nimport {\n  OG_WIDTH,\n  OG_HEIGHT,\n  TITLE_MAX_PX,\n  TITLE_MIN_PX,\n  OG_REPORT_ATTR,\n} from './config'\n\n/**\n * The in-page fitter. Runs inside the render, after webfonts settle, and does\n * the two things a Node-side template cannot:\n *\n *  1. FITS THE TITLE. The h1 opens at TITLE_MAX_PX and steps down until the\n *     copy column fits the frame. Before this the size was fixed, so title\n *     length silently decided whether a card worked — a long one did not\n *     shrink, it pushed the kicker off the top and the subtitle under the\n *     bottom bar, and the CLI still reported success.\n *  2. MEASURES WHAT IS LEFT. Anything still clipped is written to the report\n *     attribute, which `sonor-setup og` reads back through --dump-dom and\n *     turns into a failure. Real measurement, not a character-count estimate.\n *\n * Fonts matter: measuring before `document.fonts.ready` measures the fallback\n * face and produces a size that is wrong for the face that actually renders.\n */\nfunction fitScript(): string {\n  return `<script>\n(async function () {\n  var report = { fits: true, titlePx: ${TITLE_MAX_PX}, issues: [] };\n  function push(msg) { report.fits = false; report.issues.push(msg); }\n  try {\n    try { await document.fonts.ready; } catch (e) {}\n    var h1 = document.querySelector('h1');\n    var copy = document.querySelector('.copy');\n    var wrap = document.querySelector('.wrap');\n    var bar = document.querySelector('.bar');\n\n    if (h1 && copy && wrap) {\n      var cs = getComputedStyle(wrap);\n      var avail = wrap.clientHeight - parseFloat(cs.paddingTop || '0') - parseFloat(cs.paddingBottom || '0');\n\n      // Fit BOTH axes. Height alone is not enough: a single long word\n      // (\"WORKBENCHES\") cannot wrap, so it keeps overflowing the column\n      // sideways at a size that fits vertically. Shrinking for either\n      // condition is what makes an arbitrary managed title safe to render.\n      var tooTall = function () { return copy.scrollHeight > avail; };\n      var tooWide = function () { return h1.scrollWidth > copy.clientWidth + 1; };\n      var size = ${TITLE_MAX_PX};\n      while (size > ${TITLE_MIN_PX} && (tooTall() || tooWide())) {\n        size -= 2;\n        h1.style.fontSize = size + 'px';\n      }\n      report.titlePx = size;\n\n      if (tooTall()) {\n        push('title/subtitle block overflows the card by ' + Math.ceil(copy.scrollHeight - avail) +\n             'px even at the ' + ${TITLE_MIN_PX} + 'px legibility floor - shorten content.title or content.subtitle');\n      }\n      if (tooWide()) {\n        push('the longest title word still overflows the copy column by ' + Math.ceil(h1.scrollWidth - copy.clientWidth) +\n             'px at the ' + ${TITLE_MIN_PX} + 'px floor - shorten it or add a line break');\n      }\n    }\n\n    if (bar && bar.scrollWidth > bar.clientWidth + 1) {\n      push('bottom bar content overflows by ' + Math.ceil(bar.scrollWidth - bar.clientWidth) +\n           'px - drop a content.bar segment or shorten one');\n    }\n\n    // Nothing may sit outside the frame platforms actually crop to.\n    var named = [['kicker', '.kicker'], ['title', 'h1'], ['subtitle', '.sub'], ['hand', '.hand'], ['bar', '.bar']];\n    for (var i = 0; i < named.length; i++) {\n      var el = document.querySelector(named[i][1]);\n      if (!el) continue;\n      var r = el.getBoundingClientRect();\n      if (r.top < -1 || r.bottom > ${OG_HEIGHT} + 1) {\n        push(named[i][0] + ' sits outside the ' + ${OG_HEIGHT} + 'px frame (top ' +\n             Math.round(r.top) + ', bottom ' + Math.round(r.bottom) + ')');\n      }\n    }\n  } catch (e) {\n    push('fitter failed: ' + (e && e.message ? e.message : String(e)));\n  }\n  document.documentElement.setAttribute('${OG_REPORT_ATTR}', JSON.stringify(report));\n})();\n</script>`\n}\n\nfunction esc(s: string): string {\n  return s.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;')\n}\n\nfunction fontLink(config: OgCardConfig): string {\n  const fonts = config.fonts?.length\n    ? config.fonts\n    : [{ family: 'Barlow Condensed', weights: [800] }]\n  const families = fonts\n    .map(f => `family=${f.family.replace(/ /g, '+')}:wght@${(f.weights || [700]).join(';')}`)\n    .join('&')\n  return `<link href=\"https://fonts.googleapis.com/css2?${families}&display=block\" rel=\"stylesheet\">`\n}\n\nfunction displayFamily(config: OgCardConfig): string {\n  return config.fonts?.[0]?.family || 'Barlow Condensed'\n}\n\nfunction handFamily(config: OgCardConfig): string {\n  const fonts = config.fonts || []\n  return fonts.length > 1 ? fonts[fonts.length - 1].family : displayFamily(config)\n}\n\nfunction muted(theme: OgTheme): string {\n  return theme.muted || theme.text\n}\n\nfunction backgroundLayers(config: OgCardConfig): string {\n  if (!config.background) return ''\n  const { image, blur = 0, scrim } = config.background\n  return `\n  <div class=\"bg\"><img src=\"${esc(image)}\" style=\"filter:blur(${blur}px)\"></div>\n  ${scrim ? `<div class=\"scrim\" style=\"background:${esc(scrim)}\"></div>` : ''}`\n}\n\nfunction barHtml(content: OgContent, theme: OgTheme): string {\n  if (!content.bar?.length) return ''\n  const segs = content.bar\n    .map(s => `<span>${esc(s)}</span>`)\n    .join('<span class=\"dot\"></span>')\n  return `<div class=\"bar\" style=\"background:${esc(theme.accent)}\">${segs}</div>`\n}\n\nfunction copyHtml(config: OgCardConfig): string {\n  const { content, theme } = config\n  const titleHtml = esc(content.title).replace(/\\n/g, '<br>')\n  // In `split` the photo owns the right pane, so a configured logo has nowhere\n  // to go as a plate. It used to be dropped silently. Render it small above the\n  // kicker instead: the brand mark still appears, and the plate invariant that\n  // split has no `.plate` is preserved.\n  const mark =\n    config.logo && (config.layout ?? (config.logo ? 'plate-left' : 'banner')) === 'split'\n      ? `<img class=\"mark\" src=\"${esc(config.logo)}\">`\n      : ''\n  return `\n    <div class=\"copy\">\n      ${mark}\n      ${content.kicker ? `<div class=\"kicker\">${esc(content.kicker)}</div>` : ''}\n      <h1>${titleHtml}</h1>\n      ${content.subtitle ? `<div class=\"sub\" style=\"color:${esc(muted(theme))}\">${esc(content.subtitle)}</div>` : ''}\n      ${content.hand ? `<div class=\"hand\" style=\"font-family:'${esc(handFamily(config))}',cursive\">${esc(content.hand)}</div>` : ''}\n    </div>`\n}\n\nexport function buildOgHtml(config: OgCardConfig): string {\n  if (config.html) return config.html\n  if (config.template) {\n    return config.template(config, {\n      esc,\n      fontLink: fontLink(config),\n      width: OG_WIDTH,\n      height: OG_HEIGHT,\n    })\n  }\n\n  const { theme, logo, layout = logo ? 'plate-left' : 'banner' } = config\n  const display = displayFamily(config)\n\n  const plate = logo\n    ? `<div class=\"plate\" style=\"background:${esc(theme.surface)}\"><img src=\"${esc(logo)}\"></div>`\n    : ''\n\n  const photo = config.photo\n    ? `<div class=\"photo\" style=\"flex-basis:${config.photo.width ?? 430}px;border-radius:${config.photo.radius ?? 24}px\"><img src=\"${esc(config.photo.src)}\"></div>`\n    : ''\n\n  const body =\n    layout === 'centered'\n      ? `<div class=\"wrap centered\">${plate}${copyHtml(config)}</div>`\n      : layout === 'banner'\n        ? `<div class=\"wrap banner\">${copyHtml(config)}</div>`\n        : layout === 'split'\n          ? `<div class=\"wrap\">${copyHtml(config)}${photo}</div>`\n          : `<div class=\"wrap\">${photo || plate}${copyHtml(config)}</div>`\n\n  return `<!doctype html>\n<html><head><meta charset=\"utf-8\">\n<link rel=\"preconnect\" href=\"https://fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https://fonts.gstatic.com\" crossorigin>\n${fontLink(config)}\n<style>\n  * { margin:0; padding:0; box-sizing:border-box; }\n  html,body { width:${OG_WIDTH}px; height:${OG_HEIGHT}px; overflow:hidden; }\n  body { position:relative; background:${theme.bg}; font-family:'${display}',sans-serif; color:${theme.text}; }\n  .bg { position:absolute; inset:0; }\n  .bg img { width:100%; height:100%; object-fit:cover; transform:scale(1.05); }\n  .scrim { position:absolute; inset:0; }\n  .wrap { position:relative; height:100%; display:flex; align-items:center; gap:52px; padding:0 68px ${config.content.bar?.length ? '74px' : '0'}; }\n  .wrap.centered { flex-direction:column; justify-content:center; text-align:center; gap:28px; }\n  .wrap.banner { padding-left:90px; }\n  .plate { border-radius:28px; padding:26px; flex:0 0 auto; }\n  .plate img { display:block; width:250px; height:auto; }\n  .centered .plate img { width:180px; }\n  .photo { flex:0 0 auto; height:76%; overflow:hidden; box-shadow:0 8px 40px rgba(0,0,0,.25); }\n  .photo img { width:100%; height:100%; object-fit:cover; display:block; }\n  .copy { flex:1 1 auto; min-width:0; }\n  /* split-layout brand mark: the photo owns the right pane, so the logo rides\n     above the kicker rather than being dropped. */\n  .mark { display:block; height:44px; width:auto; margin-bottom:20px; }\n  .kicker { font-weight:800; text-transform:uppercase; letter-spacing:.22em; font-size:24px; color:${theme.accent}; margin-bottom:14px; }\n  /* Opening size only — the in-page fitter steps this down to fit the frame. */\n  h1 { font-weight:800; text-transform:uppercase; font-size:${TITLE_MAX_PX}px; line-height:.9; letter-spacing:-.01em; }\n  .sub { margin-top:22px; font-size:29px; font-weight:500; line-height:1.32; }\n  /* Never below 40px: script faces are illegible at thumbnail width under that. */\n  .hand { font-size:42px; margin-top:14px; transform:rotate(-1.5deg); display:inline-block; }\n  .bar { position:absolute; left:0; right:0; bottom:0; height:74px; display:flex; align-items:center; justify-content:center; gap:26px;\n         font-weight:800; text-transform:uppercase; letter-spacing:.1em; font-size:31px; color:${theme.surface}; }\n  .bar .dot { width:10px; height:10px; border-radius:50%; background:currentColor; opacity:.55; }\n</style></head>\n<body>\n${backgroundLayers(config)}\n${body}\n${barHtml(config.content, theme)}\n${fitScript()}\n</body></html>`\n}\n"]}

package/dist/chunk-S5L73KZQ.js

@@ -1,8 +0,0 @@
-'use strict';
-
-// src/shared/version.ts
-var SITE_KIT_VERSION = "4.2.3";
-
-exports.SITE_KIT_VERSION = SITE_KIT_VERSION;
-//# sourceMappingURL=chunk-S5L73KZQ.js.map
-//# sourceMappingURL=chunk-S5L73KZQ.js.map

package/dist/chunk-XCFCG46K.mjs

@@ -1,6 +0,0 @@
-// src/shared/version.ts
-var SITE_KIT_VERSION = "4.2.3";
-
-export { SITE_KIT_VERSION };
-//# sourceMappingURL=chunk-XCFCG46K.mjs.map
-//# sourceMappingURL=chunk-XCFCG46K.mjs.map

package/dist/chunk-ZAVNGZJZ.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/og/config.ts","../src/og/template.ts"],"names":[],"mappings":"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","file":"chunk-ZAVNGZJZ.js","sourcesContent":["/**\n * @sonordev/site-kit/og — OG card config contract.\n *\n * THE SITE OWNS THE THEME. Sonor stores one brand_primary/secondary per\n * project; real sites have full palettes (Ludlow: red, ink, cream, scrim —\n * four tokens where Sonor stores two). So the card's colors, fonts, and\n * layout come from a repo-owned og.config.ts, typically importing the same\n * constants the site itself uses. Sonor brand data is only the zero-config\n * seed used by `sonor-setup og` when no og.config.ts exists.\n *\n * Rendering is BUILD-TIME via headless Chrome (`sonor-setup og`), writing a\n * static public/og.png: full real CSS (no Satori subset), Google Fonts load\n * in the template (no font vendoring), zero runtime cost — the right shape\n * for a force-static fleet. Per-entity runtime cards are a future tier.\n */\n\nexport interface OgTheme {\n  /** Page background behind everything. */\n  bg: string\n  /** Primary text color. */\n  text: string\n  /** Accent (kicker, bar). */\n  accent: string\n  /** Plate/surface color behind the logo. */\n  surface: string\n  /** Muted text (subtitle). Defaults derived from `text` when omitted. */\n  muted?: string\n}\n\nexport interface OgFont {\n  /** Google Fonts family name, e.g. 'Barlow Condensed'. */\n  family: string\n  weights?: number[]\n}\n\nexport interface OgBackground {\n  /** Path under public/, e.g. '/hero-frost.avif'. */\n  image: string\n  /** CSS blur radius in px. */\n  blur?: number\n  /** Overlay color, e.g. 'rgba(17,17,16,.68)'. */\n  scrim?: string\n}\n\nexport interface OgPhoto {\n  /** Path under public/ ('/team.jpg') or an absolute https URL. */\n  src: string\n  /** Pane width in px (default 430). */\n  width?: number\n  /** Corner radius in px (default 24). */\n  radius?: number\n}\n\nexport interface OgContent {\n  /** Small all-caps line above the title. */\n  kicker?: string\n  /** The big line. `\\n` for a manual break. Keep it short — previews truncate. */\n  title: string\n  /** One supporting line. */\n  subtitle?: string\n  /** Handwritten-style accent line (rendered in the last configured font). */\n  hand?: string\n  /** Bottom bar segments, e.g. ['Give an hour', 'ludlowpto.org']. */\n  bar?: string[]\n}\n\nexport interface OgCardConfig {\n  theme: OgTheme\n  /** First font = display face, second (optional) = hand/accent face. */\n  fonts?: OgFont[]\n  /** Path under public/ to the logo shown on the plate, e.g. '/logo-mark.svg'. */\n  logo?: string\n  background?: OgBackground\n  /**\n   * 'plate-left': logo plate left, copy right (the Ludlow layout).\n   * 'centered': stacked, logo above title.\n   * 'banner': no plate, full-bleed copy.\n   * 'split': copy left, content photo right — for cards that show the page's\n   *   own imagery (a project photo, a product, the storefront).\n   */\n  layout?: 'plate-left' | 'centered' | 'banner' | 'split'\n  /** Content photo for the 'split' layout (also rendered in 'plate-left' when set, replacing the plate). */\n  photo?: OgPhoto\n  content: OgContent\n  /**\n   * Per-page overrides, keyed by route path (`/services/garage`) or its slug\n   * (`services-garage`). Every static route already gets its own card built\n   * from its managed title and description; this is for the handful worth\n   * writing by hand — a campaign landing page, the flagship service.\n   *\n   * Each entry is layered over the site card, so it only states what differs.\n   * Build-time only: never rendered as part of a card.\n   */\n  cards?: Record<string, Partial<Omit<OgCardConfig, 'cards'>>>\n  /**\n   * MIDDLE escape hatch: keep the loader/renderer/verifier pipeline but\n   * produce your own document. Receives the config and the same helpers the\n   * stock template uses (esc, fontLink). Root-relative src attributes are\n   * still rewritten to public/ files automatically.\n   */\n  template?: (config: OgCardConfig, helpers: OgTemplateHelpers) => string\n  /** FULL escape hatch: raw HTML replaces everything, no helpers. */\n  html?: string\n}\n\nexport interface OgTemplateHelpers {\n  /** HTML-escape user text. */\n  esc: (s: string) => string\n  /** <link> tag loading the config's Google Fonts. */\n  fontLink: string\n  width: number\n  height: number\n}\n\n/** Identity helper for typed configs: `export default defineOgCard({...})`. */\nexport function defineOgCard(config: OgCardConfig): OgCardConfig {\n  return config\n}\n\nexport const OG_WIDTH = 1200\nexport const OG_HEIGHT = 630\n\n/**\n * Title type scale. The card opens at TITLE_MAX and the in-page fitter steps\n * down until the copy column fits, stopping at TITLE_MIN.\n *\n * The floor is a legibility floor, not a layout one: below ~56px the headline\n * stops reading at the ~300px thumbnail width platforms actually show. A card\n * that would need to go under it is a card whose copy is too long, so the\n * renderer reports that rather than shrinking into mush.\n */\nexport const TITLE_MAX_PX = 104\nexport const TITLE_MIN_PX = 56\n\n/**\n * The attribute the in-page fitter writes its findings to, read back by\n * `sonor-setup og` via Chrome's --dump-dom. Shared so the template and the CLI\n * cannot drift on the name.\n */\nexport const OG_REPORT_ATTR = 'data-og-report'\n\n/** What the in-page fitter reports back about a rendered card. */\nexport interface OgRenderReport {\n  /** Did everything land inside the frame, at or above the legibility floor? */\n  fits: boolean\n  /** Final title size after fitting. Below TITLE_MAX means the copy ran long. */\n  titlePx: number\n  /** Human-readable problems, each naming the element and the overflow. */\n  issues: string[]\n}\n","/**\n * OG card HTML template builder.\n *\n * Turns an OgCardConfig into a self-contained 1200x630 HTML document rendered\n * by headless Chrome. Layout rules baked in from the Ludlow card:\n * - content held inside the middle ~80% (platforms crop toward 2:1 and the\n *   bottom bar is the first casualty)\n * - script/hand faces never below 40px — under that they turn to mush at\n *   iMessage thumbnail width (~300px)\n * - the plate + title must survive alone if everything else is cropped\n */\n\nimport type { OgCardConfig, OgContent, OgTheme } from './config'\nimport {\n  OG_WIDTH,\n  OG_HEIGHT,\n  TITLE_MAX_PX,\n  TITLE_MIN_PX,\n  OG_REPORT_ATTR,\n} from './config'\n\n/**\n * The in-page fitter. Runs inside the render, after webfonts settle, and does\n * the two things a Node-side template cannot:\n *\n *  1. FITS THE TITLE. The h1 opens at TITLE_MAX_PX and steps down until the\n *     copy column fits the frame. Before this the size was fixed, so title\n *     length silently decided whether a card worked — a long one did not\n *     shrink, it pushed the kicker off the top and the subtitle under the\n *     bottom bar, and the CLI still reported success.\n *  2. MEASURES WHAT IS LEFT. Anything still clipped is written to the report\n *     attribute, which `sonor-setup og` reads back through --dump-dom and\n *     turns into a failure. Real measurement, not a character-count estimate.\n *\n * Fonts matter: measuring before `document.fonts.ready` measures the fallback\n * face and produces a size that is wrong for the face that actually renders.\n */\nfunction fitScript(): string {\n  return `<script>\n(async function () {\n  var report = { fits: true, titlePx: ${TITLE_MAX_PX}, issues: [] };\n  function push(msg) { report.fits = false; report.issues.push(msg); }\n  try {\n    try { await document.fonts.ready; } catch (e) {}\n    var h1 = document.querySelector('h1');\n    var copy = document.querySelector('.copy');\n    var wrap = document.querySelector('.wrap');\n    var bar = document.querySelector('.bar');\n\n    if (h1 && copy && wrap) {\n      var cs = getComputedStyle(wrap);\n      var avail = wrap.clientHeight - parseFloat(cs.paddingTop || '0') - parseFloat(cs.paddingBottom || '0');\n\n      // Fit BOTH axes. Height alone is not enough: a single long word\n      // (\"WORKBENCHES\") cannot wrap, so it keeps overflowing the column\n      // sideways at a size that fits vertically. Shrinking for either\n      // condition is what makes an arbitrary managed title safe to render.\n      var tooTall = function () { return copy.scrollHeight > avail; };\n      var tooWide = function () { return h1.scrollWidth > copy.clientWidth + 1; };\n      var size = ${TITLE_MAX_PX};\n      while (size > ${TITLE_MIN_PX} && (tooTall() || tooWide())) {\n        size -= 2;\n        h1.style.fontSize = size + 'px';\n      }\n      report.titlePx = size;\n\n      if (tooTall()) {\n        push('title/subtitle block overflows the card by ' + Math.ceil(copy.scrollHeight - avail) +\n             'px even at the ' + ${TITLE_MIN_PX} + 'px legibility floor - shorten content.title or content.subtitle');\n      }\n      if (tooWide()) {\n        push('the longest title word still overflows the copy column by ' + Math.ceil(h1.scrollWidth - copy.clientWidth) +\n             'px at the ' + ${TITLE_MIN_PX} + 'px floor - shorten it or add a line break');\n      }\n    }\n\n    if (bar && bar.scrollWidth > bar.clientWidth + 1) {\n      push('bottom bar content overflows by ' + Math.ceil(bar.scrollWidth - bar.clientWidth) +\n           'px - drop a content.bar segment or shorten one');\n    }\n\n    // Nothing may sit outside the frame platforms actually crop to.\n    var named = [['kicker', '.kicker'], ['title', 'h1'], ['subtitle', '.sub'], ['hand', '.hand'], ['bar', '.bar']];\n    for (var i = 0; i < named.length; i++) {\n      var el = document.querySelector(named[i][1]);\n      if (!el) continue;\n      var r = el.getBoundingClientRect();\n      if (r.top < -1 || r.bottom > ${OG_HEIGHT} + 1) {\n        push(named[i][0] + ' sits outside the ' + ${OG_HEIGHT} + 'px frame (top ' +\n             Math.round(r.top) + ', bottom ' + Math.round(r.bottom) + ')');\n      }\n    }\n  } catch (e) {\n    push('fitter failed: ' + (e && e.message ? e.message : String(e)));\n  }\n  document.documentElement.setAttribute('${OG_REPORT_ATTR}', JSON.stringify(report));\n})();\n</script>`\n}\n\nfunction esc(s: string): string {\n  return s.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;')\n}\n\nfunction fontLink(config: OgCardConfig): string {\n  const fonts = config.fonts?.length\n    ? config.fonts\n    : [{ family: 'Barlow Condensed', weights: [800] }]\n  const families = fonts\n    .map(f => `family=${f.family.replace(/ /g, '+')}:wght@${(f.weights || [700]).join(';')}`)\n    .join('&')\n  return `<link href=\"https://fonts.googleapis.com/css2?${families}&display=block\" rel=\"stylesheet\">`\n}\n\nfunction displayFamily(config: OgCardConfig): string {\n  return config.fonts?.[0]?.family || 'Barlow Condensed'\n}\n\nfunction handFamily(config: OgCardConfig): string {\n  const fonts = config.fonts || []\n  return fonts.length > 1 ? fonts[fonts.length - 1].family : displayFamily(config)\n}\n\nfunction muted(theme: OgTheme): string {\n  return theme.muted || theme.text\n}\n\nfunction backgroundLayers(config: OgCardConfig): string {\n  if (!config.background) return ''\n  const { image, blur = 0, scrim } = config.background\n  return `\n  <div class=\"bg\"><img src=\"${esc(image)}\" style=\"filter:blur(${blur}px)\"></div>\n  ${scrim ? `<div class=\"scrim\" style=\"background:${esc(scrim)}\"></div>` : ''}`\n}\n\nfunction barHtml(content: OgContent, theme: OgTheme): string {\n  if (!content.bar?.length) return ''\n  const segs = content.bar\n    .map(s => `<span>${esc(s)}</span>`)\n    .join('<span class=\"dot\"></span>')\n  return `<div class=\"bar\" style=\"background:${esc(theme.accent)}\">${segs}</div>`\n}\n\nfunction copyHtml(config: OgCardConfig): string {\n  const { content, theme } = config\n  const titleHtml = esc(content.title).replace(/\\n/g, '<br>')\n  // In `split` the photo owns the right pane, so a configured logo has nowhere\n  // to go as a plate. It used to be dropped silently. Render it small above the\n  // kicker instead: the brand mark still appears, and the plate invariant that\n  // split has no `.plate` is preserved.\n  const mark =\n    config.logo && (config.layout ?? (config.logo ? 'plate-left' : 'banner')) === 'split'\n      ? `<img class=\"mark\" src=\"${esc(config.logo)}\">`\n      : ''\n  return `\n    <div class=\"copy\">\n      ${mark}\n      ${content.kicker ? `<div class=\"kicker\">${esc(content.kicker)}</div>` : ''}\n      <h1>${titleHtml}</h1>\n      ${content.subtitle ? `<div class=\"sub\" style=\"color:${esc(muted(theme))}\">${esc(content.subtitle)}</div>` : ''}\n      ${content.hand ? `<div class=\"hand\" style=\"font-family:'${esc(handFamily(config))}',cursive\">${esc(content.hand)}</div>` : ''}\n    </div>`\n}\n\nexport function buildOgHtml(config: OgCardConfig): string {\n  if (config.html) return config.html\n  if (config.template) {\n    return config.template(config, {\n      esc,\n      fontLink: fontLink(config),\n      width: OG_WIDTH,\n      height: OG_HEIGHT,\n    })\n  }\n\n  const { theme, logo, layout = logo ? 'plate-left' : 'banner' } = config\n  const display = displayFamily(config)\n\n  const plate = logo\n    ? `<div class=\"plate\" style=\"background:${esc(theme.surface)}\"><img src=\"${esc(logo)}\"></div>`\n    : ''\n\n  const photo = config.photo\n    ? `<div class=\"photo\" style=\"flex-basis:${config.photo.width ?? 430}px;border-radius:${config.photo.radius ?? 24}px\"><img src=\"${esc(config.photo.src)}\"></div>`\n    : ''\n\n  const body =\n    layout === 'centered'\n      ? `<div class=\"wrap centered\">${plate}${copyHtml(config)}</div>`\n      : layout === 'banner'\n        ? `<div class=\"wrap banner\">${copyHtml(config)}</div>`\n        : layout === 'split'\n          ? `<div class=\"wrap\">${copyHtml(config)}${photo}</div>`\n          : `<div class=\"wrap\">${photo || plate}${copyHtml(config)}</div>`\n\n  return `<!doctype html>\n<html><head><meta charset=\"utf-8\">\n<link rel=\"preconnect\" href=\"https://fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https://fonts.gstatic.com\" crossorigin>\n${fontLink(config)}\n<style>\n  * { margin:0; padding:0; box-sizing:border-box; }\n  html,body { width:${OG_WIDTH}px; height:${OG_HEIGHT}px; overflow:hidden; }\n  body { position:relative; background:${theme.bg}; font-family:'${display}',sans-serif; color:${theme.text}; }\n  .bg { position:absolute; inset:0; }\n  .bg img { width:100%; height:100%; object-fit:cover; transform:scale(1.05); }\n  .scrim { position:absolute; inset:0; }\n  .wrap { position:relative; height:100%; display:flex; align-items:center; gap:52px; padding:0 68px ${config.content.bar?.length ? '74px' : '0'}; }\n  .wrap.centered { flex-direction:column; justify-content:center; text-align:center; gap:28px; }\n  .wrap.banner { padding-left:90px; }\n  .plate { border-radius:28px; padding:26px; flex:0 0 auto; }\n  .plate img { display:block; width:250px; height:auto; }\n  .centered .plate img { width:180px; }\n  .photo { flex:0 0 auto; height:76%; overflow:hidden; box-shadow:0 8px 40px rgba(0,0,0,.25); }\n  .photo img { width:100%; height:100%; object-fit:cover; display:block; }\n  .copy { flex:1 1 auto; min-width:0; }\n  /* split-layout brand mark: the photo owns the right pane, so the logo rides\n     above the kicker rather than being dropped. */\n  .mark { display:block; height:44px; width:auto; margin-bottom:20px; }\n  .kicker { font-weight:800; text-transform:uppercase; letter-spacing:.22em; font-size:24px; color:${theme.accent}; margin-bottom:14px; }\n  /* Opening size only — the in-page fitter steps this down to fit the frame. */\n  h1 { font-weight:800; text-transform:uppercase; font-size:${TITLE_MAX_PX}px; line-height:.9; letter-spacing:-.01em; }\n  .sub { margin-top:22px; font-size:29px; font-weight:500; line-height:1.32; }\n  /* Never below 40px: script faces are illegible at thumbnail width under that. */\n  .hand { font-size:42px; margin-top:14px; transform:rotate(-1.5deg); display:inline-block; }\n  .bar { position:absolute; left:0; right:0; bottom:0; height:74px; display:flex; align-items:center; justify-content:center; gap:26px;\n         font-weight:800; text-transform:uppercase; letter-spacing:.1em; font-size:31px; color:${theme.surface}; }\n  .bar .dot { width:10px; height:10px; border-radius:50%; background:currentColor; opacity:.55; }\n</style></head>\n<body>\n${backgroundLayers(config)}\n${body}\n${barHtml(config.content, theme)}\n${fitScript()}\n</body></html>`\n}\n"]}