@symbo.ls/brender 3.5.0 → 3.6.1

package/dist/cjs/render.js

@@ -30,9 +30,11 @@ __export(render_exports, {
   render: () => render,
   renderElement: () => renderElement,
   renderPage: () => renderPage,
-  renderRoute: () => renderRoute
+  renderRoute: () => renderRoute,
+  resetGlobalCSSCache: () => resetGlobalCSSCache
 });
 module.exports = __toCommonJS(render_exports);
+var import_path = require("path");
 var import_env = require("./env.js");
 var import_keys = require("./keys.js");
 var import_metadata = require("./metadata.js");
@@ -61,7 +63,13 @@ const UIKIT_STUBS = {
   Img: {
     tag: "img",
     attr: {
-      src: (el) => el.props?.src,
+      src: (el) => {
+        let src = el.props?.src;
+        if (typeof src === "string" && src.includes("{{")) {
+          src = el.call("replaceLiteralsWithObjectFields", src, el.state);
+        }
+        return src;
+      },
       alt: (el) => el.props?.alt,
       loading: (el) => el.props?.loading
     }
@@ -86,7 +94,15 @@ const UIKIT_STUBS = {
   H3: { tag: "h3" },
   H4: { tag: "h4" },
   H5: { tag: "h5" },
-  H6: { tag: "h6" }
+  H6: { tag: "h6" },
+  Svg: {
+    tag: "svg",
+    attr: {
+      xmlns: "http://www.w3.org/2000/svg",
+      "xmlns:xlink": "http://www.w3.org/1999/xlink"
+    }
+  },
+  Text: { tag: "span" }
 };
 const render = async (data, options = {}) => {
   const { route = "/", state: stateOverrides, context: contextOverrides } = options;
@@ -127,16 +143,186 @@ const renderElement = async (elementDef, options = {}) => {
   const { window, document } = (0, import_env.createEnv)();
   const body = document.body;
   const { create } = await import("@domql/element");
+  const domqlUtils = await import("@domql/utils");
   const components = { ...UIKIT_STUBS, ...context.components || {} };
+  const utils = {
+    ...domqlUtils,
+    ...context.utils || {},
+    ...context.functions || {}
+  };
   (0, import_keys.resetKeys)();
-  const element = create(elementDef, { node: body }, "root", {
-    context: { document, window, ...context, components }
-  });
+  let element;
+  try {
+    element = create(elementDef, { node: body }, "root", {
+      context: { document, window, ...context, components, utils }
+    });
+  } catch (err) {
+  }
   (0, import_keys.assignKeys)(body);
-  const registry = (0, import_keys.mapKeysToElements)(element);
-  const html = body.innerHTML;
+  const registry = element ? (0, import_keys.mapKeysToElements)(element) : {};
+  const html = fixSvgContent(body.innerHTML);
   return { html, registry, element };
 };
+const fixSvgContent = (html) => {
+  return html.replace(
+    /(<svg\b[^>]*>)([\s\S]*?)(<\/svg>)/gi,
+    (match, open, content, close) => {
+      if (content.includes("&lt;")) {
+        const unescaped = content.replace(/&lt;/g, "<").replace(/&gt;/g, ">").replace(/&amp;/g, "&").replace(/&quot;/g, '"').replace(/&#39;/g, "'");
+        return open + unescaped + close;
+      }
+      return match;
+    }
+  );
+};
+let _cachedGlobalCSS = null;
+const generateGlobalCSS = async (ds, config) => {
+  if (_cachedGlobalCSS) return _cachedGlobalCSS;
+  try {
+    const { existsSync, writeFileSync, unlinkSync } = await import("fs");
+    const { tmpdir } = await import("os");
+    const { randomBytes } = await import("crypto");
+    const esbuild = await import("esbuild");
+    const dsJson = JSON.stringify(ds || {});
+    const cfgJson = JSON.stringify(config || {});
+    const tmpEntry = (0, import_path.join)(tmpdir(), `br_global_${randomBytes(6).toString("hex")}.mjs`);
+    const tmpOut = (0, import_path.join)(tmpdir(), `br_global_${randomBytes(6).toString("hex")}_out.mjs`);
+    writeFileSync(tmpEntry, `
+      import { set, getActiveConfig, getFontFaceString } from '@symbo.ls/scratch'
+      import { DEFAULT_CONFIG } from '@symbo.ls/default-config'
+
+      const ds = ${dsJson}
+      const cfg = ${cfgJson}
+
+      // Merge with defaults (same as initEmotion)
+      const merged = {}
+      for (const k in DEFAULT_CONFIG) merged[k] = DEFAULT_CONFIG[k]
+      for (const k in ds) {
+        if (typeof ds[k] === 'object' && !Array.isArray(ds[k]) && typeof merged[k] === 'object' && !Array.isArray(merged[k])) {
+          merged[k] = { ...merged[k], ...ds[k] }
+        } else {
+          merged[k] = ds[k]
+        }
+      }
+
+      const conf = set({
+        useReset: true,
+        useVariable: true,
+        useFontImport: true,
+        useDocumentTheme: true,
+        useDefaultConfig: true,
+        globalTheme: 'auto',
+        ...merged,
+        ...cfg
+      }, { newConfig: {} })
+
+      const result = {
+        CSS_VARS: conf.CSS_VARS || {},
+        CSS_MEDIA_VARS: conf.CSS_MEDIA_VARS || {},
+        RESET: conf.RESET || conf.reset || {},
+        ANIMATION: conf.animation || conf.ANIMATION || {}
+      }
+      // Export as globalThis so we can read it
+      globalThis.__BR_GLOBAL_CSS__ = result
+      export default result
+    `);
+    const brenderDir = new URL(".", import_meta.url).pathname;
+    const monorepoRoot = (0, import_path.resolve)(brenderDir, "../..");
+    const workspacePlugin = {
+      name: "workspace-resolve",
+      setup(build) {
+        build.onResolve({ filter: /^@symbo\.ls\// }, (args) => {
+          const pkg = args.path.replace("@symbo.ls/", "");
+          for (const dir of ["packages", "plugins"]) {
+            const src = (0, import_path.resolve)(monorepoRoot, dir, pkg, "src", "index.js");
+            if (existsSync(src)) return { path: src };
+            const dist = (0, import_path.resolve)(monorepoRoot, dir, pkg, "index.js");
+            if (existsSync(dist)) return { path: dist };
+          }
+          const blank = (0, import_path.resolve)(monorepoRoot, "packages", "default-config", "blank", "index.js");
+          if (pkg === "default-config" && existsSync(blank)) return { path: blank };
+        });
+        build.onResolve({ filter: /^@domql\// }, (args) => {
+          const pkg = args.path.replace("@domql/", "");
+          const src = (0, import_path.resolve)(monorepoRoot, "packages", "domql", "packages", pkg, "src", "index.js");
+          if (existsSync(src)) return { path: src };
+        });
+      }
+    };
+    await esbuild.build({
+      entryPoints: [tmpEntry],
+      bundle: true,
+      format: "esm",
+      platform: "node",
+      outfile: tmpOut,
+      write: true,
+      logLevel: "silent",
+      plugins: [workspacePlugin],
+      external: ["fs", "path", "os", "crypto", "url", "http", "https", "stream", "util", "events", "buffer", "child_process", "worker_threads", "net", "tls", "dns", "dgram", "zlib", "assert", "querystring", "string_decoder", "readline", "perf_hooks", "async_hooks", "v8", "vm", "cluster", "inspector", "module", "process", "tty", "color-contrast-checker"]
+    });
+    const mod = await import(`file://${tmpOut}`);
+    const data = mod.default || {};
+    try {
+      unlinkSync(tmpEntry);
+    } catch {
+    }
+    try {
+      unlinkSync(tmpOut);
+    } catch {
+    }
+    const cssVars = data.CSS_VARS || {};
+    const cssMediaVars = data.CSS_MEDIA_VARS || {};
+    const reset = data.RESET || {};
+    const animations = data.ANIMATION || {};
+    const varDecls = Object.entries(cssVars).map(([k, v]) => `  ${k}: ${v}`).join(";\n");
+    let rootRule = varDecls ? `:root {
+${varDecls};
+}` : "";
+    const themeVarRules = Object.entries(cssMediaVars).map(([key, vars]) => {
+      const decls = Object.entries(vars).map(([k, v]) => `    ${k}: ${v}`).join(";\n");
+      if (!decls) return "";
+      if (key.startsWith("@media")) {
+        return `${key} {
+  :root:not([data-theme]) {
+${decls};
+  }
+}`;
+      }
+      return `${key} {
+${decls};
+}`;
+    }).filter(Boolean).join("\n\n");
+    if (themeVarRules) rootRule += "\n\n" + themeVarRules;
+    const resetRules = generateResetCSS(reset);
+    const keyframeRules = [];
+    for (const name in animations) {
+      const frames = animations[name];
+      if (!frames || typeof frames !== "object") continue;
+      const frameRules = Object.entries(frames).map(([step, p]) => {
+        if (typeof p !== "object") return "";
+        const decls = Object.entries(p).map(([k, v]) => `${camelToKebab(k)}: ${v}`).join("; ");
+        return `  ${step} { ${decls}; }`;
+      }).join("\n");
+      keyframeRules.push(`@keyframes ${name} {
+${frameRules}
+}`);
+    }
+    _cachedGlobalCSS = {
+      rootRule,
+      resetRules,
+      fontFaceCSS: "",
+      keyframeRules: keyframeRules.join("\n")
+    };
+    return _cachedGlobalCSS;
+  } catch (err) {
+    console.warn("generateGlobalCSS failed:", err.message, err.stack);
+    _cachedGlobalCSS = { rootRule: "", resetRules: "", fontFaceCSS: "", keyframeRules: "" };
+    return _cachedGlobalCSS;
+  }
+};
+const resetGlobalCSSCache = () => {
+  _cachedGlobalCSS = null;
+};
 const renderRoute = async (data, options = {}) => {
   const { route = "/" } = options;
   const ds = data.designSystem || {};
@@ -166,38 +352,202 @@ const renderRoute = async (data, options = {}) => {
     emotion: emotionInstance,
     designSystem: ds
   });
+  const globalCSS = await generateGlobalCSS(ds, data.config || data.settings);
   return {
     html: cssDoc.body.innerHTML,
     css: extractCSS(result.element, ds),
-    resetCss: generateResetCSS(ds.reset),
+    globalCSS,
+    resetCss: globalCSS.resetRules || generateResetCSS(ds.reset),
     fontLinks: generateFontLinks(ds),
     metadata: (0, import_metadata.extractMetadata)(data, route),
     brKeyCount: Object.keys(result.registry).length
   };
 };
 const renderPage = async (data, route = "/", options = {}) => {
-  const { lang = "en", themeColor } = options;
+  const { lang = "en", themeColor, isr } = options;
   const result = await renderRoute(data, { route });
   if (!result) return null;
   const metadata = { ...result.metadata };
   if (themeColor) metadata["theme-color"] = themeColor;
   const headTags = (0, import_metadata.generateHeadHtml)(metadata);
+  const globalCSS = result.globalCSS || {};
+  let isrBody = "";
+  if (isr && isr.clientScript) {
+    const depth = route === "/" ? 0 : route.replace(/^\/|\/$/g, "").split("/").length;
+    const prefix = depth > 0 ? "../".repeat(depth) : "./";
+    isrBody = `<script type="module">
+{
+  const brEls = document.querySelectorAll('body > :not(script):not(style)')
+  const observer = new MutationObserver((mutations) => {
+    for (const m of mutations) {
+      for (const node of m.addedNodes) {
+        if (node.nodeType === 1 && node.tagName !== 'SCRIPT' && node.tagName !== 'STYLE' && !node.hasAttribute('data-br')) {
+          brEls.forEach(el => { if (el.hasAttribute('data-br') || el.querySelector('[data-br]')) el.remove() })
+          observer.disconnect()
+          return
+        }
+      }
+    }
+  })
+  observer.observe(document.body, { childList: true })
+}
+<\/script>
+<script type="module" src="${prefix}${isr.clientScript}"><\/script>`;
+  }
   const html = `<!DOCTYPE html>
 <html lang="${lang}">
 <head>
 ${headTags}
 ${result.fontLinks}
-<style>${result.resetCss}</style>
+${globalCSS.fontFaceCSS ? `<style>${globalCSS.fontFaceCSS}</style>` : ""}
+<style>
+${globalCSS.rootRule || ""}
+${result.resetCss}
+${globalCSS.keyframeRules || ""}
+</style>
 <style data-emotion="smbls">
 ${result.css}
 </style>
 </head>
 <body>
 ${result.html}
+${isrBody}
 </body>
 </html>`;
   return { html, route, brKeyCount: result.brKeyCount };
 };
+const LETTER_TO_INDEX = {
+  U: -6,
+  V: -5,
+  W: -4,
+  X: -3,
+  Y: -2,
+  Z: -1,
+  A: 0,
+  B: 1,
+  C: 2,
+  D: 3,
+  E: 4,
+  F: 5,
+  G: 6,
+  H: 7,
+  I: 8,
+  J: 9,
+  K: 10,
+  L: 11,
+  M: 12,
+  N: 13,
+  O: 14,
+  P: 15
+};
+const SPACING_PROPS = /* @__PURE__ */ new Set([
+  "padding",
+  "paddingTop",
+  "paddingRight",
+  "paddingBottom",
+  "paddingLeft",
+  "paddingBlock",
+  "paddingInline",
+  "paddingBlockStart",
+  "paddingBlockEnd",
+  "paddingInlineStart",
+  "paddingInlineEnd",
+  "margin",
+  "marginTop",
+  "marginRight",
+  "marginBottom",
+  "marginLeft",
+  "marginBlock",
+  "marginInline",
+  "marginBlockStart",
+  "marginBlockEnd",
+  "marginInlineStart",
+  "marginInlineEnd",
+  "gap",
+  "rowGap",
+  "columnGap",
+  "top",
+  "right",
+  "bottom",
+  "left",
+  "width",
+  "height",
+  "minWidth",
+  "maxWidth",
+  "minHeight",
+  "maxHeight",
+  "flexBasis",
+  "fontSize",
+  "lineHeight",
+  "letterSpacing",
+  "borderWidth",
+  "borderRadius",
+  "outlineWidth",
+  "outlineOffset",
+  "inset",
+  "insetBlock",
+  "insetInline",
+  "boxSize",
+  "round"
+]);
+const resolveSpacingToken = (token, spacingConfig) => {
+  if (!token || typeof token !== "string") return null;
+  if (!spacingConfig) return null;
+  const base = spacingConfig.base || 16;
+  const ratio = spacingConfig.ratio || 1.618;
+  const unit = spacingConfig.unit || "px";
+  const hasSubSequence = spacingConfig.subSequence !== false;
+  if (token.includes(" ")) {
+    const parts = token.split(" ").map((part) => {
+      if (part === "-" || part === "") return part;
+      return resolveSpacingToken(part, spacingConfig) || part;
+    });
+    return parts.join(" ");
+  }
+  if (/^(none|auto|inherit|initial|unset|0)$/i.test(token)) return null;
+  if (/\d+(px|em|rem|%|vh|vw|vmin|vmax|ch|ex|cm|mm|in|pt|pc|fr|s|ms)$/i.test(token)) return null;
+  if (/^(#|rgb|hsl|var\()/i.test(token)) return null;
+  const isNegative = token.startsWith("-");
+  const abs = isNegative ? token.slice(1) : token;
+  const m = abs.match(/^([A-Z])(\d)?$/i);
+  if (!m) return null;
+  const letter = m[1].toUpperCase();
+  const subStep = m[2] ? parseInt(m[2]) : 0;
+  const idx = LETTER_TO_INDEX[letter];
+  if (idx === void 0) return null;
+  let value = base * Math.pow(ratio, idx);
+  if (subStep > 0 && hasSubSequence) {
+    const next = base * Math.pow(ratio, idx + 1);
+    const diff = next - value;
+    const subRatio = diff / ratio;
+    const first = next - subRatio;
+    const second = value + subRatio;
+    const middle = (first + second) / 2;
+    const subs = ~~next - ~~value > 16 ? [first, middle, second] : [first, second];
+    if (subStep <= subs.length) {
+      value = subs[subStep - 1];
+    }
+  }
+  const rounded = Math.round(value * 100) / 100;
+  const sign = isNegative ? "-" : "";
+  return `${sign}${rounded}${unit}`;
+};
+const SPACING_PROPS_KEBAB = new Set(
+  [...SPACING_PROPS].map((k) => k.replace(/[A-Z]/g, (m) => "-" + m.toLowerCase()))
+);
+const resolveDSValue = (key, val, ds) => {
+  if (typeof val !== "string") return val;
+  if (CSS_COLOR_PROPS.has(key)) {
+    const colorMap = ds?.color || {};
+    if (colorMap[val]) return colorMap[val];
+  }
+  if (SPACING_PROPS.has(key) || SPACING_PROPS_KEBAB.has(key)) {
+    const spacing = ds?.spacing || {};
+    const resolved = resolveSpacingToken(val, spacing);
+    if (resolved) return resolved;
+  }
+  return val;
+};
 const CSS_COLOR_PROPS = /* @__PURE__ */ new Set([
   "color",
   "background",
@@ -237,7 +587,11 @@ const NON_CSS_PROPS = /* @__PURE__ */ new Set([
   "autofocus",
   "theme",
   "__element",
-  "update"
+  "update",
+  "childrenAs",
+  "childExtends",
+  "childProps",
+  "children"
 ]);
 const camelToKebab = (str) => str.replace(/[A-Z]/g, (m) => "-" + m.toLowerCase());
 const resolveShorthand = (key, val) => {
@@ -253,11 +607,15 @@ const resolveShorthand = (key, val) => {
   }
   if ((key === "align" || key === "flexAlign") && typeof val === "string") {
     const [alignItems, justifyContent] = val.split(" ");
-    return { display: "flex", "align-items": alignItems, "justify-content": justifyContent };
+    const result = { display: "flex", "align-items": alignItems };
+    if (justifyContent) result["justify-content"] = justifyContent;
+    return result;
   }
   if (key === "gridAlign" && typeof val === "string") {
     const [alignItems, justifyContent] = val.split(" ");
-    return { display: "grid", "align-items": alignItems, "justify-content": justifyContent };
+    const result = { display: "grid", "align-items": alignItems };
+    if (justifyContent) result["justify-content"] = justifyContent;
+    return result;
   }
   if (key === "flexFlow" && typeof val === "string") {
     let [direction, wrap] = (val || "row").split(" ");
@@ -268,6 +626,9 @@ const resolveShorthand = (key, val) => {
   if (key === "flexWrap") {
     return { display: "flex", "flex-wrap": val };
   }
+  if (key === "backgroundImage" && typeof val === "string" && !val.startsWith("url(") && !val.startsWith("linear-gradient") && !val.startsWith("radial-gradient") && !val.startsWith("none")) {
+    return { "background-image": `url(${val})` };
+  }
   if (key === "round" || key === "borderRadius" && val) {
     return { "border-radius": typeof val === "number" ? val + "px" : val };
   }
@@ -299,21 +660,23 @@ const resolveShorthand = (key, val) => {
   if (key === "rowStart") return { "grid-row-start": val };
   return null;
 };
-const resolveInnerProps = (obj, colorMap) => {
+const resolveInnerProps = (obj, ds) => {
   const result = {};
   for (const k in obj) {
     const v = obj[k];
     const expanded = resolveShorthand(k, v);
     if (expanded) {
-      Object.assign(result, expanded);
+      for (const ek in expanded) {
+        result[ek] = resolveDSValue(ek, expanded[ek], ds);
+      }
       continue;
     }
     if (typeof v !== "string" && typeof v !== "number") continue;
-    result[camelToKebab(k)] = CSS_COLOR_PROPS.has(k) && colorMap[v] ? colorMap[v] : v;
+    result[camelToKebab(k)] = resolveDSValue(k, v, ds);
   }
   return result;
 };
-const buildCSSFromProps = (props, colorMap, mediaMap) => {
+const buildCSSFromProps = (props, ds, mediaMap) => {
   const base = {};
   const mediaRules = {};
   const pseudoRules = {};
@@ -322,13 +685,13 @@ const buildCSSFromProps = (props, colorMap, mediaMap) => {
     if (key.charCodeAt(0) === 64 && typeof val === "object") {
       const bp = mediaMap?.[key.slice(1)];
       if (bp) {
-        const inner = resolveInnerProps(val, colorMap);
+        const inner = resolveInnerProps(val, ds);
         if (Object.keys(inner).length) mediaRules[bp] = inner;
       }
       continue;
     }
     if (key.charCodeAt(0) === 58 && typeof val === "object") {
-      const inner = resolveInnerProps(val, colorMap);
+      const inner = resolveInnerProps(val, ds);
       if (Object.keys(inner).length) pseudoRules[key] = inner;
       continue;
     }
@@ -337,10 +700,12 @@ const buildCSSFromProps = (props, colorMap, mediaMap) => {
     if (NON_CSS_PROPS.has(key)) continue;
     const expanded = resolveShorthand(key, val);
     if (expanded) {
-      Object.assign(base, expanded);
+      for (const ek in expanded) {
+        base[ek] = resolveDSValue(ek, expanded[ek], ds);
+      }
       continue;
     }
-    base[camelToKebab(key)] = CSS_COLOR_PROPS.has(key) && colorMap[val] ? colorMap[val] : val;
+    base[camelToKebab(key)] = resolveDSValue(key, val, ds);
   }
   return { base, mediaRules, pseudoRules };
 };
@@ -375,8 +740,35 @@ const getExtendsCSS = (el) => {
   }
   return null;
 };
+const resolveElementProps = (el) => {
+  const { props } = el;
+  if (!props) return props;
+  let resolved;
+  for (const key in props) {
+    if (typeof props[key] !== "function") continue;
+    if (NON_CSS_PROPS.has(key)) continue;
+    if (key.charCodeAt(0) >= 65 && key.charCodeAt(0) <= 90) continue;
+    if (key.startsWith("on")) continue;
+    if (!resolved) resolved = { ...props };
+    let result;
+    try {
+      result = props[key](el, el.state || {});
+    } catch {
+      try {
+        const mockState = { root: {}, ...el.state || {} };
+        result = props[key](el, mockState);
+      } catch {
+      }
+    }
+    if (result !== void 0 && result !== null && result !== false) {
+      resolved[key] = result;
+    } else {
+      delete resolved[key];
+    }
+  }
+  return resolved || props;
+};
 const extractCSS = (element, ds) => {
-  const colorMap = ds?.color || {};
   const mediaMap = ds?.media || {};
   const animations = ds?.animation || {};
   const rules = [];
@@ -384,12 +776,12 @@ const extractCSS = (element, ds) => {
   const usedAnimations = /* @__PURE__ */ new Set();
   const walk = (el) => {
     if (!el || !el.__ref) return;
-    const { props } = el;
+    const props = resolveElementProps(el);
     if (props && el.node) {
       const cls = el.node.getAttribute?.("class");
       if (cls && !seen.has(cls)) {
         seen.add(cls);
-        const cssResult = buildCSSFromProps(props, colorMap, mediaMap);
+        const cssResult = buildCSSFromProps(props, ds, mediaMap);
         const extsCss = getExtendsCSS(el);
         if (extsCss) {
           for (const [k, v] of Object.entries(extsCss)) {
@@ -406,7 +798,7 @@ const extractCSS = (element, ds) => {
         }
       }
     }
-    if (el.__ref.__children) {
+    if (el.__ref?.__children) {
       for (const ck of el.__ref.__children) {
         if (el[ck]?.__ref) walk(el[ck]);
       }
@@ -430,8 +822,21 @@ const generateResetCSS = (reset) => {
   if (!reset) return "";
   const rules = [];
   for (const [selector, props] of Object.entries(reset)) {
-    const decls = Object.entries(props).map(([k, v]) => `${camelToKebab(k)}: ${v}`).join("; ");
-    if (decls) rules.push(`${selector} { ${decls}; }`);
+    if (!props || typeof props !== "object") continue;
+    const baseDecls = [];
+    const mediaRules = [];
+    for (const [k, v] of Object.entries(props)) {
+      if (typeof v === "object" && v !== null) {
+        if (k.startsWith("@media") || k.startsWith("@")) {
+          const inner = Object.entries(v).filter(([, iv]) => typeof iv !== "object").map(([ik, iv]) => `${camelToKebab(ik)}: ${iv}`).join("; ");
+          if (inner) mediaRules.push(`${k} { ${selector} { ${inner}; } }`);
+        }
+        continue;
+      }
+      baseDecls.push(`${camelToKebab(k)}: ${v}`);
+    }
+    if (baseDecls.length) rules.push(`${selector} { ${baseDecls.join("; ")}; }`);
+    rules.push(...mediaRules);
   }
   return rules.join("\n");
 };
@@ -440,6 +845,7 @@ const generateFontLinks = (ds) => {
   const families = ds.font_family || ds.fontFamily || {};
   const fontNames = /* @__PURE__ */ new Set();
   for (const val of Object.values(families)) {
+    if (typeof val !== "string") continue;
     const match = val.match(/'([^']+)'/);
     if (match) fontNames.add(match[1]);
   }

package/dist/cjs/sitemap.js

@@ -0,0 +1,41 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var sitemap_exports = {};
+__export(sitemap_exports, {
+  generateSitemap: () => generateSitemap
+});
+module.exports = __toCommonJS(sitemap_exports);
+function generateSitemap(baseUrl, routes) {
+  const urls = Object.entries(routes).map(([path, config]) => {
+    const metadata = config.metadata || {};
+    const canonical = metadata.canonical || `${baseUrl}${path === "/" ? "" : path}`;
+    return `
+  <url>
+    <loc>${canonical}</loc>
+    <lastmod>${(/* @__PURE__ */ new Date()).toISOString()}</lastmod>
+    <changefreq>weekly</changefreq>
+    <priority>${path === "/" ? "1.0" : "0.8"}</priority>
+  </url>`;
+  });
+  return `<?xml version="1.0" encoding="UTF-8"?>
+<urlset
+  xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
+  xmlns:xhtml="http://www.w3.org/1999/xhtml">
+${urls.join("\n")}
+</urlset>`;
+}