@kilivi/payloadcms-theme-management 2.0.0 → 2.2.0

package/dist/utils/generateThemeCSS.js

@@ -1,4 +1,5 @@
 import { borderRadiusPresets } from '../providers/Theme/themeConfig.js';
+import { hexToHsl } from './themeColors.js';
 /**
  * Generates complete CSS for a theme preset
  * Creates both light and dark mode CSS variables
@@ -31,45 +32,6 @@ import { borderRadiusPresets } from '../providers/Theme/themeConfig.js';
     sections.push(buildCssBlock(`[data-theme='${name}'][data-theme-mode='dark']`, darkLines));
     return sections.join('\n').trim();
 }
-/**
- * Convert HEX color to HSL format
- * Example: #3b82f6 -> hsl(221, 83%, 53%)
- */ function hexToHsl(hex) {
-    let normalized = hex.trim();
-    if (!normalized.startsWith('#')) {
-        normalized = `#${normalized}`;
-    }
-    if (normalized.length === 4) {
-        normalized = `#${normalized[1]}${normalized[1]}${normalized[2]}${normalized[2]}${normalized[3]}${normalized[3]}`;
-    }
-    const r = parseInt(normalized.substring(1, 3), 16) / 255;
-    const g = parseInt(normalized.substring(3, 5), 16) / 255;
-    const b = parseInt(normalized.substring(5, 7), 16) / 255;
-    const max = Math.max(r, g, b);
-    const min = Math.min(r, g, b);
-    let h = 0;
-    let s = 0;
-    const l = (max + min) / 2;
-    if (max !== min) {
-        const d = max - min;
-        s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
-        switch(max){
-            case r:
-                h = ((g - b) / d + (g < b ? 6 : 0)) / 6;
-                break;
-            case g:
-                h = ((b - r) / d + 2) / 6;
-                break;
-            case b:
-                h = ((r - g) / d + 4) / 6;
-                break;
-        }
-    }
-    const hDeg = Math.round(h * 360);
-    const sPercent = Math.round(s * 100);
-    const lPercent = Math.round(l * 100);
-    return `hsl(${hDeg}, ${sPercent}%, ${lPercent}%)`;
-}
 function toCssColor(color) {
     if (!color) return null;
     const trimmed = color.trim();
@@ -280,7 +242,7 @@ function toKebab(token) {
 }
 function getDefaultTypography() {
     return {
-        fontFamily: 'var(--font-geist-sans)',
+        fontFamily: 'var(--font-inter, var(--font-geist-sans), system-ui, sans-serif)',
         headingFamily: 'var(--font-outfit)',
         baseFontSize: '16px',
         lineHeight: '1.75',

package/dist/utils/generateThemeCSS.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/utils/generateThemeCSS.ts"],"sourcesContent":["import type { ThemePreset } from '../presets.js'\nimport { borderRadiusPresets } from '../providers/Theme/themeConfig.js'\n\n/**\n * Generates complete CSS for a theme preset\n * Creates both light and dark mode CSS variables\n */\nexport function generateThemeCSS(preset: ThemePreset): string {\n  const { name, label, borderRadius, typography, lightMode, darkMode } = preset\n\n  const rootLines: string[] = []\n  const darkLines: string[] = []\n\n  // Typography\n  const typographyPreset = typography ?? getDefaultTypography()\n  pushTypography(rootLines, typographyPreset)\n\n  // Layout (shared across themes)\n  pushLayoutDefaults(rootLines)\n\n  // Border radius based on preset definition\n  pushBorderRadius(rootLines, borderRadius)\n\n  // Component system defaults derived from colors\n  pushComponentDefaults(rootLines, lightMode)\n\n  // Light mode colours\n  pushColorTokens(rootLines, lightMode, 'light')\n\n  // Shared status colors (can be overridden later)\n  pushStatusColors(rootLines, 'light')\n\n  // Dark mode colors\n  pushColorTokens(darkLines, darkMode, 'dark')\n  pushStatusColors(darkLines, 'dark')\n  pushDarkModeComponentOverrides(darkLines, darkMode)\n\n  const sections: string[] = []\n  sections.push(`/* ${label} Theme */`)\n  sections.push(buildCssBlock(`[data-theme='${name}']`, rootLines))\n\n  sections.push(`\n/* ${label} Theme - Dark Mode */`)\n  sections.push(buildCssBlock(`[data-theme='${name}'][data-theme-mode='dark']`, darkLines))\n\n  return sections.join('\\n').trim()\n}\n\n/**\n * Convert HEX color to HSL format\n * Example: #3b82f6 -> hsl(221, 83%, 53%)\n */\nfunction hexToHsl(hex: string): string {\n  let normalized = hex.trim()\n  if (!normalized.startsWith('#')) {\n    normalized = `#${normalized}`\n  }\n\n  if (normalized.length === 4) {\n    normalized = `#${normalized[1]}${normalized[1]}${normalized[2]}${normalized[2]}${normalized[3]}${normalized[3]}`\n  }\n\n  const r = parseInt(normalized.substring(1, 3), 16) / 255\n  const g = parseInt(normalized.substring(3, 5), 16) / 255\n  const b = parseInt(normalized.substring(5, 7), 16) / 255\n\n  const max = Math.max(r, g, b)\n  const min = Math.min(r, g, b)\n  let h = 0\n  let s = 0\n  const l = (max + min) / 2\n\n  if (max !== min) {\n    const d = max - min\n    s = l > 0.5 ? d / (2 - max - min) : d / (max + min)\n\n    switch (max) {\n      case r:\n        h = ((g - b) / d + (g < b ? 6 : 0)) / 6\n        break\n      case g:\n        h = ((b - r) / d + 2) / 6\n        break\n      case b:\n        h = ((r - g) / d + 4) / 6\n        break\n    }\n  }\n\n  const hDeg = Math.round(h * 360)\n  const sPercent = Math.round(s * 100)\n  const lPercent = Math.round(l * 100)\n\n  return `hsl(${hDeg}, ${sPercent}%, ${lPercent}%)`\n}\n\nfunction toCssColor(color?: string | null): string | null {\n  if (!color) return null\n  const trimmed = color.trim()\n  if (/^var\\(/i.test(trimmed) || /^hsl\\(/i.test(trimmed) || /^rgb(a)?\\(/i.test(trimmed)) {\n    return trimmed\n  }\n  if (/^#?[0-9a-f]{6}$/i.test(trimmed) || /^#?[0-9a-f]{3}$/i.test(trimmed)) {\n    return hexToHsl(trimmed)\n  }\n  return trimmed\n}\n\nfunction buildCssBlock(selector: string, lines: string[]): string {\n  if (!lines.length) {\n    return `${selector} {}`\n  }\n\n  const body = lines.map((line) => (line.startsWith('--') ? `  ${line}` : line)).join('\\n')\n  return `${selector} {\\n${body}\\n}`\n}\n\nfunction pushTypography(lines: string[], typography: NonNullable<ThemePreset['typography']>): void {\n  const {\n    fontFamily,\n    headingFamily,\n    baseFontSize,\n    lineHeight,\n    fontWeights = {},\n    letterSpacing = {},\n  } = typography\n\n  if (fontFamily) lines.push(`--typography-fontFamily: ${fontFamily};`)\n  if (headingFamily) lines.push(`--typography-headingFamily: ${headingFamily};`)\n  if (baseFontSize) lines.push(`--typography-baseFontSize: ${baseFontSize};`)\n  if (lineHeight) lines.push(`--typography-lineHeight: ${lineHeight};`)\n\n  Object.entries(fontWeights).forEach(([token, weight]) => {\n    if (weight) {\n      lines.push(`--typography-fontWeights-${token}: ${weight};`)\n    }\n  })\n\n  Object.entries(letterSpacing).forEach(([token, value]) => {\n    if (value) {\n      lines.push(`--typography-letterSpacing-${token}: ${value};`)\n    }\n  })\n}\n\nfunction pushLayoutDefaults(lines: string[]): void {\n  lines.push('--layout-containerWidth: 1440px;')\n  lines.push('--layout-containerPadding: 1.5rem;')\n  lines.push('--layout-containerPaddingTablet: 2.5rem;')\n  lines.push('--layout-containerPaddingDesktop: 3rem;')\n  lines.push('--layout-sectionSpacing: 5rem;')\n  lines.push('--layout-sectionSpacingTablet: 7rem;')\n  lines.push('--layout-sectionSpacingDesktop: 9rem;')\n  lines.push('--layout-gridGap: 2rem;')\n  lines.push('--layout-gridGapTablet: 2.5rem;')\n  lines.push('--layout-gridGapDesktop: 3rem;')\n}\n\nfunction pushBorderRadius(lines: string[], borderRadius?: ThemePreset['borderRadius']): void {\n  const presetKey = borderRadius ?? 'medium'\n  const preset = borderRadiusPresets[presetKey]\n\n  if (preset?.css) {\n    Object.entries(preset.css).forEach(([token, value]) => {\n      lines.push(`${token}: ${value};`)\n    })\n\n    const defaultRadius =\n      preset.css['--radius-default'] ??\n      preset.css['--radius-medium'] ??\n      preset.css['--radius-large'] ??\n      preset.css['--radius']\n\n    if (defaultRadius) {\n      lines.push(`--radius: ${defaultRadius};`)\n    }\n  }\n}\n\nfunction pushComponentDefaults(lines: string[], lightMode?: ThemePreset['lightMode']): void {\n  lines.push('--components-button-padding: 1rem 2.5rem;')\n  lines.push('--components-button-padding-large: 1.25rem 3rem;')\n  lines.push('--components-button-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);')\n  lines.push('--components-button-hover-scale: 1.02;')\n  lines.push('--components-button-hover-opacity: 0.9;')\n  lines.push('--components-button-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);')\n  lines.push('--components-button-hover-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);')\n\n  lines.push('--components-card-padding: 2.5rem;')\n  lines.push('--components-card-padding-compact: 1.5rem;')\n  lines.push(\n    '--components-card-shadow: 0 4px 16px -4px rgba(34, 42, 69, 0.12), 0 2px 8px -2px rgba(34, 42, 69, 0.08);',\n  )\n  lines.push(\n    '--components-card-hover-shadow: 0 12px 48px -12px rgba(34, 42, 69, 0.2), 0 8px 32px -8px rgba(34, 42, 69, 0.12);',\n  )\n  lines.push('--components-card-hover-transform: translateY(-8px) scale(1.02);')\n\n  const borderColor = toCssColor(lightMode?.border)\n  if (borderColor) {\n    lines.push(`--components-card-border: 1px solid ${borderColor};`)\n    lines.push(`--components-input-border: 1.5px solid ${borderColor};`)\n  }\n\n  const primaryColor = toCssColor(lightMode?.primary)\n  if (primaryColor) {\n    lines.push(`--components-input-focus-border: 2px solid ${primaryColor};`)\n  }\n\n  lines.push('--components-input-height: 3.5rem;')\n  lines.push('--components-input-padding: 1.25rem 1.75rem;')\n}\n\nconst COLOR_TOKENS: Array<{\n  key: keyof NonNullable<ThemePreset['lightMode']>\n  wrapWithVar?: boolean\n}> = [\n  { key: 'background' },\n  { key: 'foreground' },\n  { key: 'card' },\n  { key: 'cardForeground' },\n  { key: 'popover' },\n  { key: 'popoverForeground' },\n  { key: 'primary', wrapWithVar: true },\n  { key: 'primaryForeground' },\n  { key: 'secondary' },\n  { key: 'secondaryForeground' },\n  { key: 'muted' },\n  { key: 'mutedForeground' },\n  { key: 'accent', wrapWithVar: true },\n  { key: 'accentForeground' },\n  { key: 'destructive' },\n  { key: 'destructiveForeground' },\n  { key: 'border' },\n  { key: 'input' },\n  { key: 'ring' },\n]\n\nfunction pushColorTokens(\n  lines: string[],\n  colors: ThemePreset['lightMode'] | ThemePreset['darkMode'],\n  mode: 'light' | 'dark',\n): void {\n  if (!colors) return\n\n  COLOR_TOKENS.forEach(({ key, wrapWithVar }) => {\n    const value = toCssColor(colors[key])\n    if (!value) return\n\n    if (key === 'ring') {\n      lines.push('--ring: var(--primary);')\n      return\n    }\n\n    if (wrapWithVar) {\n      const customVar = key === 'accent' ? '--accent-custom' : '--primary-custom'\n      lines.push(`--${toKebab(key)}: var(${customVar}, ${value});`)\n    } else {\n      lines.push(`--${toKebab(key)}: ${value};`)\n    }\n  })\n\n  if (mode === 'light') {\n    lines.push('--primary-hover: color-mix(in hsl, var(--primary), black 10%);')\n    lines.push('--secondary-hover: color-mix(in hsl, var(--secondary), black 10%);')\n    lines.push('--accent-hover: color-mix(in hsl, var(--accent), white 10%);')\n  } else {\n    lines.push('--primary-hover: color-mix(in hsl, var(--primary), white 10%);')\n    lines.push('--secondary-hover: color-mix(in hsl, var(--secondary), white 10%);')\n    lines.push('--accent-hover: color-mix(in hsl, var(--accent), white 10%);')\n  }\n}\n\nfunction pushStatusColors(lines: string[], mode: 'light' | 'dark'): void {\n  if (mode === 'light') {\n    lines.push('--success: hsl(120, 60%, 40%);')\n    lines.push('--success-foreground: hsl(0, 0%, 100%);')\n    lines.push('--warning: hsl(42, 85%, 55%);')\n    lines.push('--warning-foreground: hsl(25, 15%, 15%);')\n    lines.push('--error: hsl(0, 85%, 52%);')\n    lines.push('--error-foreground: hsl(0, 0%, 100%);')\n    lines.push('--info: var(--primary);')\n    lines.push('--info-foreground: var(--primary-foreground);')\n  } else {\n    lines.push('--success: hsl(120, 60%, 50%);')\n    lines.push('--success-foreground: hsl(0, 0%, 10%);')\n    lines.push('--warning: hsl(42, 85%, 55%);')\n    lines.push('--warning-foreground: hsl(0, 0%, 10%);')\n    lines.push('--error: hsl(0, 85%, 52%);')\n    lines.push('--error-foreground: hsl(0, 0%, 100%);')\n    lines.push('--info: var(--primary);')\n    lines.push('--info-foreground: var(--primary-foreground);')\n  }\n}\n\nfunction pushDarkModeComponentOverrides(lines: string[], darkMode?: ThemePreset['darkMode']): void {\n  lines.push(\n    '--components-card-shadow: 0 8px 32px -8px rgba(0, 0, 0, 0.6), 0 4px 16px -4px rgba(0, 0, 0, 0.4);',\n  )\n  lines.push(\n    '--components-card-hover-shadow: 0 16px 64px -16px rgba(0, 0, 0, 0.8), 0 12px 40px -12px rgba(0, 0, 0, 0.6);',\n  )\n\n  const borderColor = toCssColor(darkMode?.border)\n  if (borderColor) {\n    lines.push(`--components-card-border: 1px solid ${borderColor};`)\n  }\n\n  const primaryColor = toCssColor(darkMode?.primary)\n  if (primaryColor) {\n    lines.push(`--components-input-focus-border: 2px solid ${primaryColor};`)\n  }\n}\n\nfunction toKebab(token: string): string {\n  return token.replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`)\n}\n\nfunction getDefaultTypography(): NonNullable<ThemePreset['typography']> {\n  return {\n    fontFamily: 'var(--font-geist-sans)',\n    headingFamily: 'var(--font-outfit)',\n    baseFontSize: '16px',\n    lineHeight: '1.75',\n    fontWeights: {\n      light: '300',\n      normal: '400',\n      medium: '500',\n      semibold: '600',\n      bold: '700',\n      black: '900',\n    },\n    letterSpacing: {\n      tight: '-0.02em',\n      normal: '0',\n      wide: '0.025em',\n      wider: '0.05em',\n    },\n  }\n}\n\n/**\n * Generate CSS for all themes\n */\nexport function generateAllThemesCSS(presets: ThemePreset[]): string {\n  return presets.map((preset) => generateThemeCSS(preset)).join('\\n\\n')\n}\n"],"names":["borderRadiusPresets","generateThemeCSS","preset","name","label","borderRadius","typography","lightMode","darkMode","rootLines","darkLines","typographyPreset","getDefaultTypography","pushTypography","pushLayoutDefaults","pushBorderRadius","pushComponentDefaults","pushColorTokens","pushStatusColors","pushDarkModeComponentOverrides","sections","push","buildCssBlock","join","trim","hexToHsl","hex","normalized","startsWith","length","r","parseInt","substring","g","b","max","Math","min","h","s","l","d","hDeg","round","sPercent","lPercent","toCssColor","color","trimmed","test","selector","lines","body","map","line","fontFamily","headingFamily","baseFontSize","lineHeight","fontWeights","letterSpacing","Object","entries","forEach","token","weight","value","presetKey","css","defaultRadius","borderColor","border","primaryColor","primary","COLOR_TOKENS","key","wrapWithVar","colors","mode","customVar","toKebab","replace","match","toLowerCase","light","normal","medium","semibold","bold","black","tight","wide","wider","generateAllThemesCSS","presets"],"mappings":"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"}
+{"version":3,"sources":["../../src/utils/generateThemeCSS.ts"],"sourcesContent":["import type { ThemePreset } from '../presets.js'\nimport { borderRadiusPresets } from '../providers/Theme/themeConfig.js'\nimport { hexToHsl } from './themeColors.js'\n\n/**\n * Generates complete CSS for a theme preset\n * Creates both light and dark mode CSS variables\n */\nexport function generateThemeCSS(preset: ThemePreset): string {\n  const { name, label, borderRadius, typography, lightMode, darkMode } = preset\n\n  const rootLines: string[] = []\n  const darkLines: string[] = []\n\n  // Typography\n  const typographyPreset = typography ?? getDefaultTypography()\n  pushTypography(rootLines, typographyPreset)\n\n  // Layout (shared across themes)\n  pushLayoutDefaults(rootLines)\n\n  // Border radius based on preset definition\n  pushBorderRadius(rootLines, borderRadius)\n\n  // Component system defaults derived from colors\n  pushComponentDefaults(rootLines, lightMode)\n\n  // Light mode colours\n  pushColorTokens(rootLines, lightMode, 'light')\n\n  // Shared status colors (can be overridden later)\n  pushStatusColors(rootLines, 'light')\n\n  // Dark mode colors\n  pushColorTokens(darkLines, darkMode, 'dark')\n  pushStatusColors(darkLines, 'dark')\n  pushDarkModeComponentOverrides(darkLines, darkMode)\n\n  const sections: string[] = []\n  sections.push(`/* ${label} Theme */`)\n  sections.push(buildCssBlock(`[data-theme='${name}']`, rootLines))\n\n  sections.push(`\n/* ${label} Theme - Dark Mode */`)\n  sections.push(buildCssBlock(`[data-theme='${name}'][data-theme-mode='dark']`, darkLines))\n\n  return sections.join('\\n').trim()\n}\n\nfunction toCssColor(color?: string | null): string | null {\n  if (!color) return null\n  const trimmed = color.trim()\n  if (/^var\\(/i.test(trimmed) || /^hsl\\(/i.test(trimmed) || /^rgb(a)?\\(/i.test(trimmed)) {\n    return trimmed\n  }\n  if (/^#?[0-9a-f]{6}$/i.test(trimmed) || /^#?[0-9a-f]{3}$/i.test(trimmed)) {\n    return hexToHsl(trimmed)\n  }\n  return trimmed\n}\n\nfunction buildCssBlock(selector: string, lines: string[]): string {\n  if (!lines.length) {\n    return `${selector} {}`\n  }\n\n  const body = lines.map((line) => (line.startsWith('--') ? `  ${line}` : line)).join('\\n')\n  return `${selector} {\\n${body}\\n}`\n}\n\nfunction pushTypography(lines: string[], typography: NonNullable<ThemePreset['typography']>): void {\n  const {\n    fontFamily,\n    headingFamily,\n    baseFontSize,\n    lineHeight,\n    fontWeights = {},\n    letterSpacing = {},\n  } = typography\n\n  if (fontFamily) lines.push(`--typography-fontFamily: ${fontFamily};`)\n  if (headingFamily) lines.push(`--typography-headingFamily: ${headingFamily};`)\n  if (baseFontSize) lines.push(`--typography-baseFontSize: ${baseFontSize};`)\n  if (lineHeight) lines.push(`--typography-lineHeight: ${lineHeight};`)\n\n  Object.entries(fontWeights).forEach(([token, weight]) => {\n    if (weight) {\n      lines.push(`--typography-fontWeights-${token}: ${weight};`)\n    }\n  })\n\n  Object.entries(letterSpacing).forEach(([token, value]) => {\n    if (value) {\n      lines.push(`--typography-letterSpacing-${token}: ${value};`)\n    }\n  })\n}\n\nfunction pushLayoutDefaults(lines: string[]): void {\n  lines.push('--layout-containerWidth: 1440px;')\n  lines.push('--layout-containerPadding: 1.5rem;')\n  lines.push('--layout-containerPaddingTablet: 2.5rem;')\n  lines.push('--layout-containerPaddingDesktop: 3rem;')\n  lines.push('--layout-sectionSpacing: 5rem;')\n  lines.push('--layout-sectionSpacingTablet: 7rem;')\n  lines.push('--layout-sectionSpacingDesktop: 9rem;')\n  lines.push('--layout-gridGap: 2rem;')\n  lines.push('--layout-gridGapTablet: 2.5rem;')\n  lines.push('--layout-gridGapDesktop: 3rem;')\n}\n\nfunction pushBorderRadius(lines: string[], borderRadius?: ThemePreset['borderRadius']): void {\n  const presetKey = borderRadius ?? 'medium'\n  const preset = borderRadiusPresets[presetKey]\n\n  if (preset?.css) {\n    Object.entries(preset.css).forEach(([token, value]) => {\n      lines.push(`${token}: ${value};`)\n    })\n\n    const defaultRadius =\n      preset.css['--radius-default'] ??\n      preset.css['--radius-medium'] ??\n      preset.css['--radius-large'] ??\n      preset.css['--radius']\n\n    if (defaultRadius) {\n      lines.push(`--radius: ${defaultRadius};`)\n    }\n  }\n}\n\nfunction pushComponentDefaults(lines: string[], lightMode?: ThemePreset['lightMode']): void {\n  lines.push('--components-button-padding: 1rem 2.5rem;')\n  lines.push('--components-button-padding-large: 1.25rem 3rem;')\n  lines.push('--components-button-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);')\n  lines.push('--components-button-hover-scale: 1.02;')\n  lines.push('--components-button-hover-opacity: 0.9;')\n  lines.push('--components-button-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);')\n  lines.push('--components-button-hover-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);')\n\n  lines.push('--components-card-padding: 2.5rem;')\n  lines.push('--components-card-padding-compact: 1.5rem;')\n  lines.push(\n    '--components-card-shadow: 0 4px 16px -4px rgba(34, 42, 69, 0.12), 0 2px 8px -2px rgba(34, 42, 69, 0.08);',\n  )\n  lines.push(\n    '--components-card-hover-shadow: 0 12px 48px -12px rgba(34, 42, 69, 0.2), 0 8px 32px -8px rgba(34, 42, 69, 0.12);',\n  )\n  lines.push('--components-card-hover-transform: translateY(-8px) scale(1.02);')\n\n  const borderColor = toCssColor(lightMode?.border)\n  if (borderColor) {\n    lines.push(`--components-card-border: 1px solid ${borderColor};`)\n    lines.push(`--components-input-border: 1.5px solid ${borderColor};`)\n  }\n\n  const primaryColor = toCssColor(lightMode?.primary)\n  if (primaryColor) {\n    lines.push(`--components-input-focus-border: 2px solid ${primaryColor};`)\n  }\n\n  lines.push('--components-input-height: 3.5rem;')\n  lines.push('--components-input-padding: 1.25rem 1.75rem;')\n}\n\nconst COLOR_TOKENS: Array<{\n  key: keyof NonNullable<ThemePreset['lightMode']>\n  wrapWithVar?: boolean\n}> = [\n  { key: 'background' },\n  { key: 'foreground' },\n  { key: 'card' },\n  { key: 'cardForeground' },\n  { key: 'popover' },\n  { key: 'popoverForeground' },\n  { key: 'primary', wrapWithVar: true },\n  { key: 'primaryForeground' },\n  { key: 'secondary' },\n  { key: 'secondaryForeground' },\n  { key: 'muted' },\n  { key: 'mutedForeground' },\n  { key: 'accent', wrapWithVar: true },\n  { key: 'accentForeground' },\n  { key: 'destructive' },\n  { key: 'destructiveForeground' },\n  { key: 'border' },\n  { key: 'input' },\n  { key: 'ring' },\n]\n\nfunction pushColorTokens(\n  lines: string[],\n  colors: ThemePreset['lightMode'] | ThemePreset['darkMode'],\n  mode: 'light' | 'dark',\n): void {\n  if (!colors) return\n\n  COLOR_TOKENS.forEach(({ key, wrapWithVar }) => {\n    const value = toCssColor(colors[key])\n    if (!value) return\n\n    if (key === 'ring') {\n      lines.push('--ring: var(--primary);')\n      return\n    }\n\n    if (wrapWithVar) {\n      const customVar = key === 'accent' ? '--accent-custom' : '--primary-custom'\n      lines.push(`--${toKebab(key)}: var(${customVar}, ${value});`)\n    } else {\n      lines.push(`--${toKebab(key)}: ${value};`)\n    }\n  })\n\n  if (mode === 'light') {\n    lines.push('--primary-hover: color-mix(in hsl, var(--primary), black 10%);')\n    lines.push('--secondary-hover: color-mix(in hsl, var(--secondary), black 10%);')\n    lines.push('--accent-hover: color-mix(in hsl, var(--accent), white 10%);')\n  } else {\n    lines.push('--primary-hover: color-mix(in hsl, var(--primary), white 10%);')\n    lines.push('--secondary-hover: color-mix(in hsl, var(--secondary), white 10%);')\n    lines.push('--accent-hover: color-mix(in hsl, var(--accent), white 10%);')\n  }\n}\n\nfunction pushStatusColors(lines: string[], mode: 'light' | 'dark'): void {\n  if (mode === 'light') {\n    lines.push('--success: hsl(120, 60%, 40%);')\n    lines.push('--success-foreground: hsl(0, 0%, 100%);')\n    lines.push('--warning: hsl(42, 85%, 55%);')\n    lines.push('--warning-foreground: hsl(25, 15%, 15%);')\n    lines.push('--error: hsl(0, 85%, 52%);')\n    lines.push('--error-foreground: hsl(0, 0%, 100%);')\n    lines.push('--info: var(--primary);')\n    lines.push('--info-foreground: var(--primary-foreground);')\n  } else {\n    lines.push('--success: hsl(120, 60%, 50%);')\n    lines.push('--success-foreground: hsl(0, 0%, 10%);')\n    lines.push('--warning: hsl(42, 85%, 55%);')\n    lines.push('--warning-foreground: hsl(0, 0%, 10%);')\n    lines.push('--error: hsl(0, 85%, 52%);')\n    lines.push('--error-foreground: hsl(0, 0%, 100%);')\n    lines.push('--info: var(--primary);')\n    lines.push('--info-foreground: var(--primary-foreground);')\n  }\n}\n\nfunction pushDarkModeComponentOverrides(lines: string[], darkMode?: ThemePreset['darkMode']): void {\n  lines.push(\n    '--components-card-shadow: 0 8px 32px -8px rgba(0, 0, 0, 0.6), 0 4px 16px -4px rgba(0, 0, 0, 0.4);',\n  )\n  lines.push(\n    '--components-card-hover-shadow: 0 16px 64px -16px rgba(0, 0, 0, 0.8), 0 12px 40px -12px rgba(0, 0, 0, 0.6);',\n  )\n\n  const borderColor = toCssColor(darkMode?.border)\n  if (borderColor) {\n    lines.push(`--components-card-border: 1px solid ${borderColor};`)\n  }\n\n  const primaryColor = toCssColor(darkMode?.primary)\n  if (primaryColor) {\n    lines.push(`--components-input-focus-border: 2px solid ${primaryColor};`)\n  }\n}\n\nfunction toKebab(token: string): string {\n  return token.replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`)\n}\n\nfunction getDefaultTypography(): NonNullable<ThemePreset['typography']> {\n  return {\n    fontFamily: 'var(--font-inter, var(--font-geist-sans), system-ui, sans-serif)',\n    headingFamily: 'var(--font-outfit)',\n    baseFontSize: '16px',\n    lineHeight: '1.75',\n    fontWeights: {\n      light: '300',\n      normal: '400',\n      medium: '500',\n      semibold: '600',\n      bold: '700',\n      black: '900',\n    },\n    letterSpacing: {\n      tight: '-0.02em',\n      normal: '0',\n      wide: '0.025em',\n      wider: '0.05em',\n    },\n  }\n}\n\n/**\n * Generate CSS for all themes\n */\nexport function generateAllThemesCSS(presets: ThemePreset[]): string {\n  return presets.map((preset) => generateThemeCSS(preset)).join('\\n\\n')\n}\n"],"names":["borderRadiusPresets","hexToHsl","generateThemeCSS","preset","name","label","borderRadius","typography","lightMode","darkMode","rootLines","darkLines","typographyPreset","getDefaultTypography","pushTypography","pushLayoutDefaults","pushBorderRadius","pushComponentDefaults","pushColorTokens","pushStatusColors","pushDarkModeComponentOverrides","sections","push","buildCssBlock","join","trim","toCssColor","color","trimmed","test","selector","lines","length","body","map","line","startsWith","fontFamily","headingFamily","baseFontSize","lineHeight","fontWeights","letterSpacing","Object","entries","forEach","token","weight","value","presetKey","css","defaultRadius","borderColor","border","primaryColor","primary","COLOR_TOKENS","key","wrapWithVar","colors","mode","customVar","toKebab","replace","match","toLowerCase","light","normal","medium","semibold","bold","black","tight","wide","wider","generateAllThemesCSS","presets"],"mappings":"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"}

package/dist/utils/livePreviewThemeRuntime.d.ts

@@ -1,7 +1,26 @@
-export declare const extractThemeConfigurationFromLiveData: (liveData: Record<string, unknown>, themeConfigurationKey?: string) => unknown;
-export declare const buildLivePreviewThemeRuntime: (themeConfiguration: unknown) => {
-    theme: "cyberpunk" | "minimal" | "retro" | "brutal" | "pastel" | "ocean" | "forest" | "sunset" | "lavender" | "neutral" | "blue" | "green" | "red" | "orange" | "rose" | "violet" | "zinc" | "slate" | "stone" | "gray" | "cool" | "neon" | "solar" | "dealership" | "real-estate" | "real-estate-gold" | "real-estate-neutral";
+import { type ThemeFontLoading } from '../constants/themeFonts.js';
+/**
+ * Keys that strongly indicate a live-preview payload is (or contains) a theme
+ * configuration object. Used to avoid applying default theme CSS when an
+ * unrelated form (e.g. a page editor) emits live-preview data.
+ */
+export declare const THEME_LIKE_KEYS: readonly ["theme", "colorMode", "allowColorModeToggle", "lightMode", "darkMode", "customCSS", "borderRadius", "fontScale", "spacing", "animationLevel"];
+export declare const isThemeLikeObject: (value: unknown) => value is Record<string, unknown>;
+/**
+ * Safely extract the theme configuration object from a live-preview payload.
+ *
+ * Returns `null` when the payload is unrelated (e.g. page form data) so callers
+ * can skip re-applying theme CSS instead of falling back to defaults — which
+ * would visibly reset the theme while editing other documents.
+ */
+export declare const extractThemeConfigurationFromLiveData: (liveData: Record<string, unknown> | undefined, themeConfigurationKey?: string) => Record<string, unknown> | null;
+export declare const buildLivePreviewThemeRuntime: (themeConfiguration: unknown, apiRoute?: string, fontLoading?: ThemeFontLoading) => {
+    theme: "cyberpunk" | "minimal" | "retro" | "brutal" | "pastel" | "ocean" | "forest" | "sunset" | "lavender" | "glassmorphism" | "claymorphism" | "neumorphism" | "aurora" | "luxury" | "healthcare" | "nordic" | "warm-earth" | "neutral" | "blue" | "green" | "red" | "orange" | "rose" | "violet" | "zinc" | "slate" | "stone" | "gray" | "cool" | "neon" | "solar" | "dealership" | "real-estate" | "real-estate-gold" | "real-estate-neutral";
     mode: "light" | "dark";
+    attributes: {
+        [k: string]: string;
+    };
+    fontsHref: string;
     css: string;
 };
 //# sourceMappingURL=livePreviewThemeRuntime.d.ts.map

package/dist/utils/livePreviewThemeRuntime.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"livePreviewThemeRuntime.d.ts","sourceRoot":"","sources":["../../src/utils/livePreviewThemeRuntime.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,qCAAqC,GAChD,UAAU,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EACjC,8BAA4C,KAC3C,OAOF,CAAA;AAkBD,eAAO,MAAM,4BAA4B,GAAI,oBAAoB,OAAO;;;;CA0CvE,CAAA"}
+{"version":3,"file":"livePreviewThemeRuntime.d.ts","sourceRoot":"","sources":["../../src/utils/livePreviewThemeRuntime.ts"],"names":[],"mappings":"AAAA,OAAO,EAAuB,KAAK,gBAAgB,EAAE,MAAM,4BAA4B,CAAA;AAOvF;;;;GAIG;AACH,eAAO,MAAM,eAAe,yJAWlB,CAAA;AAEV,eAAO,MAAM,iBAAiB,GAAI,OAAO,OAAO,KAAG,KAAK,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAKjF,CAAA;AAED;;;;;;GAMG;AACH,eAAO,MAAM,qCAAqC,GAChD,UAAU,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,SAAS,EAC7C,8BAA4C,KAC3C,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAa5B,CAAA;AAkBD,eAAO,MAAM,4BAA4B,GACvC,oBAAoB,OAAO,EAC3B,iBAAiB,EACjB,cAAa,gBAAgC;;;;;;;;CA2C9C,CAAA"}

package/dist/utils/livePreviewThemeRuntime.js

@@ -1,13 +1,48 @@
+import { buildThemeFontsHref } from '../constants/themeFonts.js';
 import { getBorderRadiusConfig } from '../providers/Theme/themeConfig.js';
 import { resolveThemeConfiguration } from './resolveThemeConfiguration.js';
 import { generateThemeColorsCss } from './themeColors.js';
+import { getThemeHtmlAttributes } from './themeHtmlAttributes.js';
 import { generateThemeCSS } from './themeUtils.js';
-export const extractThemeConfigurationFromLiveData = (liveData, themeConfigurationKey = 'themeConfiguration')=>{
+/**
+ * Keys that strongly indicate a live-preview payload is (or contains) a theme
+ * configuration object. Used to avoid applying default theme CSS when an
+ * unrelated form (e.g. a page editor) emits live-preview data.
+ */ export const THEME_LIKE_KEYS = [
+    'theme',
+    'colorMode',
+    'allowColorModeToggle',
+    'lightMode',
+    'darkMode',
+    'customCSS',
+    'borderRadius',
+    'fontScale',
+    'spacing',
+    'animationLevel'
+];
+export const isThemeLikeObject = (value)=>{
+    if (!value || typeof value !== 'object' || Array.isArray(value)) {
+        return false;
+    }
+    return THEME_LIKE_KEYS.some((key)=>key in value);
+};
+/**
+ * Safely extract the theme configuration object from a live-preview payload.
+ *
+ * Returns `null` when the payload is unrelated (e.g. page form data) so callers
+ * can skip re-applying theme CSS instead of falling back to defaults — which
+ * would visibly reset the theme while editing other documents.
+ */ export const extractThemeConfigurationFromLiveData = (liveData, themeConfigurationKey = 'themeConfiguration')=>{
     const candidate = liveData?.[themeConfigurationKey];
-    if (candidate && typeof candidate === 'object') {
+    if (candidate && typeof candidate === 'object' && !Array.isArray(candidate)) {
         return candidate;
     }
-    return liveData;
+    // Some forms emit the theme config object directly at the root.
+    if (isThemeLikeObject(liveData)) {
+        return liveData;
+    }
+    // Ignore unrelated live-preview payloads to avoid fallback defaults.
+    return null;
 };
 const resolveColorMode = (mode)=>{
     if (mode === 'dark') {
@@ -18,19 +53,9 @@ const resolveColorMode = (mode)=>{
     }
     return 'light';
 };
-export const buildLivePreviewThemeRuntime = (themeConfiguration)=>{
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+export const buildLivePreviewThemeRuntime = (themeConfiguration, apiRoute = '/api', fontLoading = 'self-hosted')=>{
     const resolved = resolveThemeConfiguration(themeConfiguration);
-    const borderRadiusMap = {
-        none: 'none',
-        small: 'small',
-        medium: 'medium',
-        large: 'large',
-        xl: 'xl',
-        full: 'xl'
-    };
-    const mappedBorderRadius = borderRadiusMap[resolved.borderRadius ?? 'medium'] ?? 'medium';
-    const borderRadiusConfig = getBorderRadiusConfig(mappedBorderRadius);
+    const borderRadiusConfig = getBorderRadiusConfig(resolved.borderRadius ?? 'medium');
     const cssRecord = typeof borderRadiusConfig?.css === 'string' ? {
         '--radius-default': borderRadiusConfig.css
     } : borderRadiusConfig?.css ?? {};
@@ -43,9 +68,17 @@ export const buildLivePreviewThemeRuntime = (themeConfiguration)=>{
         darkMode: resolved.darkMode
     });
     const customCSSBlock = typeof resolved.customCSS === 'string' ? resolved.customCSS.trim() : '';
+    // Every data-* attribute the generated CSS targets (effects, card / button /
+    // navbar styles …), so Visual Effects and Component Styles update live too.
+    const attributes = Object.fromEntries(Object.entries(getThemeHtmlAttributes(resolved)).filter((entry)=>entry[0].startsWith('data-') && typeof entry[1] === 'string'));
     return {
         theme: resolved.theme,
         mode: resolveColorMode(resolved.colorMode),
+        attributes,
+        fontsHref: buildThemeFontsHref(resolved.fontSelections ?? [], {
+            apiRoute,
+            mode: fontLoading
+        }),
         css: [
             borderRadiusBlock,
             themeConfigurationCSS,

package/dist/utils/livePreviewThemeRuntime.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/utils/livePreviewThemeRuntime.ts"],"sourcesContent":["import { getBorderRadiusConfig } from '../providers/Theme/themeConfig.js'\nimport { resolveThemeConfiguration } from './resolveThemeConfiguration.js'\nimport { generateThemeColorsCss } from './themeColors.js'\nimport { generateThemeCSS } from './themeUtils.js'\n\nexport const extractThemeConfigurationFromLiveData = (\n  liveData: Record<string, unknown>,\n  themeConfigurationKey = 'themeConfiguration',\n): unknown => {\n  const candidate = liveData?.[themeConfigurationKey]\n  if (candidate && typeof candidate === 'object') {\n    return candidate\n  }\n\n  return liveData\n}\n\nconst resolveColorMode = (mode: string): 'light' | 'dark' => {\n  if (mode === 'dark') {\n    return 'dark'\n  }\n\n  if (\n    mode === 'auto' &&\n    globalThis.window !== undefined &&\n    typeof globalThis.window.matchMedia === 'function'\n  ) {\n    return globalThis.window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'\n  }\n\n  return 'light'\n}\n\nexport const buildLivePreviewThemeRuntime = (themeConfiguration: unknown) => {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  const resolved = resolveThemeConfiguration(themeConfiguration as any)\n\n  const borderRadiusMap: Record<string, 'none' | 'small' | 'medium' | 'large' | 'xl'> = {\n    none: 'none',\n    small: 'small',\n    medium: 'medium',\n    large: 'large',\n    xl: 'xl',\n    full: 'xl',\n  }\n\n  const mappedBorderRadius = borderRadiusMap[resolved.borderRadius ?? 'medium'] ?? 'medium'\n  const borderRadiusConfig = getBorderRadiusConfig(mappedBorderRadius)\n  const cssRecord =\n    typeof borderRadiusConfig?.css === 'string'\n      ? { '--radius-default': borderRadiusConfig.css }\n      : (borderRadiusConfig?.css ?? {})\n\n  const borderRadiusCSS = Object.entries(cssRecord)\n    .map(([property, value]) => `  ${property}: ${value};`)\n    .join('\\n')\n\n  const borderRadiusBlock = borderRadiusCSS ? `:root {\\n${borderRadiusCSS}\\n}` : ''\n\n  const themeConfigurationCSS = generateThemeCSS(resolved)\n  const colorModesCSS = generateThemeColorsCss({\n    themeName: resolved.theme,\n    lightMode: resolved.lightMode,\n    darkMode: resolved.darkMode,\n  })\n\n  const customCSSBlock = typeof resolved.customCSS === 'string' ? resolved.customCSS.trim() : ''\n\n  return {\n    theme: resolved.theme,\n    mode: resolveColorMode(resolved.colorMode),\n    css: [borderRadiusBlock, themeConfigurationCSS, colorModesCSS, customCSSBlock]\n      .filter((block) => Boolean(block?.trim?.().length))\n      .join('\\n\\n'),\n  }\n}\n"],"names":["getBorderRadiusConfig","resolveThemeConfiguration","generateThemeColorsCss","generateThemeCSS","extractThemeConfigurationFromLiveData","liveData","themeConfigurationKey","candidate","resolveColorMode","mode","globalThis","window","undefined","matchMedia","matches","buildLivePreviewThemeRuntime","themeConfiguration","resolved","borderRadiusMap","none","small","medium","large","xl","full","mappedBorderRadius","borderRadius","borderRadiusConfig","cssRecord","css","borderRadiusCSS","Object","entries","map","property","value","join","borderRadiusBlock","themeConfigurationCSS","colorModesCSS","themeName","theme","lightMode","darkMode","customCSSBlock","customCSS","trim","colorMode","filter","block","Boolean","length"],"mappings":"AAAA,SAASA,qBAAqB,QAAQ,oCAAmC;AACzE,SAASC,yBAAyB,QAAQ,iCAAgC;AAC1E,SAASC,sBAAsB,QAAQ,mBAAkB;AACzD,SAASC,gBAAgB,QAAQ,kBAAiB;AAElD,OAAO,MAAMC,wCAAwC,CACnDC,UACAC,wBAAwB,oBAAoB;IAE5C,MAAMC,YAAYF,UAAU,CAACC,sBAAsB;IACnD,IAAIC,aAAa,OAAOA,cAAc,UAAU;QAC9C,OAAOA;IACT;IAEA,OAAOF;AACT,EAAC;AAED,MAAMG,mBAAmB,CAACC;IACxB,IAAIA,SAAS,QAAQ;QACnB,OAAO;IACT;IAEA,IACEA,SAAS,UACTC,WAAWC,MAAM,KAAKC,aACtB,OAAOF,WAAWC,MAAM,CAACE,UAAU,KAAK,YACxC;QACA,OAAOH,WAAWC,MAAM,CAACE,UAAU,CAAC,gCAAgCC,OAAO,GAAG,SAAS;IACzF;IAEA,OAAO;AACT;AAEA,OAAO,MAAMC,+BAA+B,CAACC;IAC3C,8DAA8D;IAC9D,MAAMC,WAAWhB,0BAA0Be;IAE3C,MAAME,kBAAgF;QACpFC,MAAM;QACNC,OAAO;QACPC,QAAQ;QACRC,OAAO;QACPC,IAAI;QACJC,MAAM;IACR;IAEA,MAAMC,qBAAqBP,eAAe,CAACD,SAASS,YAAY,IAAI,SAAS,IAAI;IACjF,MAAMC,qBAAqB3B,sBAAsByB;IACjD,MAAMG,YACJ,OAAOD,oBAAoBE,QAAQ,WAC/B;QAAE,oBAAoBF,mBAAmBE,GAAG;IAAC,IAC5CF,oBAAoBE,OAAO,CAAC;IAEnC,MAAMC,kBAAkBC,OAAOC,OAAO,CAACJ,WACpCK,GAAG,CAAC,CAAC,CAACC,UAAUC,MAAM,GAAK,CAAC,EAAE,EAAED,SAAS,EAAE,EAAEC,MAAM,CAAC,CAAC,EACrDC,IAAI,CAAC;IAER,MAAMC,oBAAoBP,kBAAkB,CAAC,SAAS,EAAEA,gBAAgB,GAAG,CAAC,GAAG;IAE/E,MAAMQ,wBAAwBnC,iBAAiBc;IAC/C,MAAMsB,gBAAgBrC,uBAAuB;QAC3CsC,WAAWvB,SAASwB,KAAK;QACzBC,WAAWzB,SAASyB,SAAS;QAC7BC,UAAU1B,SAAS0B,QAAQ;IAC7B;IAEA,MAAMC,iBAAiB,OAAO3B,SAAS4B,SAAS,KAAK,WAAW5B,SAAS4B,SAAS,CAACC,IAAI,KAAK;IAE5F,OAAO;QACLL,OAAOxB,SAASwB,KAAK;QACrBhC,MAAMD,iBAAiBS,SAAS8B,SAAS;QACzClB,KAAK;YAACQ;YAAmBC;YAAuBC;YAAeK;SAAe,CAC3EI,MAAM,CAAC,CAACC,QAAUC,QAAQD,OAAOH,SAASK,SAC1Cf,IAAI,CAAC;IACV;AACF,EAAC"}
+{"version":3,"sources":["../../src/utils/livePreviewThemeRuntime.ts"],"sourcesContent":["import { buildThemeFontsHref, type ThemeFontLoading } from '../constants/themeFonts.js'\nimport { getBorderRadiusConfig } from '../providers/Theme/themeConfig.js'\nimport { resolveThemeConfiguration } from './resolveThemeConfiguration.js'\nimport { generateThemeColorsCss } from './themeColors.js'\nimport { getThemeHtmlAttributes } from './themeHtmlAttributes.js'\nimport { generateThemeCSS } from './themeUtils.js'\n\n/**\n * Keys that strongly indicate a live-preview payload is (or contains) a theme\n * configuration object. Used to avoid applying default theme CSS when an\n * unrelated form (e.g. a page editor) emits live-preview data.\n */\nexport const THEME_LIKE_KEYS = [\n  'theme',\n  'colorMode',\n  'allowColorModeToggle',\n  'lightMode',\n  'darkMode',\n  'customCSS',\n  'borderRadius',\n  'fontScale',\n  'spacing',\n  'animationLevel',\n] as const\n\nexport const isThemeLikeObject = (value: unknown): value is Record<string, unknown> => {\n  if (!value || typeof value !== 'object' || Array.isArray(value)) {\n    return false\n  }\n  return THEME_LIKE_KEYS.some((key) => key in (value as Record<string, unknown>))\n}\n\n/**\n * Safely extract the theme configuration object from a live-preview payload.\n *\n * Returns `null` when the payload is unrelated (e.g. page form data) so callers\n * can skip re-applying theme CSS instead of falling back to defaults — which\n * would visibly reset the theme while editing other documents.\n */\nexport const extractThemeConfigurationFromLiveData = (\n  liveData: Record<string, unknown> | undefined,\n  themeConfigurationKey = 'themeConfiguration',\n): Record<string, unknown> | null => {\n  const candidate = liveData?.[themeConfigurationKey]\n  if (candidate && typeof candidate === 'object' && !Array.isArray(candidate)) {\n    return candidate as Record<string, unknown>\n  }\n\n  // Some forms emit the theme config object directly at the root.\n  if (isThemeLikeObject(liveData)) {\n    return liveData as Record<string, unknown>\n  }\n\n  // Ignore unrelated live-preview payloads to avoid fallback defaults.\n  return null\n}\n\nconst resolveColorMode = (mode: string): 'light' | 'dark' => {\n  if (mode === 'dark') {\n    return 'dark'\n  }\n\n  if (\n    mode === 'auto' &&\n    globalThis.window !== undefined &&\n    typeof globalThis.window.matchMedia === 'function'\n  ) {\n    return globalThis.window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'\n  }\n\n  return 'light'\n}\n\nexport const buildLivePreviewThemeRuntime = (\n  themeConfiguration: unknown,\n  apiRoute = '/api',\n  fontLoading: ThemeFontLoading = 'self-hosted',\n) => {\n  const resolved = resolveThemeConfiguration(themeConfiguration)\n\n  const borderRadiusConfig = getBorderRadiusConfig(resolved.borderRadius ?? 'medium')\n  const cssRecord =\n    typeof borderRadiusConfig?.css === 'string'\n      ? { '--radius-default': borderRadiusConfig.css }\n      : (borderRadiusConfig?.css ?? {})\n\n  const borderRadiusCSS = Object.entries(cssRecord)\n    .map(([property, value]) => `  ${property}: ${value};`)\n    .join('\\n')\n\n  const borderRadiusBlock = borderRadiusCSS ? `:root {\\n${borderRadiusCSS}\\n}` : ''\n\n  const themeConfigurationCSS = generateThemeCSS(resolved)\n  const colorModesCSS = generateThemeColorsCss({\n    themeName: resolved.theme,\n    lightMode: resolved.lightMode,\n    darkMode: resolved.darkMode,\n  })\n\n  const customCSSBlock = typeof resolved.customCSS === 'string' ? resolved.customCSS.trim() : ''\n\n  // Every data-* attribute the generated CSS targets (effects, card / button /\n  // navbar styles …), so Visual Effects and Component Styles update live too.\n  const attributes = Object.fromEntries(\n    Object.entries(getThemeHtmlAttributes(resolved)).filter(\n      (entry): entry is [string, string] =>\n        entry[0].startsWith('data-') && typeof entry[1] === 'string',\n    ),\n  )\n\n  return {\n    theme: resolved.theme,\n    mode: resolveColorMode(resolved.colorMode),\n    attributes,\n    fontsHref: buildThemeFontsHref(resolved.fontSelections ?? [], { apiRoute, mode: fontLoading }),\n    css: [borderRadiusBlock, themeConfigurationCSS, colorModesCSS, customCSSBlock]\n      .filter((block) => Boolean(block?.trim?.().length))\n      .join('\\n\\n'),\n  }\n}\n"],"names":["buildThemeFontsHref","getBorderRadiusConfig","resolveThemeConfiguration","generateThemeColorsCss","getThemeHtmlAttributes","generateThemeCSS","THEME_LIKE_KEYS","isThemeLikeObject","value","Array","isArray","some","key","extractThemeConfigurationFromLiveData","liveData","themeConfigurationKey","candidate","resolveColorMode","mode","globalThis","window","undefined","matchMedia","matches","buildLivePreviewThemeRuntime","themeConfiguration","apiRoute","fontLoading","resolved","borderRadiusConfig","borderRadius","cssRecord","css","borderRadiusCSS","Object","entries","map","property","join","borderRadiusBlock","themeConfigurationCSS","colorModesCSS","themeName","theme","lightMode","darkMode","customCSSBlock","customCSS","trim","attributes","fromEntries","filter","entry","startsWith","colorMode","fontsHref","fontSelections","block","Boolean","length"],"mappings":"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"}

package/dist/utils/localizedText.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Payload field labels, descriptions and placeholders arrive either as plain
+ * strings or as `{ en, cs, … }` objects. Resolve them against the active admin
+ * language (full tag, then base language), falling back to English and then to
+ * the first available translation.
+ */
+export declare function resolveLocalizedText(value: unknown, language: string, fallback?: string): string;
+//# sourceMappingURL=localizedText.d.ts.map

package/dist/utils/localizedText.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"localizedText.d.ts","sourceRoot":"","sources":["../../src/utils/localizedText.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,wBAAgB,oBAAoB,CAClC,KAAK,EAAE,OAAO,EACd,QAAQ,EAAE,MAAM,EAChB,QAAQ,SAAK,GACZ,MAAM,CASR"}

package/dist/utils/localizedText.js

@@ -0,0 +1,21 @@
+/**
+ * Payload field labels, descriptions and placeholders arrive either as plain
+ * strings or as `{ en, cs, … }` objects. Resolve them against the active admin
+ * language (full tag, then base language), falling back to English and then to
+ * the first available translation.
+ */ export function resolveLocalizedText(value, language, fallback = '') {
+    if (typeof value === 'string') return value;
+    if (!value || typeof value !== 'object') return fallback;
+    const localized = value;
+    const base = language.split('-')[0];
+    const candidates = [
+        localized[language],
+        localized[base],
+        localized.en,
+        ...Object.values(localized)
+    ];
+    const resolved = candidates.find((candidate)=>typeof candidate === 'string');
+    return resolved ?? fallback;
+}
+
+//# sourceMappingURL=localizedText.js.map

package/dist/utils/localizedText.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/utils/localizedText.ts"],"sourcesContent":["/**\n * Payload field labels, descriptions and placeholders arrive either as plain\n * strings or as `{ en, cs, … }` objects. Resolve them against the active admin\n * language (full tag, then base language), falling back to English and then to\n * the first available translation.\n */\nexport function resolveLocalizedText(\n  value: unknown,\n  language: string,\n  fallback = '',\n): string {\n  if (typeof value === 'string') return value\n  if (!value || typeof value !== 'object') return fallback\n\n  const localized = value as Record<string, unknown>\n  const base = language.split('-')[0]\n  const candidates = [localized[language], localized[base], localized.en, ...Object.values(localized)]\n  const resolved = candidates.find((candidate): candidate is string => typeof candidate === 'string')\n  return resolved ?? fallback\n}\n"],"names":["resolveLocalizedText","value","language","fallback","localized","base","split","candidates","en","Object","values","resolved","find","candidate"],"mappings":"AAAA;;;;;CAKC,GACD,OAAO,SAASA,qBACdC,KAAc,EACdC,QAAgB,EAChBC,WAAW,EAAE;IAEb,IAAI,OAAOF,UAAU,UAAU,OAAOA;IACtC,IAAI,CAACA,SAAS,OAAOA,UAAU,UAAU,OAAOE;IAEhD,MAAMC,YAAYH;IAClB,MAAMI,OAAOH,SAASI,KAAK,CAAC,IAAI,CAAC,EAAE;IACnC,MAAMC,aAAa;QAACH,SAAS,CAACF,SAAS;QAAEE,SAAS,CAACC,KAAK;QAAED,UAAUI,EAAE;WAAKC,OAAOC,MAAM,CAACN;KAAW;IACpG,MAAMO,WAAWJ,WAAWK,IAAI,CAAC,CAACC,YAAmC,OAAOA,cAAc;IAC1F,OAAOF,YAAYR;AACrB"}

package/dist/utils/resolveThemeConfiguration.d.ts

@@ -11,6 +11,8 @@ interface ThemeTypographyOverride {
     headingFontCustom?: string | null;
     baseFontSize?: string | null;
     lineHeight?: string | null;
+    headingWeight?: string | null;
+    letterSpacing?: string | null;
 }
 /**
  * Generic theme configuration interface that accepts any compatible structure
@@ -46,6 +48,29 @@ interface GenericThemeConfiguration {
         info?: string | null;
     } | null;
     typography?: ThemeTypographyOverride | null;
+    fontSelections?: string[] | null;
+    typographyOverridden?: boolean | null;
+    visualEffects?: {
+        effectStyle?: string | null;
+        shadowIntensity?: string | null;
+        backdropBlur?: string | null;
+        borderStyle?: string | null;
+        borderWidth?: string | null;
+        glassOpacity?: number | null;
+    } | null;
+    componentStyles?: {
+        buttonVariant?: string | null;
+        buttonSize?: string | null;
+        cardStyle?: string | null;
+        cardHoverEffect?: string | null;
+        imageStyle?: string | null;
+        iconSet?: string | null;
+        navbarStyle?: string | null;
+        footerStyle?: string | null;
+        linkStyle?: string | null;
+        enableScrollReveal?: boolean | null;
+        enableHoverAnimations?: boolean | null;
+    } | null;
 }
 declare const BORDER_RADIUS_VALUES: readonly ["none", "small", "medium", "large", "xl"];
 declare const FONT_SCALE_VALUES: readonly ["small", "medium", "large"];
@@ -56,6 +81,27 @@ type FontScaleOption = (typeof FONT_SCALE_VALUES)[number];
 type SpacingOption = (typeof SPACING_VALUES)[number];
 type AnimationLevelOption = (typeof ANIMATION_LEVEL_VALUES)[number];
 type ThemeColorConfiguration = NonNullable<GenericThemeConfiguration['lightMode']>;
+export interface ResolvedVisualEffects {
+    effectStyle?: string | null;
+    shadowIntensity?: string | null;
+    backdropBlur?: string | null;
+    borderStyle?: string | null;
+    borderWidth?: string | null;
+    glassOpacity?: number | null;
+}
+export interface ResolvedComponentStyles {
+    buttonVariant?: string | null;
+    buttonSize?: string | null;
+    cardStyle?: string | null;
+    cardHoverEffect?: string | null;
+    imageStyle?: string | null;
+    iconSet?: string | null;
+    navbarStyle?: string | null;
+    footerStyle?: string | null;
+    linkStyle?: string | null;
+    enableScrollReveal?: boolean | null;
+    enableHoverAnimations?: boolean | null;
+}
 export interface ResolvedThemeConfiguration {
     theme: ThemeDefaults;
     colorMode: Mode;
@@ -68,8 +114,21 @@ export interface ResolvedThemeConfiguration {
     lightMode?: ThemeColorConfiguration;
     darkMode?: ThemeColorConfiguration;
     typography: ThemeTypographyPreset | null;
+    /**
+     * The body / heading font values picked in the admin ('Inter', 'Lora' …),
+     * kept so the font files can be requested (see `ServerThemeInjector`).
+     */
+    fontSelections?: string[];
+    /**
+     * True when the editor picked something in Typography (a font, size, line
+     * height, heading weight or tracking) instead of "Use theme preset". Base
+     * typography rules are only emitted then, so untouched sites render as before.
+     */
+    typographyOverridden?: boolean;
+    visualEffects?: ResolvedVisualEffects | null;
+    componentStyles?: ResolvedComponentStyles | null;
 }
 export declare const DEFAULT_THEME_CONFIGURATION: ResolvedThemeConfiguration;
-export declare function resolveThemeConfiguration(themeConfiguration?: GenericThemeConfiguration | null): ResolvedThemeConfiguration;
+export declare function resolveThemeConfiguration(themeConfiguration?: unknown): ResolvedThemeConfiguration;
 export {};
 //# sourceMappingURL=resolveThemeConfiguration.d.ts.map

package/dist/utils/resolveThemeConfiguration.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"resolveThemeConfiguration.d.ts","sourceRoot":"","sources":["../../src/utils/resolveThemeConfiguration.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"resolveThemeConfiguration.d.ts","sourceRoot":"","sources":["../../src/utils/resolveThemeConfiguration.ts"],"names":[],"mappings":"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"}

package/dist/utils/resolveThemeConfiguration.js

@@ -1,4 +1,4 @@
-import { FONT_VALUE_TO_CSS } from '../constants/themeFonts.js';
+import { getFontCatalogEntry, LETTER_SPACING_TO_CSS, toFontSizeCss } from '../constants/themeFonts.js';
 import { allThemePresets } from '../presets.js';
 import { themeIsValid } from '../providers/Theme/types.js';
 const BORDER_RADIUS_VALUES = [
@@ -21,6 +21,10 @@ const SPACING_VALUES = [
     'medium',
     'spacious'
 ];
+// Earlier versions stored the roomiest spacing option as 'comfortable'.
+const LEGACY_SPACING_ALIASES = {
+    comfortable: 'spacious'
+};
 const ANIMATION_LEVEL_VALUES = [
     'none',
     'reduced',
@@ -84,15 +88,17 @@ function isMode(value) {
     return typeof value === 'string' && MODE_VALUES.includes(value);
 }
 export function resolveThemeConfiguration(themeConfiguration) {
-    if (!themeConfiguration) {
+    // Accept `unknown` so callers don't need to cast from app-specific payload-types
+    const cfg = themeConfiguration !== null && typeof themeConfiguration === 'object' && !Array.isArray(themeConfiguration) ? themeConfiguration : null;
+    if (!cfg) {
         return DEFAULT_THEME_CONFIGURATION;
     }
-    const { theme, colorMode, allowColorModeToggle, borderRadius, fontScale, spacing, animationLevel, customCSS, lightMode, darkMode, typography } = themeConfiguration;
+    const { theme, colorMode, allowColorModeToggle, borderRadius, fontScale, spacing, animationLevel, customCSS, lightMode, darkMode, typography, visualEffects, componentStyles } = cfg;
     const resolvedTheme = typeof theme === 'string' && themeIsValid(theme) ? theme : DEFAULT_THEME_CONFIGURATION.theme;
     const resolvedMode = isMode(colorMode) ? colorMode : DEFAULT_THEME_CONFIGURATION.colorMode;
     const resolvedBorderRadius = resolveBorderRadius(borderRadius);
     const resolvedFontScale = isFontScale(fontScale) ? fontScale : DEFAULT_THEME_CONFIGURATION.fontScale;
-    const resolvedSpacing = isSpacing(spacing) ? spacing : DEFAULT_THEME_CONFIGURATION.spacing;
+    const resolvedSpacing = isSpacing(spacing) ? spacing : typeof spacing === 'string' && LEGACY_SPACING_ALIASES[spacing] || DEFAULT_THEME_CONFIGURATION.spacing;
     const resolvedAnimationLevel = resolveAnimationLevel(animationLevel);
     const resolvedAllowToggle = typeof allowColorModeToggle === 'boolean' ? allowColorModeToggle : DEFAULT_THEME_CONFIGURATION.allowColorModeToggle;
     const resolvedCustomCSS = typeof customCSS === 'string' ? customCSS : null;
@@ -101,7 +107,26 @@ export function resolveThemeConfiguration(themeConfiguration) {
     const baseDarkMode = preset?.darkMode ?? DEFAULT_THEME_CONFIGURATION.darkMode;
     const resolvedLightMode = mergeColorModes(baseLightMode, lightMode);
     const resolvedDarkMode = mergeColorModes(baseDarkMode, darkMode);
-    const resolvedTypography = mergeTypography(preset?.typography, typography) ?? preset?.typography ?? null;
+    // Accept an already-resolved configuration too (callers often resolve once and
+    // pass the result to several helpers): its typography is final, keep it as is.
+    const typographyIsResolved = typography !== null && typeof typography === 'object' && typeof typography.fontFamily === 'string';
+    const resolvedTypography = typographyIsResolved ? typography : mergeTypography(preset?.typography, typography) ?? preset?.typography ?? null;
+    const isSet = (value)=>typeof value === 'string' && value !== '' && value !== 'preset';
+    const typographyOverridden = typographyIsResolved ? cfg.typographyOverridden === true : Boolean(typography && [
+        typography.bodyFont,
+        typography.headingFont,
+        typography.baseFontSize,
+        typography.lineHeight,
+        typography.headingWeight,
+        typography.letterSpacing
+    ].some(isSet));
+    const fontSelections = typographyIsResolved ? cfg.fontSelections ?? [] : [
+        typography?.bodyFont,
+        typography?.headingFont
+    ].filter((value)=>typeof value === 'string' && value !== 'preset' && value !== 'custom');
+    // Pass visualEffects and componentStyles through as-is (no normalization needed)
+    const resolvedVisualEffects = visualEffects ?? null;
+    const resolvedComponentStyles = componentStyles ?? null;
     return {
         theme: resolvedTheme,
         colorMode: resolvedMode,
@@ -113,7 +138,11 @@ export function resolveThemeConfiguration(themeConfiguration) {
         customCSS: resolvedCustomCSS,
         lightMode: resolvedLightMode,
         darkMode: resolvedDarkMode,
-        typography: resolvedTypography
+        typography: resolvedTypography,
+        fontSelections,
+        typographyOverridden,
+        visualEffects: resolvedVisualEffects,
+        componentStyles: resolvedComponentStyles
     };
 }
 function mergeColorModes(base, overrides) {
@@ -141,10 +170,13 @@ function mergeTypography(base, overrides) {
         return base ?? null;
     }
     const result = {
-        fontFamily: base?.fontFamily ?? 'var(--font-geist-sans)',
-        headingFamily: base?.headingFamily ?? 'var(--font-geist-sans)',
-        baseFontSize: base?.baseFontSize ?? '16px',
+        fontFamily: base?.fontFamily ?? 'var(--font-inter, var(--font-geist-sans), system-ui, sans-serif)',
+        headingFamily: base?.headingFamily ?? 'var(--font-outfit, var(--font-geist-sans), system-ui, sans-serif)',
+        baseFontSize: toFontSizeCss(base?.baseFontSize) ?? '16px',
         lineHeight: base?.lineHeight ?? '1.6',
+        headingWeight: base?.headingWeight,
+        headingLetterSpacing: base?.headingLetterSpacing,
+        headingTransform: base?.headingTransform,
         fontWeights: {
             ...base?.fontWeights ?? {}
         },
@@ -161,12 +193,21 @@ function mergeTypography(base, overrides) {
         if (resolvedHeadingFont) {
             result.headingFamily = resolvedHeadingFont;
         }
-        if (overrides.baseFontSize && overrides.baseFontSize !== 'preset') {
-            result.baseFontSize = overrides.baseFontSize;
+        const baseFontSize = toFontSizeCss(overrides.baseFontSize);
+        if (baseFontSize) {
+            result.baseFontSize = baseFontSize;
         }
         if (overrides.lineHeight && overrides.lineHeight !== 'preset') {
             result.lineHeight = overrides.lineHeight;
         }
+        if (overrides.headingWeight && overrides.headingWeight !== 'preset') {
+            result.headingWeight = overrides.headingWeight;
+        }
+        const tracking = overrides.letterSpacing ? LETTER_SPACING_TO_CSS[overrides.letterSpacing] : undefined;
+        if (tracking !== undefined) {
+            result.headingLetterSpacing = tracking;
+            result.headingTransform = overrides.letterSpacing === 'wider' ? 'uppercase' : 'none';
+        }
     }
     return result;
 }
@@ -178,8 +219,7 @@ function resolveFontSelection(selection, custom, fallback) {
         const trimmed = custom?.trim();
         return trimmed && trimmed.length > 0 ? trimmed : fallback ?? null;
     }
-    const mapped = FONT_VALUE_TO_CSS[selection];
-    return mapped ?? fallback ?? null;
+    return getFontCatalogEntry(selection)?.fontFamily ?? fallback ?? null;
 }
 
 //# sourceMappingURL=resolveThemeConfiguration.js.map