@kilivi/payloadcms-theme-management 1.1.2 → 2.1.0

package/dist/utils/themeColors.js

@@ -74,6 +74,18 @@ const COLOR_VARIABLE_MAP = [
     {
         key: 'ring',
         variable: '--ring'
+    },
+    {
+        key: 'gradientFrom',
+        variable: '--gradient-from'
+    },
+    {
+        key: 'gradientVia',
+        variable: '--gradient-via'
+    },
+    {
+        key: 'gradientTo',
+        variable: '--gradient-to'
     }
 ];
 export function hexToHsl(hex) {
@@ -116,7 +128,7 @@ export function generateColorModeCss(colors, options = {}) {
     const cssVariables = COLOR_VARIABLE_MAP.reduce((acc, { key, variable })=>{
         const value = normalizeColor(colors[key]);
         if (!value) return acc;
-        acc.push(`${variable}: hsl(${hexToHsl(value)});`);
+        acc.push(`${variable}: ${normalizeToCssColor(value)};`);
         return acc;
     }, []);
     if (cssVariables.length === 0) return '';
@@ -161,5 +173,22 @@ function normalizeColor(value) {
     const trimmed = value.trim();
     return trimmed.length === 0 ? null : trimmed;
 }
+/**
+ * Convert any color value to a valid CSS color string.
+ * - oklch(...), hsl(...), rgb(...), etc. → pass through as-is
+ * - var(...) CSS variable references → pass through as-is
+ * - Hex (#rgb, #rrggbb) → convert to hsl(H S% L%)
+ */ function normalizeToCssColor(value) {
+    // Already a complete CSS color function — pass through unchanged
+    if (/^(hsl|hsla|rgb|rgba|oklch|oklab|lch|lab|color|hwb)\s*\(/i.test(value)) {
+        return value;
+    }
+    // CSS variable reference — pass through
+    if (/^var\s*\(/i.test(value)) {
+        return value;
+    }
+    // Hex color (#rgb or #rrggbb) — convert to hsl()
+    return `hsl(${hexToHsl(value)})`;
+}
 
 //# sourceMappingURL=themeColors.js.map

package/dist/utils/themeColors.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/utils/themeColors.ts"],"sourcesContent":["interface ColorMode {\n  background?: string | null\n  foreground?: string | null\n  card?: string | null\n  cardForeground?: string | null\n  popover?: string | null\n  popoverForeground?: string | null\n  primary?: string | null\n  primaryForeground?: string | null\n  secondary?: string | null\n  secondaryForeground?: string | null\n  muted?: string | null\n  mutedForeground?: string | null\n  accent?: string | null\n  accentForeground?: string | null\n  destructive?: string | null\n  destructiveForeground?: string | null\n  border?: string | null\n  input?: string | null\n  ring?: string | null\n}\n\nexport interface ThemeColors {\n  lightMode?: ColorMode\n  darkMode?: ColorMode\n}\n\ninterface GenerateThemeColorsOptions extends ThemeColors {\n  themeName?: string\n}\n\nconst COLOR_VARIABLE_MAP: Array<{ key: keyof ColorMode; variable: string }> = [\n  { key: 'background', variable: '--background' },\n  { key: 'foreground', variable: '--foreground' },\n  { key: 'card', variable: '--card' },\n  { key: 'cardForeground', variable: '--card-foreground' },\n  { key: 'popover', variable: '--popover' },\n  { key: 'popoverForeground', variable: '--popover-foreground' },\n  { key: 'primary', variable: '--primary' },\n  { key: 'primaryForeground', variable: '--primary-foreground' },\n  { key: 'secondary', variable: '--secondary' },\n  { key: 'secondaryForeground', variable: '--secondary-foreground' },\n  { key: 'muted', variable: '--muted' },\n  { key: 'mutedForeground', variable: '--muted-foreground' },\n  { key: 'accent', variable: '--accent' },\n  { key: 'accentForeground', variable: '--accent-foreground' },\n  { key: 'destructive', variable: '--destructive' },\n  { key: 'destructiveForeground', variable: '--destructive-foreground' },\n  { key: 'border', variable: '--border' },\n  { key: 'input', variable: '--input' },\n  { key: 'ring', variable: '--ring' },\n]\n\nexport function hexToHsl(hex: string): string {\n  if (!hex) return '0 0% 0%'\n\n  hex = hex.replace('#', '')\n\n  if (hex.length === 3) {\n    hex = hex\n      .split('')\n      .map((char) => char + char)\n      .join('')\n  }\n\n  const r = Number.parseInt(hex.substring(0, 2), 16) / 255\n  const g = Number.parseInt(hex.substring(2, 4), 16) / 255\n  const b = Number.parseInt(hex.substring(4, 6), 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  h = Math.round(h * 360)\n  s = Math.round(s * 100)\n  const lRounded = Math.round(l * 100)\n\n  return `${h} ${s}% ${lRounded}%`\n}\n\nexport function generateColorModeCss(\n  colors: ColorMode,\n  options: { themeName?: string; isDark?: boolean } = {},\n): string {\n  if (!colors) return ''\n\n  const { themeName, isDark = false } = options\n\n  const cssVariables = COLOR_VARIABLE_MAP.reduce<string[]>((acc, { key, variable }) => {\n    const value = normalizeColor(colors[key])\n    if (!value) return acc\n    acc.push(`${variable}: hsl(${hexToHsl(value)});`)\n    return acc\n  }, [])\n\n  if (cssVariables.length === 0) return ''\n\n  const selector = buildSelector(themeName, isDark)\n  return `${selector} {\n  ${cssVariables.join('\\n  ')}\n}`\n}\n\nexport function generateThemeColorsCss(options: GenerateThemeColorsOptions): string {\n  const cssBlocks: string[] = []\n  const { themeName, lightMode, darkMode } = options\n\n  if (lightMode) {\n    const lightModeCss = generateColorModeCss(lightMode, { themeName, isDark: false })\n    if (lightModeCss) cssBlocks.push(lightModeCss)\n  }\n\n  if (darkMode) {\n    const darkModeCss = generateColorModeCss(darkMode, { themeName, isDark: true })\n    if (darkModeCss) cssBlocks.push(darkModeCss)\n  }\n\n  return cssBlocks.join('\\n\\n')\n}\n\nfunction buildSelector(themeName: string | undefined, isDark: boolean): string {\n  if (themeName) {\n    if (isDark) {\n      return `:root[data-theme='${themeName}'][data-theme-mode='dark'], .dark[data-theme='${themeName}']`\n    }\n    return `:root[data-theme='${themeName}']`\n  }\n\n  if (isDark) {\n    return \":root[data-theme-mode='dark'], .dark\"\n  }\n\n  return ':root'\n}\n\nfunction normalizeColor(value: string | null | undefined): string | null {\n  if (typeof value !== 'string') return null\n  const trimmed = value.trim()\n  return trimmed.length === 0 ? null : trimmed\n}\n"],"names":["COLOR_VARIABLE_MAP","key","variable","hexToHsl","hex","replace","length","split","map","char","join","r","Number","parseInt","substring","g","b","max","Math","min","h","s","l","d","round","lRounded","generateColorModeCss","colors","options","themeName","isDark","cssVariables","reduce","acc","value","normalizeColor","push","selector","buildSelector","generateThemeColorsCss","cssBlocks","lightMode","darkMode","lightModeCss","darkModeCss","trimmed","trim"],"mappings":"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"}
+{"version":3,"sources":["../../src/utils/themeColors.ts"],"sourcesContent":["interface ColorMode {\n  background?: string | null\n  foreground?: string | null\n  card?: string | null\n  cardForeground?: string | null\n  popover?: string | null\n  popoverForeground?: string | null\n  primary?: string | null\n  primaryForeground?: string | null\n  secondary?: string | null\n  secondaryForeground?: string | null\n  muted?: string | null\n  mutedForeground?: string | null\n  accent?: string | null\n  accentForeground?: string | null\n  destructive?: string | null\n  destructiveForeground?: string | null\n  border?: string | null\n  input?: string | null\n  ring?: string | null\n  gradientFrom?: string | null\n  gradientVia?: string | null\n  gradientTo?: string | null\n}\n\nexport interface ThemeColors {\n  lightMode?: ColorMode\n  darkMode?: ColorMode\n}\n\ninterface GenerateThemeColorsOptions extends ThemeColors {\n  themeName?: string\n}\n\nconst COLOR_VARIABLE_MAP: Array<{ key: keyof ColorMode; variable: string }> = [\n  { key: 'background', variable: '--background' },\n  { key: 'foreground', variable: '--foreground' },\n  { key: 'card', variable: '--card' },\n  { key: 'cardForeground', variable: '--card-foreground' },\n  { key: 'popover', variable: '--popover' },\n  { key: 'popoverForeground', variable: '--popover-foreground' },\n  { key: 'primary', variable: '--primary' },\n  { key: 'primaryForeground', variable: '--primary-foreground' },\n  { key: 'secondary', variable: '--secondary' },\n  { key: 'secondaryForeground', variable: '--secondary-foreground' },\n  { key: 'muted', variable: '--muted' },\n  { key: 'mutedForeground', variable: '--muted-foreground' },\n  { key: 'accent', variable: '--accent' },\n  { key: 'accentForeground', variable: '--accent-foreground' },\n  { key: 'destructive', variable: '--destructive' },\n  { key: 'destructiveForeground', variable: '--destructive-foreground' },\n  { key: 'border', variable: '--border' },\n  { key: 'input', variable: '--input' },\n  { key: 'ring', variable: '--ring' },\n  { key: 'gradientFrom', variable: '--gradient-from' },\n  { key: 'gradientVia', variable: '--gradient-via' },\n  { key: 'gradientTo', variable: '--gradient-to' },\n]\n\nexport function hexToHsl(hex: string): string {\n  if (!hex) return '0 0% 0%'\n\n  hex = hex.replace('#', '')\n\n  if (hex.length === 3) {\n    hex = hex\n      .split('')\n      .map((char) => char + char)\n      .join('')\n  }\n\n  const r = Number.parseInt(hex.substring(0, 2), 16) / 255\n  const g = Number.parseInt(hex.substring(2, 4), 16) / 255\n  const b = Number.parseInt(hex.substring(4, 6), 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  h = Math.round(h * 360)\n  s = Math.round(s * 100)\n  const lRounded = Math.round(l * 100)\n\n  return `${h} ${s}% ${lRounded}%`\n}\n\nexport function generateColorModeCss(\n  colors: ColorMode,\n  options: { themeName?: string; isDark?: boolean } = {},\n): string {\n  if (!colors) return ''\n\n  const { themeName, isDark = false } = options\n\n  const cssVariables = COLOR_VARIABLE_MAP.reduce<string[]>((acc, { key, variable }) => {\n    const value = normalizeColor(colors[key])\n    if (!value) return acc\n    acc.push(`${variable}: ${normalizeToCssColor(value)};`)\n    return acc\n  }, [])\n\n  if (cssVariables.length === 0) return ''\n\n  const selector = buildSelector(themeName, isDark)\n  return `${selector} {\n  ${cssVariables.join('\\n  ')}\n}`\n}\n\nexport function generateThemeColorsCss(options: GenerateThemeColorsOptions): string {\n  const cssBlocks: string[] = []\n  const { themeName, lightMode, darkMode } = options\n\n  if (lightMode) {\n    const lightModeCss = generateColorModeCss(lightMode, { themeName, isDark: false })\n    if (lightModeCss) cssBlocks.push(lightModeCss)\n  }\n\n  if (darkMode) {\n    const darkModeCss = generateColorModeCss(darkMode, { themeName, isDark: true })\n    if (darkModeCss) cssBlocks.push(darkModeCss)\n  }\n\n  return cssBlocks.join('\\n\\n')\n}\n\nfunction buildSelector(themeName: string | undefined, isDark: boolean): string {\n  if (themeName) {\n    if (isDark) {\n      return `:root[data-theme='${themeName}'][data-theme-mode='dark'], .dark[data-theme='${themeName}']`\n    }\n    return `:root[data-theme='${themeName}']`\n  }\n\n  if (isDark) {\n    return \":root[data-theme-mode='dark'], .dark\"\n  }\n\n  return ':root'\n}\n\nfunction normalizeColor(value: string | null | undefined): string | null {\n  if (typeof value !== 'string') return null\n  const trimmed = value.trim()\n  return trimmed.length === 0 ? null : trimmed\n}\n\n/**\n * Convert any color value to a valid CSS color string.\n * - oklch(...), hsl(...), rgb(...), etc. → pass through as-is\n * - var(...) CSS variable references → pass through as-is\n * - Hex (#rgb, #rrggbb) → convert to hsl(H S% L%)\n */\nfunction normalizeToCssColor(value: string): string {\n  // Already a complete CSS color function — pass through unchanged\n  if (/^(hsl|hsla|rgb|rgba|oklch|oklab|lch|lab|color|hwb)\\s*\\(/i.test(value)) {\n    return value\n  }\n  // CSS variable reference — pass through\n  if (/^var\\s*\\(/i.test(value)) {\n    return value\n  }\n  // Hex color (#rgb or #rrggbb) — convert to hsl()\n  return `hsl(${hexToHsl(value)})`\n}\n"],"names":["COLOR_VARIABLE_MAP","key","variable","hexToHsl","hex","replace","length","split","map","char","join","r","Number","parseInt","substring","g","b","max","Math","min","h","s","l","d","round","lRounded","generateColorModeCss","colors","options","themeName","isDark","cssVariables","reduce","acc","value","normalizeColor","push","normalizeToCssColor","selector","buildSelector","generateThemeColorsCss","cssBlocks","lightMode","darkMode","lightModeCss","darkModeCss","trimmed","trim","test"],"mappings":"AAkCA,MAAMA,qBAAwE;IAC5E;QAAEC,KAAK;QAAcC,UAAU;IAAe;IAC9C;QAAED,KAAK;QAAcC,UAAU;IAAe;IAC9C;QAAED,KAAK;QAAQC,UAAU;IAAS;IAClC;QAAED,KAAK;QAAkBC,UAAU;IAAoB;IACvD;QAAED,KAAK;QAAWC,UAAU;IAAY;IACxC;QAAED,KAAK;QAAqBC,UAAU;IAAuB;IAC7D;QAAED,KAAK;QAAWC,UAAU;IAAY;IACxC;QAAED,KAAK;QAAqBC,UAAU;IAAuB;IAC7D;QAAED,KAAK;QAAaC,UAAU;IAAc;IAC5C;QAAED,KAAK;QAAuBC,UAAU;IAAyB;IACjE;QAAED,KAAK;QAASC,UAAU;IAAU;IACpC;QAAED,KAAK;QAAmBC,UAAU;IAAqB;IACzD;QAAED,KAAK;QAAUC,UAAU;IAAW;IACtC;QAAED,KAAK;QAAoBC,UAAU;IAAsB;IAC3D;QAAED,KAAK;QAAeC,UAAU;IAAgB;IAChD;QAAED,KAAK;QAAyBC,UAAU;IAA2B;IACrE;QAAED,KAAK;QAAUC,UAAU;IAAW;IACtC;QAAED,KAAK;QAASC,UAAU;IAAU;IACpC;QAAED,KAAK;QAAQC,UAAU;IAAS;IAClC;QAAED,KAAK;QAAgBC,UAAU;IAAkB;IACnD;QAAED,KAAK;QAAeC,UAAU;IAAiB;IACjD;QAAED,KAAK;QAAcC,UAAU;IAAgB;CAChD;AAED,OAAO,SAASC,SAASC,GAAW;IAClC,IAAI,CAACA,KAAK,OAAO;IAEjBA,MAAMA,IAAIC,OAAO,CAAC,KAAK;IAEvB,IAAID,IAAIE,MAAM,KAAK,GAAG;QACpBF,MAAMA,IACHG,KAAK,CAAC,IACNC,GAAG,CAAC,CAACC,OAASA,OAAOA,MACrBC,IAAI,CAAC;IACV;IAEA,MAAMC,IAAIC,OAAOC,QAAQ,CAACT,IAAIU,SAAS,CAAC,GAAG,IAAI,MAAM;IACrD,MAAMC,IAAIH,OAAOC,QAAQ,CAACT,IAAIU,SAAS,CAAC,GAAG,IAAI,MAAM;IACrD,MAAME,IAAIJ,OAAOC,QAAQ,CAACT,IAAIU,SAAS,CAAC,GAAG,IAAI,MAAM;IAErD,MAAMG,MAAMC,KAAKD,GAAG,CAACN,GAAGI,GAAGC;IAC3B,MAAMG,MAAMD,KAAKC,GAAG,CAACR,GAAGI,GAAGC;IAC3B,IAAII,IAAI;IACR,IAAIC,IAAI;IACR,MAAMC,IAAI,AAACL,CAAAA,MAAME,GAAE,IAAK;IAExB,IAAIF,QAAQE,KAAK;QACf,MAAMI,IAAIN,MAAME;QAChBE,IAAIC,IAAI,MAAMC,IAAK,CAAA,IAAIN,MAAME,GAAE,IAAKI,IAAKN,CAAAA,MAAME,GAAE;QAEjD,OAAQF;YACN,KAAKN;gBACHS,IAAI,AAAC,CAAA,AAACL,CAAAA,IAAIC,CAAAA,IAAKO,IAAKR,CAAAA,IAAIC,IAAI,IAAI,CAAA,CAAC,IAAK;gBACtC;YACF,KAAKD;gBACHK,IAAI,AAAC,CAAA,AAACJ,CAAAA,IAAIL,CAAAA,IAAKY,IAAI,CAAA,IAAK;gBACxB;YACF,KAAKP;gBACHI,IAAI,AAAC,CAAA,AAACT,CAAAA,IAAII,CAAAA,IAAKQ,IAAI,CAAA,IAAK;gBACxB;QACJ;IACF;IAEAH,IAAIF,KAAKM,KAAK,CAACJ,IAAI;IACnBC,IAAIH,KAAKM,KAAK,CAACH,IAAI;IACnB,MAAMI,WAAWP,KAAKM,KAAK,CAACF,IAAI;IAEhC,OAAO,GAAGF,EAAE,CAAC,EAAEC,EAAE,EAAE,EAAEI,SAAS,CAAC,CAAC;AAClC;AAEA,OAAO,SAASC,qBACdC,MAAiB,EACjBC,UAAoD,CAAC,CAAC;IAEtD,IAAI,CAACD,QAAQ,OAAO;IAEpB,MAAM,EAAEE,SAAS,EAAEC,SAAS,KAAK,EAAE,GAAGF;IAEtC,MAAMG,eAAe/B,mBAAmBgC,MAAM,CAAW,CAACC,KAAK,EAAEhC,GAAG,EAAEC,QAAQ,EAAE;QAC9E,MAAMgC,QAAQC,eAAeR,MAAM,CAAC1B,IAAI;QACxC,IAAI,CAACiC,OAAO,OAAOD;QACnBA,IAAIG,IAAI,CAAC,GAAGlC,SAAS,EAAE,EAAEmC,oBAAoBH,OAAO,CAAC,CAAC;QACtD,OAAOD;IACT,GAAG,EAAE;IAEL,IAAIF,aAAazB,MAAM,KAAK,GAAG,OAAO;IAEtC,MAAMgC,WAAWC,cAAcV,WAAWC;IAC1C,OAAO,GAAGQ,SAAS;EACnB,EAAEP,aAAarB,IAAI,CAAC,QAAQ;CAC7B,CAAC;AACF;AAEA,OAAO,SAAS8B,uBAAuBZ,OAAmC;IACxE,MAAMa,YAAsB,EAAE;IAC9B,MAAM,EAAEZ,SAAS,EAAEa,SAAS,EAAEC,QAAQ,EAAE,GAAGf;IAE3C,IAAIc,WAAW;QACb,MAAME,eAAelB,qBAAqBgB,WAAW;YAAEb;YAAWC,QAAQ;QAAM;QAChF,IAAIc,cAAcH,UAAUL,IAAI,CAACQ;IACnC;IAEA,IAAID,UAAU;QACZ,MAAME,cAAcnB,qBAAqBiB,UAAU;YAAEd;YAAWC,QAAQ;QAAK;QAC7E,IAAIe,aAAaJ,UAAUL,IAAI,CAACS;IAClC;IAEA,OAAOJ,UAAU/B,IAAI,CAAC;AACxB;AAEA,SAAS6B,cAAcV,SAA6B,EAAEC,MAAe;IACnE,IAAID,WAAW;QACb,IAAIC,QAAQ;YACV,OAAO,CAAC,kBAAkB,EAAED,UAAU,8CAA8C,EAAEA,UAAU,EAAE,CAAC;QACrG;QACA,OAAO,CAAC,kBAAkB,EAAEA,UAAU,EAAE,CAAC;IAC3C;IAEA,IAAIC,QAAQ;QACV,OAAO;IACT;IAEA,OAAO;AACT;AAEA,SAASK,eAAeD,KAAgC;IACtD,IAAI,OAAOA,UAAU,UAAU,OAAO;IACtC,MAAMY,UAAUZ,MAAMa,IAAI;IAC1B,OAAOD,QAAQxC,MAAM,KAAK,IAAI,OAAOwC;AACvC;AAEA;;;;;CAKC,GACD,SAAST,oBAAoBH,KAAa;IACxC,iEAAiE;IACjE,IAAI,2DAA2Dc,IAAI,CAACd,QAAQ;QAC1E,OAAOA;IACT;IACA,wCAAwC;IACxC,IAAI,aAAac,IAAI,CAACd,QAAQ;QAC5B,OAAOA;IACT;IACA,iDAAiD;IACjD,OAAO,CAAC,IAAI,EAAE/B,SAAS+B,OAAO,CAAC,CAAC;AAClC"}

package/dist/utils/themeHtmlAttributes.d.ts

@@ -1,7 +1,35 @@
 import type { ResolvedThemeConfiguration } from './resolveThemeConfiguration.js';
 /**
- * Generates HTML attributes for the <html> element based on theme configuration
- * This ensures the theme is applied before React hydration to prevent FOUC
+ * Stable base attributes that are always present on the <html> element.
+ */
+interface BaseThemeHtmlAttributes {
+    'data-theme': string;
+    'data-theme-mode': string;
+    'data-border-radius': string;
+    'data-font-scale': string;
+    'data-spacing': string;
+    'data-animation-level': string;
+    'data-allow-color-mode-toggle': string;
+    suppressHydrationWarning: true;
+}
+/**
+ * Full attribute map: base attributes plus any visual-effect / component-style
+ * attributes that were configured. Optional keys are only present when the
+ * corresponding value is set, so callers can spread the whole object onto
+ * `<html>` without emitting empty attributes.
+ */
+export type ThemeHtmlAttributes = BaseThemeHtmlAttributes & Record<string, string | true>;
+/**
+ * Generates HTML attributes for the <html> element based on theme configuration.
+ *
+ * This ensures the theme is applied before React hydration to prevent FOUC.
+ * Crucially, it also emits the `data-effect-style`, `data-card-style`,
+ * `data-button-variant`, `data-navbar-style`, `data-card-hover`,
+ * `data-border-*`, `data-button-size`, `data-footer-style`, `data-image-style`
+ * and `data-link-style` attributes that the CSS produced by `generateThemeCSS`
+ * targets. Without them, the visual-effect and component-style rules only
+ * activate after client hydration (the `ThemeProvider` syncs them from CSS
+ * variables), causing a flash of unstyled content on server-rendered pages.
  *
  * @example
  * ```tsx
@@ -12,14 +40,6 @@ import type { ResolvedThemeConfiguration } from './resolveThemeConfiguration.js'
  * <html {...htmlAttrs} className={yourClassName}>
  * ```
  */
-export declare function getThemeHtmlAttributes(config: ResolvedThemeConfiguration): {
-    'data-theme': string;
-    'data-theme-mode': string;
-    'data-border-radius': string;
-    'data-font-scale': string;
-    'data-spacing': string;
-    'data-animation-level': string;
-    'data-allow-color-mode-toggle': string;
-    suppressHydrationWarning: true;
-};
+export declare function getThemeHtmlAttributes(config: ResolvedThemeConfiguration): ThemeHtmlAttributes;
+export {};
 //# sourceMappingURL=themeHtmlAttributes.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"themeHtmlAttributes.d.ts","sourceRoot":"","sources":["../../src/utils/themeHtmlAttributes.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,gCAAgC,CAAA;AAEhF;;;;;;;;;;;;GAYG;AACH,wBAAgB,sBAAsB,CAAC,MAAM,EAAE,0BAA0B,GAAG;IAC1E,YAAY,EAAE,MAAM,CAAA;IACpB,iBAAiB,EAAE,MAAM,CAAA;IACzB,oBAAoB,EAAE,MAAM,CAAA;IAC5B,iBAAiB,EAAE,MAAM,CAAA;IACzB,cAAc,EAAE,MAAM,CAAA;IACtB,sBAAsB,EAAE,MAAM,CAAA;IAC9B,8BAA8B,EAAE,MAAM,CAAA;IACtC,wBAAwB,EAAE,IAAI,CAAA;CAC/B,CAWA"}
+{"version":3,"file":"themeHtmlAttributes.d.ts","sourceRoot":"","sources":["../../src/utils/themeHtmlAttributes.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,gCAAgC,CAAA;AAEhF;;GAEG;AACH,UAAU,uBAAuB;IAC/B,YAAY,EAAE,MAAM,CAAA;IACpB,iBAAiB,EAAE,MAAM,CAAA;IACzB,oBAAoB,EAAE,MAAM,CAAA;IAC5B,iBAAiB,EAAE,MAAM,CAAA;IACzB,cAAc,EAAE,MAAM,CAAA;IACtB,sBAAsB,EAAE,MAAM,CAAA;IAC9B,8BAA8B,EAAE,MAAM,CAAA;IACtC,wBAAwB,EAAE,IAAI,CAAA;CAC/B;AAED;;;;;GAKG;AACH,MAAM,MAAM,mBAAmB,GAAG,uBAAuB,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC,CAAA;AAKzF;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,sBAAsB,CAAC,MAAM,EAAE,0BAA0B,GAAG,mBAAmB,CAuC9F"}

package/dist/utils/themeHtmlAttributes.js

@@ -1,17 +1,26 @@
+const isNonEmptyString = (value)=>typeof value === 'string' && value.trim().length > 0;
 /**
- * Generates HTML attributes for the <html> element based on theme configuration
- * This ensures the theme is applied before React hydration to prevent FOUC
- * 
+ * Generates HTML attributes for the <html> element based on theme configuration.
+ *
+ * This ensures the theme is applied before React hydration to prevent FOUC.
+ * Crucially, it also emits the `data-effect-style`, `data-card-style`,
+ * `data-button-variant`, `data-navbar-style`, `data-card-hover`,
+ * `data-border-*`, `data-button-size`, `data-footer-style`, `data-image-style`
+ * and `data-link-style` attributes that the CSS produced by `generateThemeCSS`
+ * targets. Without them, the visual-effect and component-style rules only
+ * activate after client hydration (the `ThemeProvider` syncs them from CSS
+ * variables), causing a flash of unstyled content on server-rendered pages.
+ *
  * @example
  * ```tsx
  * const siteSettings = await payload.findGlobal({ slug: 'site-settings' })
  * const themeConfig = resolveThemeConfiguration(siteSettings?.themeConfiguration)
  * const htmlAttrs = getThemeHtmlAttributes(themeConfig)
- * 
+ *
  * <html {...htmlAttrs} className={yourClassName}>
  * ```
  */ export function getThemeHtmlAttributes(config) {
-    return {
+    const attributes = {
         'data-theme': config.theme,
         'data-theme-mode': config.colorMode,
         'data-border-radius': config.borderRadius,
@@ -21,6 +30,30 @@
         'data-allow-color-mode-toggle': config.allowColorModeToggle ? 'true' : 'false',
         suppressHydrationWarning: true
     };
+    const ve = config.visualEffects;
+    if (ve) {
+        if (isNonEmptyString(ve.effectStyle)) attributes['data-effect-style'] = ve.effectStyle;
+        if (isNonEmptyString(ve.shadowIntensity)) attributes['data-shadow-intensity'] = ve.shadowIntensity;
+        if (isNonEmptyString(ve.backdropBlur)) attributes['data-backdrop-blur'] = ve.backdropBlur;
+        if (isNonEmptyString(ve.borderStyle)) attributes['data-border-style'] = ve.borderStyle;
+        if (isNonEmptyString(ve.borderWidth)) attributes['data-border-width'] = ve.borderWidth;
+    }
+    const cs = config.componentStyles;
+    if (cs) {
+        if (isNonEmptyString(cs.buttonVariant)) attributes['data-button-variant'] = cs.buttonVariant;
+        if (isNonEmptyString(cs.buttonSize)) attributes['data-button-size'] = cs.buttonSize;
+        if (isNonEmptyString(cs.cardStyle)) attributes['data-card-style'] = cs.cardStyle;
+        if (isNonEmptyString(cs.cardHoverEffect)) attributes['data-card-hover'] = cs.cardHoverEffect;
+        if (isNonEmptyString(cs.imageStyle)) attributes['data-image-style'] = cs.imageStyle;
+        if (isNonEmptyString(cs.navbarStyle)) attributes['data-navbar-style'] = cs.navbarStyle;
+        if (isNonEmptyString(cs.footerStyle)) attributes['data-footer-style'] = cs.footerStyle;
+        if (isNonEmptyString(cs.linkStyle)) attributes['data-link-style'] = cs.linkStyle;
+        // Booleans: only emit the attribute when explicitly disabled (defaults are "on"),
+        // keeping the DOM clean while still letting CSS / consumer JS react to opt-outs.
+        if (cs.enableHoverAnimations === false) attributes['data-hover-animations'] = 'off';
+        if (cs.enableScrollReveal === false) attributes['data-scroll-reveal'] = 'off';
+    }
+    return attributes;
 }
 
 //# sourceMappingURL=themeHtmlAttributes.js.map

package/dist/utils/themeHtmlAttributes.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/utils/themeHtmlAttributes.ts"],"sourcesContent":["import type { ResolvedThemeConfiguration } from './resolveThemeConfiguration.js'\n\n/**\n * Generates HTML attributes for the <html> element based on theme configuration\n * This ensures the theme is applied before React hydration to prevent FOUC\n * \n * @example\n * ```tsx\n * const siteSettings = await payload.findGlobal({ slug: 'site-settings' })\n * const themeConfig = resolveThemeConfiguration(siteSettings?.themeConfiguration)\n * const htmlAttrs = getThemeHtmlAttributes(themeConfig)\n * \n * <html {...htmlAttrs} className={yourClassName}>\n * ```\n */\nexport function getThemeHtmlAttributes(config: ResolvedThemeConfiguration): {\n  'data-theme': string\n  'data-theme-mode': string\n  'data-border-radius': string\n  'data-font-scale': string\n  'data-spacing': string\n  'data-animation-level': string\n  'data-allow-color-mode-toggle': string\n  suppressHydrationWarning: true\n} {\n  return {\n    'data-theme': config.theme,\n    'data-theme-mode': config.colorMode,\n    'data-border-radius': config.borderRadius,\n    'data-font-scale': config.fontScale,\n    'data-spacing': config.spacing,\n    'data-animation-level': config.animationLevel,\n    'data-allow-color-mode-toggle': config.allowColorModeToggle ? 'true' : 'false',\n    suppressHydrationWarning: true,\n  }\n}\n"],"names":["getThemeHtmlAttributes","config","theme","colorMode","borderRadius","fontScale","spacing","animationLevel","allowColorModeToggle","suppressHydrationWarning"],"mappings":"AAEA;;;;;;;;;;;;CAYC,GACD,OAAO,SAASA,uBAAuBC,MAAkC;IAUvE,OAAO;QACL,cAAcA,OAAOC,KAAK;QAC1B,mBAAmBD,OAAOE,SAAS;QACnC,sBAAsBF,OAAOG,YAAY;QACzC,mBAAmBH,OAAOI,SAAS;QACnC,gBAAgBJ,OAAOK,OAAO;QAC9B,wBAAwBL,OAAOM,cAAc;QAC7C,gCAAgCN,OAAOO,oBAAoB,GAAG,SAAS;QACvEC,0BAA0B;IAC5B;AACF"}
+{"version":3,"sources":["../../src/utils/themeHtmlAttributes.ts"],"sourcesContent":["import type { ResolvedThemeConfiguration } from './resolveThemeConfiguration.js'\n\n/**\n * Stable base attributes that are always present on the <html> element.\n */\ninterface BaseThemeHtmlAttributes {\n  'data-theme': string\n  'data-theme-mode': string\n  'data-border-radius': string\n  'data-font-scale': string\n  'data-spacing': string\n  'data-animation-level': string\n  'data-allow-color-mode-toggle': string\n  suppressHydrationWarning: true\n}\n\n/**\n * Full attribute map: base attributes plus any visual-effect / component-style\n * attributes that were configured. Optional keys are only present when the\n * corresponding value is set, so callers can spread the whole object onto\n * `<html>` without emitting empty attributes.\n */\nexport type ThemeHtmlAttributes = BaseThemeHtmlAttributes & Record<string, string | true>\n\nconst isNonEmptyString = (value: unknown): value is string =>\n  typeof value === 'string' && value.trim().length > 0\n\n/**\n * Generates HTML attributes for the <html> element based on theme configuration.\n *\n * This ensures the theme is applied before React hydration to prevent FOUC.\n * Crucially, it also emits the `data-effect-style`, `data-card-style`,\n * `data-button-variant`, `data-navbar-style`, `data-card-hover`,\n * `data-border-*`, `data-button-size`, `data-footer-style`, `data-image-style`\n * and `data-link-style` attributes that the CSS produced by `generateThemeCSS`\n * targets. Without them, the visual-effect and component-style rules only\n * activate after client hydration (the `ThemeProvider` syncs them from CSS\n * variables), causing a flash of unstyled content on server-rendered pages.\n *\n * @example\n * ```tsx\n * const siteSettings = await payload.findGlobal({ slug: 'site-settings' })\n * const themeConfig = resolveThemeConfiguration(siteSettings?.themeConfiguration)\n * const htmlAttrs = getThemeHtmlAttributes(themeConfig)\n *\n * <html {...htmlAttrs} className={yourClassName}>\n * ```\n */\nexport function getThemeHtmlAttributes(config: ResolvedThemeConfiguration): ThemeHtmlAttributes {\n  const attributes: ThemeHtmlAttributes = {\n    'data-theme': config.theme,\n    'data-theme-mode': config.colorMode,\n    'data-border-radius': config.borderRadius,\n    'data-font-scale': config.fontScale,\n    'data-spacing': config.spacing,\n    'data-animation-level': config.animationLevel,\n    'data-allow-color-mode-toggle': config.allowColorModeToggle ? 'true' : 'false',\n    suppressHydrationWarning: true,\n  }\n\n  const ve = config.visualEffects\n  if (ve) {\n    if (isNonEmptyString(ve.effectStyle)) attributes['data-effect-style'] = ve.effectStyle\n    if (isNonEmptyString(ve.shadowIntensity))\n      attributes['data-shadow-intensity'] = ve.shadowIntensity\n    if (isNonEmptyString(ve.backdropBlur)) attributes['data-backdrop-blur'] = ve.backdropBlur\n    if (isNonEmptyString(ve.borderStyle)) attributes['data-border-style'] = ve.borderStyle\n    if (isNonEmptyString(ve.borderWidth)) attributes['data-border-width'] = ve.borderWidth\n  }\n\n  const cs = config.componentStyles\n  if (cs) {\n    if (isNonEmptyString(cs.buttonVariant)) attributes['data-button-variant'] = cs.buttonVariant\n    if (isNonEmptyString(cs.buttonSize)) attributes['data-button-size'] = cs.buttonSize\n    if (isNonEmptyString(cs.cardStyle)) attributes['data-card-style'] = cs.cardStyle\n    if (isNonEmptyString(cs.cardHoverEffect)) attributes['data-card-hover'] = cs.cardHoverEffect\n    if (isNonEmptyString(cs.imageStyle)) attributes['data-image-style'] = cs.imageStyle\n    if (isNonEmptyString(cs.navbarStyle)) attributes['data-navbar-style'] = cs.navbarStyle\n    if (isNonEmptyString(cs.footerStyle)) attributes['data-footer-style'] = cs.footerStyle\n    if (isNonEmptyString(cs.linkStyle)) attributes['data-link-style'] = cs.linkStyle\n    // Booleans: only emit the attribute when explicitly disabled (defaults are \"on\"),\n    // keeping the DOM clean while still letting CSS / consumer JS react to opt-outs.\n    if (cs.enableHoverAnimations === false) attributes['data-hover-animations'] = 'off'\n    if (cs.enableScrollReveal === false) attributes['data-scroll-reveal'] = 'off'\n  }\n\n  return attributes\n}\n"],"names":["isNonEmptyString","value","trim","length","getThemeHtmlAttributes","config","attributes","theme","colorMode","borderRadius","fontScale","spacing","animationLevel","allowColorModeToggle","suppressHydrationWarning","ve","visualEffects","effectStyle","shadowIntensity","backdropBlur","borderStyle","borderWidth","cs","componentStyles","buttonVariant","buttonSize","cardStyle","cardHoverEffect","imageStyle","navbarStyle","footerStyle","linkStyle","enableHoverAnimations","enableScrollReveal"],"mappings":"AAwBA,MAAMA,mBAAmB,CAACC,QACxB,OAAOA,UAAU,YAAYA,MAAMC,IAAI,GAAGC,MAAM,GAAG;AAErD;;;;;;;;;;;;;;;;;;;;CAoBC,GACD,OAAO,SAASC,uBAAuBC,MAAkC;IACvE,MAAMC,aAAkC;QACtC,cAAcD,OAAOE,KAAK;QAC1B,mBAAmBF,OAAOG,SAAS;QACnC,sBAAsBH,OAAOI,YAAY;QACzC,mBAAmBJ,OAAOK,SAAS;QACnC,gBAAgBL,OAAOM,OAAO;QAC9B,wBAAwBN,OAAOO,cAAc;QAC7C,gCAAgCP,OAAOQ,oBAAoB,GAAG,SAAS;QACvEC,0BAA0B;IAC5B;IAEA,MAAMC,KAAKV,OAAOW,aAAa;IAC/B,IAAID,IAAI;QACN,IAAIf,iBAAiBe,GAAGE,WAAW,GAAGX,UAAU,CAAC,oBAAoB,GAAGS,GAAGE,WAAW;QACtF,IAAIjB,iBAAiBe,GAAGG,eAAe,GACrCZ,UAAU,CAAC,wBAAwB,GAAGS,GAAGG,eAAe;QAC1D,IAAIlB,iBAAiBe,GAAGI,YAAY,GAAGb,UAAU,CAAC,qBAAqB,GAAGS,GAAGI,YAAY;QACzF,IAAInB,iBAAiBe,GAAGK,WAAW,GAAGd,UAAU,CAAC,oBAAoB,GAAGS,GAAGK,WAAW;QACtF,IAAIpB,iBAAiBe,GAAGM,WAAW,GAAGf,UAAU,CAAC,oBAAoB,GAAGS,GAAGM,WAAW;IACxF;IAEA,MAAMC,KAAKjB,OAAOkB,eAAe;IACjC,IAAID,IAAI;QACN,IAAItB,iBAAiBsB,GAAGE,aAAa,GAAGlB,UAAU,CAAC,sBAAsB,GAAGgB,GAAGE,aAAa;QAC5F,IAAIxB,iBAAiBsB,GAAGG,UAAU,GAAGnB,UAAU,CAAC,mBAAmB,GAAGgB,GAAGG,UAAU;QACnF,IAAIzB,iBAAiBsB,GAAGI,SAAS,GAAGpB,UAAU,CAAC,kBAAkB,GAAGgB,GAAGI,SAAS;QAChF,IAAI1B,iBAAiBsB,GAAGK,eAAe,GAAGrB,UAAU,CAAC,kBAAkB,GAAGgB,GAAGK,eAAe;QAC5F,IAAI3B,iBAAiBsB,GAAGM,UAAU,GAAGtB,UAAU,CAAC,mBAAmB,GAAGgB,GAAGM,UAAU;QACnF,IAAI5B,iBAAiBsB,GAAGO,WAAW,GAAGvB,UAAU,CAAC,oBAAoB,GAAGgB,GAAGO,WAAW;QACtF,IAAI7B,iBAAiBsB,GAAGQ,WAAW,GAAGxB,UAAU,CAAC,oBAAoB,GAAGgB,GAAGQ,WAAW;QACtF,IAAI9B,iBAAiBsB,GAAGS,SAAS,GAAGzB,UAAU,CAAC,kBAAkB,GAAGgB,GAAGS,SAAS;QAChF,kFAAkF;QAClF,iFAAiF;QACjF,IAAIT,GAAGU,qBAAqB,KAAK,OAAO1B,UAAU,CAAC,wBAAwB,GAAG;QAC9E,IAAIgB,GAAGW,kBAAkB,KAAK,OAAO3B,UAAU,CAAC,qBAAqB,GAAG;IAC1E;IAEA,OAAOA;AACT"}

package/dist/utils/themeUtils.d.ts

@@ -1,9 +1,7 @@
-import type { SiteSetting } from '../payload-types.js';
-import type { ThemeTypographyPreset } from '../presets.js';
-type ThemeTypographyConfiguration = {
-    typography?: ThemeTypographyPreset | null;
+import type { ResolvedThemeConfiguration } from './resolveThemeConfiguration.js';
+type ThemeConfiguration = Omit<ResolvedThemeConfiguration, 'typography'> & {
+    typography?: ResolvedThemeConfiguration['typography'];
 };
-type ThemeConfiguration = Omit<NonNullable<SiteSetting['themeConfiguration']>, 'typography'> & ThemeTypographyConfiguration;
 /**
  * Generates CSS custom properties from theme configuration
  */

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

@@ -1 +1 @@
-{"version":3,"file":"themeUtils.d.ts","sourceRoot":"","sources":["../../src/utils/themeUtils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAA;AAEtD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAA;AAE1D,KAAK,4BAA4B,GAAG;IAClC,UAAU,CAAC,EAAE,qBAAqB,GAAG,IAAI,CAAA;CAC1C,CAAA;AAED,KAAK,kBAAkB,GAAG,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,oBAAoB,CAAC,CAAC,EAAE,YAAY,CAAC,GAC1F,4BAA4B,CAAA;AAa9B;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,kBAAkB,GAAG,MAAM,CA0BnE;AAiBD;;GAEG;AACH,wBAAgB,cAAc,CAAC,MAAM,EAAE,kBAAkB,0BAQxD"}
+{"version":3,"file":"themeUtils.d.ts","sourceRoot":"","sources":["../../src/utils/themeUtils.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,gCAAgC,CAAA;AAEhF,KAAK,kBAAkB,GAAG,IAAI,CAAC,0BAA0B,EAAE,YAAY,CAAC,GAAG;IACzE,UAAU,CAAC,EAAE,0BAA0B,CAAC,YAAY,CAAC,CAAA;CACtD,CAAA;AAaD;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,kBAAkB,GAAG,MAAM,CA8BnE;AAiBD;;GAEG;AACH,wBAAgB,cAAc,CAAC,MAAM,EAAE,kBAAkB,0BAQxD"}