@kilivi/payloadcms-theme-management 0.1.6 → 0.1.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/ServerThemeInjector.d.ts +1 -1
- package/dist/components/ServerThemeInjector.d.ts.map +1 -1
- package/dist/components/{ServerThemeInjector.jsx → ServerThemeInjector.js} +47 -34
- package/dist/components/ServerThemeInjector.js.map +1 -0
- package/dist/components/ThemePreview.js +318 -0
- package/dist/components/ThemePreview.js.map +1 -0
- package/dist/components/typographyPreviewUtils.js +12 -17
- package/dist/components/typographyPreviewUtils.js.map +1 -1
- package/dist/constants/themeFonts.js +94 -24
- package/dist/constants/themeFonts.js.map +1 -1
- package/dist/fields/ColorPickerField.js +332 -0
- package/dist/fields/ColorPickerField.js.map +1 -0
- package/dist/fields/RadiusField.js +174 -0
- package/dist/fields/RadiusField.js.map +1 -0
- package/dist/fields/ThemeColorPickerField.js +163 -0
- package/dist/fields/ThemeColorPickerField.js.map +1 -0
- package/dist/fields/ThemePreviewField.js +558 -0
- package/dist/fields/ThemePreviewField.js.map +1 -0
- package/dist/fields/ThemeTokenSelectField.js +209 -0
- package/dist/fields/ThemeTokenSelectField.js.map +1 -0
- package/dist/fields/colorModeFields.js +167 -73
- package/dist/fields/colorModeFields.js.map +1 -1
- package/dist/fields/themeConfigurationField.d.ts +1 -1
- package/dist/fields/themeConfigurationField.d.ts.map +1 -1
- package/dist/fields/themeConfigurationField.js +224 -131
- package/dist/fields/themeConfigurationField.js.map +1 -1
- package/dist/index.d.ts +17 -16
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +52 -52
- package/dist/index.js.map +1 -1
- package/dist/payload-types.js +2 -2
- package/dist/payload-types.js.map +1 -1
- package/dist/plugin.d.ts +1 -2
- package/dist/plugin.d.ts.map +1 -1
- package/dist/plugin.js +2 -1
- package/dist/plugin.js.map +1 -1
- package/dist/presets.js +66 -65
- package/dist/presets.js.map +1 -1
- package/dist/providers/Theme/index.d.ts +1 -1
- package/dist/providers/Theme/index.d.ts.map +1 -1
- package/dist/providers/Theme/{index.jsx → index.js} +61 -31
- package/dist/providers/Theme/index.js.map +1 -0
- package/dist/providers/Theme/shared.d.ts +1 -1
- package/dist/providers/Theme/shared.d.ts.map +1 -1
- package/dist/providers/Theme/shared.js +34 -9
- package/dist/providers/Theme/shared.js.map +1 -1
- package/dist/providers/Theme/themeConfig.d.ts +1 -1
- package/dist/providers/Theme/themeConfig.d.ts.map +1 -1
- package/dist/providers/Theme/themeConfig.js +37 -36
- package/dist/providers/Theme/themeConfig.js.map +1 -1
- package/dist/providers/Theme/types.js +15 -13
- package/dist/providers/Theme/types.js.map +1 -1
- package/dist/server.d.ts +2 -2
- package/dist/server.d.ts.map +1 -1
- package/dist/server.js +3 -2
- package/dist/server.js.map +1 -1
- package/dist/types.d.ts +2 -2
- package/dist/types.d.ts.map +1 -1
- package/dist/types.js +2 -1
- package/dist/types.js.map +1 -1
- package/dist/utils/resolveThemeConfiguration.d.ts +3 -3
- package/dist/utils/resolveThemeConfiguration.d.ts.map +1 -1
- package/dist/utils/resolveThemeConfiguration.js +53 -34
- package/dist/utils/resolveThemeConfiguration.js.map +1 -1
- package/dist/utils/themeAssets.d.ts +1 -1
- package/dist/utils/themeAssets.d.ts.map +1 -1
- package/dist/utils/themeAssets.js +4 -4
- package/dist/utils/themeAssets.js.map +1 -1
- package/dist/utils/themeColors.js +95 -41
- package/dist/utils/themeColors.js.map +1 -1
- package/dist/utils/themeUtils.d.ts +2 -2
- package/dist/utils/themeUtils.d.ts.map +1 -1
- package/dist/utils/themeUtils.js +32 -47
- package/dist/utils/themeUtils.js.map +1 -1
- package/package.json +13 -5
- package/dist/components/ServerThemeInjector.jsx.map +0 -1
- package/dist/components/ThemePreview.jsx +0 -231
- package/dist/components/ThemePreview.jsx.map +0 -1
- package/dist/fields/ColorPickerField.jsx +0 -205
- package/dist/fields/ColorPickerField.jsx.map +0 -1
- package/dist/fields/RadiusField.jsx +0 -123
- package/dist/fields/RadiusField.jsx.map +0 -1
- package/dist/fields/ThemeColorPickerField.jsx +0 -110
- package/dist/fields/ThemeColorPickerField.jsx.map +0 -1
- package/dist/fields/ThemePreviewField.jsx +0 -420
- package/dist/fields/ThemePreviewField.jsx.map +0 -1
- package/dist/fields/ThemeTokenSelectField.jsx +0 -151
- package/dist/fields/ThemeTokenSelectField.jsx.map +0 -1
- package/dist/providers/Theme/index.jsx.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"resolveThemeConfiguration.js","sourceRoot":"","sources":["../../src/utils/resolveThemeConfiguration.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../src/utils/resolveThemeConfiguration.ts"],"sourcesContent":["import { FONT_VALUE_TO_CSS } from '../constants/themeFonts.js'\nimport type { SiteSetting } from '../payload-types.js'\nimport type { Mode, ThemeDefaults } from '../providers/Theme/types.js'\nimport { themeIsValid } from '../providers/Theme/types.js'\nimport type { ThemeTypographyPreset } from '../presets.js'\nimport { defaultThemePresets } from '../presets.js'\n\ninterface ThemeTypographyOverride {\n bodyFont?: string | null\n headingFont?: string | null\n bodyFontCustom?: string | null\n headingFontCustom?: string | null\n baseFontSize?: string | null\n lineHeight?: string | null\n}\n\ntype SiteThemeConfiguration = SiteSetting['themeConfiguration'] & {\n typography?: ThemeTypographyOverride | null\n}\n\nconst BORDER_RADIUS_VALUES = ['none', 'small', 'medium', 'large', 'xl'] as const\nconst LEGACY_BORDER_RADIUS_ALIASES: Record<string, (typeof BORDER_RADIUS_VALUES)[number]> = {\n full: 'xl',\n}\nconst FONT_SCALE_VALUES = ['small', 'medium', 'large'] as const\nconst SPACING_VALUES = ['compact', 'medium', 'spacious'] as const\nconst ANIMATION_LEVEL_VALUES = ['none', 'reduced', 'medium', 'high'] as const\nconst LEGACY_ANIMATION_ALIASES: Record<string, (typeof ANIMATION_LEVEL_VALUES)[number]> = {\n full: 'high',\n}\nconst MODE_VALUES = ['auto', 'light', 'dark'] as const\n\ntype BorderRadiusOption = (typeof BORDER_RADIUS_VALUES)[number]\ntype FontScaleOption = (typeof FONT_SCALE_VALUES)[number]\ntype SpacingOption = (typeof SPACING_VALUES)[number]\ntype AnimationLevelOption = (typeof ANIMATION_LEVEL_VALUES)[number]\n\ntype ThemeModeOption = (typeof MODE_VALUES)[number]\n\ntype ThemeColorConfiguration = NonNullable<SiteThemeConfiguration['lightMode']>\n\nconst DEFAULT_THEME_NAME: ThemeDefaults = 'cool'\nconst DEFAULT_THEME_PRESET = defaultThemePresets.find(\n (preset) => preset.name === DEFAULT_THEME_NAME,\n)\n\nexport interface ResolvedThemeConfiguration {\n theme: ThemeDefaults\n colorMode: Mode\n allowColorModeToggle: boolean\n borderRadius: BorderRadiusOption\n fontScale: FontScaleOption\n spacing: SpacingOption\n animationLevel: AnimationLevelOption\n customCSS: string | null\n lightMode?: ThemeColorConfiguration\n darkMode?: ThemeColorConfiguration\n typography: ThemeTypographyPreset | null\n}\n\nexport const DEFAULT_THEME_CONFIGURATION: ResolvedThemeConfiguration = {\n theme: DEFAULT_THEME_NAME,\n colorMode: 'auto',\n allowColorModeToggle: true,\n borderRadius: 'medium',\n fontScale: 'medium',\n spacing: 'medium',\n animationLevel: 'medium',\n customCSS: null,\n lightMode: DEFAULT_THEME_PRESET?.lightMode,\n darkMode: DEFAULT_THEME_PRESET?.darkMode,\n typography: DEFAULT_THEME_PRESET?.typography ?? null,\n}\n\nfunction resolveBorderRadius(value: unknown): BorderRadiusOption {\n if (typeof value === 'string') {\n if (BORDER_RADIUS_VALUES.includes(value as BorderRadiusOption)) {\n return value as BorderRadiusOption\n }\n\n const legacyMatch = LEGACY_BORDER_RADIUS_ALIASES[value]\n if (legacyMatch) {\n return legacyMatch\n }\n }\n\n return DEFAULT_THEME_CONFIGURATION.borderRadius\n}\n\nfunction isFontScale(value: unknown): value is FontScaleOption {\n return typeof value === 'string' && FONT_SCALE_VALUES.includes(value as FontScaleOption)\n}\n\nfunction isSpacing(value: unknown): value is SpacingOption {\n return typeof value === 'string' && SPACING_VALUES.includes(value as SpacingOption)\n}\n\nfunction resolveAnimationLevel(value: unknown): AnimationLevelOption {\n if (typeof value === 'string') {\n if (ANIMATION_LEVEL_VALUES.includes(value as AnimationLevelOption)) {\n return value as AnimationLevelOption\n }\n\n const legacyMatch = LEGACY_ANIMATION_ALIASES[value]\n if (legacyMatch) {\n return legacyMatch\n }\n }\n\n return DEFAULT_THEME_CONFIGURATION.animationLevel\n}\n\nfunction isMode(value: unknown): value is ThemeModeOption {\n return typeof value === 'string' && MODE_VALUES.includes(value as ThemeModeOption)\n}\n\nexport function resolveThemeConfiguration(\n themeConfiguration?: SiteThemeConfiguration | null,\n): ResolvedThemeConfiguration {\n if (!themeConfiguration) {\n return DEFAULT_THEME_CONFIGURATION\n }\n\n const {\n theme,\n colorMode,\n allowColorModeToggle,\n borderRadius,\n fontScale,\n spacing,\n animationLevel,\n customCSS,\n lightMode,\n darkMode,\n typography,\n } = themeConfiguration\n\n const resolvedTheme =\n typeof theme === 'string' && themeIsValid(theme)\n ? (theme as ThemeDefaults)\n : DEFAULT_THEME_CONFIGURATION.theme\n const resolvedMode = isMode(colorMode)\n ? (colorMode as Mode)\n : DEFAULT_THEME_CONFIGURATION.colorMode\n const resolvedBorderRadius = resolveBorderRadius(borderRadius)\n const resolvedFontScale = isFontScale(fontScale)\n ? fontScale\n : DEFAULT_THEME_CONFIGURATION.fontScale\n const resolvedSpacing = isSpacing(spacing) ? spacing : DEFAULT_THEME_CONFIGURATION.spacing\n const resolvedAnimationLevel = resolveAnimationLevel(animationLevel)\n const resolvedAllowToggle =\n typeof allowColorModeToggle === 'boolean'\n ? allowColorModeToggle\n : DEFAULT_THEME_CONFIGURATION.allowColorModeToggle\n const resolvedCustomCSS = typeof customCSS === 'string' ? customCSS : null\n const preset = defaultThemePresets.find((candidate) => candidate.name === resolvedTheme)\n const baseLightMode = preset?.lightMode ?? DEFAULT_THEME_CONFIGURATION.lightMode\n const baseDarkMode = preset?.darkMode ?? DEFAULT_THEME_CONFIGURATION.darkMode\n const resolvedLightMode = mergeColorModes(baseLightMode, lightMode)\n const resolvedDarkMode = mergeColorModes(baseDarkMode, darkMode)\n const resolvedTypography =\n mergeTypography(preset?.typography, typography) ?? preset?.typography ?? null\n\n return {\n theme: resolvedTheme,\n colorMode: resolvedMode,\n allowColorModeToggle: resolvedAllowToggle,\n borderRadius: resolvedBorderRadius,\n fontScale: resolvedFontScale,\n spacing: resolvedSpacing,\n animationLevel: resolvedAnimationLevel,\n customCSS: resolvedCustomCSS,\n lightMode: resolvedLightMode,\n darkMode: resolvedDarkMode,\n typography: resolvedTypography,\n }\n}\n\nfunction mergeColorModes(\n base?: ThemeColorConfiguration,\n overrides?: SiteThemeConfiguration['lightMode'],\n): ThemeColorConfiguration | undefined {\n const merged: Record<string, string> = {}\n\n if (base) {\n Object.entries(base).forEach(([key, value]) => {\n if (typeof value === 'string' && value.trim().length > 0) {\n merged[key] = value\n }\n })\n }\n\n if (overrides) {\n Object.entries(overrides).forEach(([key, value]) => {\n if (typeof value === 'string' && value.trim().length > 0) {\n merged[key] = value\n } else if (value === null) {\n delete merged[key]\n }\n })\n }\n\n return Object.keys(merged).length > 0 ? (merged as ThemeColorConfiguration) : undefined\n}\n\nfunction mergeTypography(\n base?: ThemeTypographyPreset | null,\n overrides?: ThemeTypographyOverride | null,\n): ThemeTypographyPreset | null {\n if (!base && !overrides) {\n return base ?? null\n }\n\n const result: ThemeTypographyPreset = {\n fontFamily: base?.fontFamily ?? 'var(--font-geist-sans)',\n headingFamily: base?.headingFamily ?? 'var(--font-geist-sans)',\n baseFontSize: base?.baseFontSize ?? '16px',\n lineHeight: base?.lineHeight ?? '1.6',\n fontWeights: { ...(base?.fontWeights ?? {}) },\n letterSpacing: { ...(base?.letterSpacing ?? {}) },\n }\n\n if (overrides) {\n const resolvedBodyFont = resolveFontSelection(\n overrides.bodyFont,\n overrides.bodyFontCustom,\n base?.fontFamily,\n )\n if (resolvedBodyFont) {\n result.fontFamily = resolvedBodyFont\n }\n\n const resolvedHeadingFont = resolveFontSelection(\n overrides.headingFont,\n overrides.headingFontCustom,\n base?.headingFamily,\n )\n if (resolvedHeadingFont) {\n result.headingFamily = resolvedHeadingFont\n }\n\n if (overrides.baseFontSize && overrides.baseFontSize !== 'preset') {\n result.baseFontSize = overrides.baseFontSize\n }\n\n if (overrides.lineHeight && overrides.lineHeight !== 'preset') {\n result.lineHeight = overrides.lineHeight\n }\n }\n\n return result\n}\n\nfunction resolveFontSelection(\n selection?: string | null,\n custom?: string | null,\n fallback?: string | null,\n): string | null {\n if (!selection || selection === 'preset') {\n return fallback ?? null\n }\n\n if (selection === 'custom') {\n const trimmed = custom?.trim()\n return trimmed && trimmed.length > 0 ? trimmed : (fallback ?? null)\n }\n\n const mapped = FONT_VALUE_TO_CSS[selection]\n return mapped ?? fallback ?? null\n}\n"],"names":["FONT_VALUE_TO_CSS","themeIsValid","defaultThemePresets","BORDER_RADIUS_VALUES","LEGACY_BORDER_RADIUS_ALIASES","full","FONT_SCALE_VALUES","SPACING_VALUES","ANIMATION_LEVEL_VALUES","LEGACY_ANIMATION_ALIASES","MODE_VALUES","DEFAULT_THEME_NAME","DEFAULT_THEME_PRESET","find","preset","name","DEFAULT_THEME_CONFIGURATION","theme","colorMode","allowColorModeToggle","borderRadius","fontScale","spacing","animationLevel","customCSS","lightMode","darkMode","typography","resolveBorderRadius","value","includes","legacyMatch","isFontScale","isSpacing","resolveAnimationLevel","isMode","resolveThemeConfiguration","themeConfiguration","resolvedTheme","resolvedMode","resolvedBorderRadius","resolvedFontScale","resolvedSpacing","resolvedAnimationLevel","resolvedAllowToggle","resolvedCustomCSS","candidate","baseLightMode","baseDarkMode","resolvedLightMode","mergeColorModes","resolvedDarkMode","resolvedTypography","mergeTypography","base","overrides","merged","Object","entries","forEach","key","trim","length","keys","undefined","result","fontFamily","headingFamily","baseFontSize","lineHeight","fontWeights","letterSpacing","resolvedBodyFont","resolveFontSelection","bodyFont","bodyFontCustom","resolvedHeadingFont","headingFont","headingFontCustom","selection","custom","fallback","trimmed","mapped"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { ThemeDefaults } from '
|
|
1
|
+
import type { ThemeDefaults } from '../providers/Theme/types.js';
|
|
2
2
|
export declare function getThemeCriticalCSS(theme: ThemeDefaults): Promise<string | null>;
|
|
3
3
|
export declare function getThemeCSSPath(theme: ThemeDefaults): string;
|
|
4
4
|
export declare function generateThemePreloadLinks(theme: ThemeDefaults): string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"themeAssets.d.ts","sourceRoot":"","sources":["../../src/utils/themeAssets.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"themeAssets.d.ts","sourceRoot":"","sources":["../../src/utils/themeAssets.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAA;AAwBhE,wBAAsB,mBAAmB,CAAC,KAAK,EAAE,aAAa,GAAG,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC,CAgBtF;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,aAAa,GAAG,MAAM,CAG5D;AAED,wBAAgB,yBAAyB,CAAC,KAAK,EAAE,aAAa,GAAG,MAAM,CAGtE;AAED,wBAAgB,yBAAyB,CAAC,KAAK,EAAE,aAAa,GAAG,MAAM,CAmBtE"}
|
|
@@ -8,7 +8,7 @@ const themeCriticalFiles = {
|
|
|
8
8
|
dealership: 'dealership-critical.css',
|
|
9
9
|
'real-estate': 'real-estate-critical.css',
|
|
10
10
|
'real-estate-gold': 'real-estate-gold-critical.css',
|
|
11
|
-
'real-estate-neutral': 'real-estate-neutral-critical.css'
|
|
11
|
+
'real-estate-neutral': 'real-estate-neutral-critical.css'
|
|
12
12
|
};
|
|
13
13
|
const themeFullFiles = {
|
|
14
14
|
cool: 'cool.css',
|
|
@@ -18,7 +18,7 @@ const themeFullFiles = {
|
|
|
18
18
|
dealership: 'dealership.css',
|
|
19
19
|
'real-estate': 'real-estate.css',
|
|
20
20
|
'real-estate-gold': 'real-estate-gold.css',
|
|
21
|
-
'real-estate-neutral': 'real-estate-neutral.css'
|
|
21
|
+
'real-estate-neutral': 'real-estate-neutral.css'
|
|
22
22
|
};
|
|
23
23
|
export async function getThemeCriticalCSS(theme) {
|
|
24
24
|
try {
|
|
@@ -30,8 +30,7 @@ export async function getThemeCriticalCSS(theme) {
|
|
|
30
30
|
const filePath = join(process.cwd(), 'public', 'themes', filename);
|
|
31
31
|
const css = await readFile(filePath, 'utf-8');
|
|
32
32
|
return css.replace(/\r\n/g, '\n').replace(/\r/g, '\n');
|
|
33
|
-
}
|
|
34
|
-
catch (error) {
|
|
33
|
+
} catch (error) {
|
|
35
34
|
console.error(`Error reading critical CSS for theme ${theme}:`, error);
|
|
36
35
|
return null;
|
|
37
36
|
}
|
|
@@ -64,4 +63,5 @@ export function createFallbackCriticalCSS(theme) {
|
|
|
64
63
|
}
|
|
65
64
|
`.trim();
|
|
66
65
|
}
|
|
66
|
+
|
|
67
67
|
//# sourceMappingURL=themeAssets.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../src/utils/themeAssets.ts"],"sourcesContent":["import { readFile } from 'fs/promises'\nimport { join } from 'path'\nimport type { ThemeDefaults } from '../providers/Theme/types.js'\n\nconst themeCriticalFiles: Record<string, string> = {\n cool: 'cool-critical.css',\n brutal: 'brutal-critical.css',\n neon: 'neon-critical.css',\n solar: 'solar-critical.css',\n dealership: 'dealership-critical.css',\n 'real-estate': 'real-estate-critical.css',\n 'real-estate-gold': 'real-estate-gold-critical.css',\n 'real-estate-neutral': 'real-estate-neutral-critical.css',\n}\n\nconst themeFullFiles: Record<string, string> = {\n cool: 'cool.css',\n brutal: 'brutal.css',\n neon: 'neon.css',\n solar: 'solar.css',\n dealership: 'dealership.css',\n 'real-estate': 'real-estate.css',\n 'real-estate-gold': 'real-estate-gold.css',\n 'real-estate-neutral': 'real-estate-neutral.css',\n}\n\nexport async function getThemeCriticalCSS(theme: ThemeDefaults): Promise<string | null> {\n try {\n const filename = themeCriticalFiles[theme]\n if (!filename) {\n console.warn(`Critical CSS file not found for theme: ${theme}`)\n return null\n }\n\n const filePath = join(process.cwd(), 'public', 'themes', filename)\n const css = await readFile(filePath, 'utf-8')\n\n return css.replace(/\\r\\n/g, '\\n').replace(/\\r/g, '\\n')\n } catch (error) {\n console.error(`Error reading critical CSS for theme ${theme}:`, error)\n return null\n }\n}\n\nexport function getThemeCSSPath(theme: ThemeDefaults): string {\n const filename = themeFullFiles[theme]\n return `/themes/${filename}`\n}\n\nexport function generateThemePreloadLinks(theme: ThemeDefaults): string {\n const cssPath = getThemeCSSPath(theme)\n return `<link rel=\"preload\" href=\"${cssPath}\" as=\"style\" onload=\"this.onload=null;this.rel='stylesheet'\">`\n}\n\nexport function createFallbackCriticalCSS(theme: ThemeDefaults): string {\n return `\n/* Fallback critical CSS for ${theme} theme */\n[data-theme=\"${theme}\"] {\n --background: hsl(0 0% 100%);\n --foreground: hsl(222 47% 11%);\n --primary: hsl(221 83% 53%);\n --primary-foreground: hsl(210 40% 98%);\n color-scheme: light;\n}\n\n[data-theme=\"${theme}\"][data-theme-mode=\"dark\"] {\n --background: hsl(222 47% 11%);\n --foreground: hsl(210 40% 98%);\n --primary: hsl(217 91% 60%);\n --primary-foreground: hsl(222 47% 11%);\n color-scheme: dark;\n}\n`.trim()\n}\n"],"names":["readFile","join","themeCriticalFiles","cool","brutal","neon","solar","dealership","themeFullFiles","getThemeCriticalCSS","theme","filename","console","warn","filePath","process","cwd","css","replace","error","getThemeCSSPath","generateThemePreloadLinks","cssPath","createFallbackCriticalCSS","trim"],"mappings":"AAAA,SAASA,QAAQ,QAAQ,cAAa;AACtC,SAASC,IAAI,QAAQ,OAAM;AAG3B,MAAMC,qBAA6C;IACjDC,MAAM;IACNC,QAAQ;IACRC,MAAM;IACNC,OAAO;IACPC,YAAY;IACZ,eAAe;IACf,oBAAoB;IACpB,uBAAuB;AACzB;AAEA,MAAMC,iBAAyC;IAC7CL,MAAM;IACNC,QAAQ;IACRC,MAAM;IACNC,OAAO;IACPC,YAAY;IACZ,eAAe;IACf,oBAAoB;IACpB,uBAAuB;AACzB;AAEA,OAAO,eAAeE,oBAAoBC,KAAoB;IAC5D,IAAI;QACF,MAAMC,WAAWT,kBAAkB,CAACQ,MAAM;QAC1C,IAAI,CAACC,UAAU;YACbC,QAAQC,IAAI,CAAC,CAAC,uCAAuC,EAAEH,OAAO;YAC9D,OAAO;QACT;QAEA,MAAMI,WAAWb,KAAKc,QAAQC,GAAG,IAAI,UAAU,UAAUL;QACzD,MAAMM,MAAM,MAAMjB,SAASc,UAAU;QAErC,OAAOG,IAAIC,OAAO,CAAC,SAAS,MAAMA,OAAO,CAAC,OAAO;IACnD,EAAE,OAAOC,OAAO;QACdP,QAAQO,KAAK,CAAC,CAAC,qCAAqC,EAAET,MAAM,CAAC,CAAC,EAAES;QAChE,OAAO;IACT;AACF;AAEA,OAAO,SAASC,gBAAgBV,KAAoB;IAClD,MAAMC,WAAWH,cAAc,CAACE,MAAM;IACtC,OAAO,CAAC,QAAQ,EAAEC,UAAU;AAC9B;AAEA,OAAO,SAASU,0BAA0BX,KAAoB;IAC5D,MAAMY,UAAUF,gBAAgBV;IAChC,OAAO,CAAC,0BAA0B,EAAEY,QAAQ,6DAA6D,CAAC;AAC5G;AAEA,OAAO,SAASC,0BAA0Bb,KAAoB;IAC5D,OAAO,CAAC;6BACmB,EAAEA,MAAM;aACxB,EAAEA,MAAM;;;;;;;;aAQR,EAAEA,MAAM;;;;;;;AAOrB,CAAC,CAACc,IAAI;AACN"}
|
|
@@ -1,33 +1,86 @@
|
|
|
1
1
|
const COLOR_VARIABLE_MAP = [
|
|
2
|
-
{
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
{
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
{
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
{
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
{
|
|
19
|
-
|
|
20
|
-
|
|
2
|
+
{
|
|
3
|
+
key: 'background',
|
|
4
|
+
variable: '--background'
|
|
5
|
+
},
|
|
6
|
+
{
|
|
7
|
+
key: 'foreground',
|
|
8
|
+
variable: '--foreground'
|
|
9
|
+
},
|
|
10
|
+
{
|
|
11
|
+
key: 'card',
|
|
12
|
+
variable: '--card'
|
|
13
|
+
},
|
|
14
|
+
{
|
|
15
|
+
key: 'cardForeground',
|
|
16
|
+
variable: '--card-foreground'
|
|
17
|
+
},
|
|
18
|
+
{
|
|
19
|
+
key: 'popover',
|
|
20
|
+
variable: '--popover'
|
|
21
|
+
},
|
|
22
|
+
{
|
|
23
|
+
key: 'popoverForeground',
|
|
24
|
+
variable: '--popover-foreground'
|
|
25
|
+
},
|
|
26
|
+
{
|
|
27
|
+
key: 'primary',
|
|
28
|
+
variable: '--primary'
|
|
29
|
+
},
|
|
30
|
+
{
|
|
31
|
+
key: 'primaryForeground',
|
|
32
|
+
variable: '--primary-foreground'
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
key: 'secondary',
|
|
36
|
+
variable: '--secondary'
|
|
37
|
+
},
|
|
38
|
+
{
|
|
39
|
+
key: 'secondaryForeground',
|
|
40
|
+
variable: '--secondary-foreground'
|
|
41
|
+
},
|
|
42
|
+
{
|
|
43
|
+
key: 'muted',
|
|
44
|
+
variable: '--muted'
|
|
45
|
+
},
|
|
46
|
+
{
|
|
47
|
+
key: 'mutedForeground',
|
|
48
|
+
variable: '--muted-foreground'
|
|
49
|
+
},
|
|
50
|
+
{
|
|
51
|
+
key: 'accent',
|
|
52
|
+
variable: '--accent'
|
|
53
|
+
},
|
|
54
|
+
{
|
|
55
|
+
key: 'accentForeground',
|
|
56
|
+
variable: '--accent-foreground'
|
|
57
|
+
},
|
|
58
|
+
{
|
|
59
|
+
key: 'destructive',
|
|
60
|
+
variable: '--destructive'
|
|
61
|
+
},
|
|
62
|
+
{
|
|
63
|
+
key: 'destructiveForeground',
|
|
64
|
+
variable: '--destructive-foreground'
|
|
65
|
+
},
|
|
66
|
+
{
|
|
67
|
+
key: 'border',
|
|
68
|
+
variable: '--border'
|
|
69
|
+
},
|
|
70
|
+
{
|
|
71
|
+
key: 'input',
|
|
72
|
+
variable: '--input'
|
|
73
|
+
},
|
|
74
|
+
{
|
|
75
|
+
key: 'ring',
|
|
76
|
+
variable: '--ring'
|
|
77
|
+
}
|
|
21
78
|
];
|
|
22
79
|
export function hexToHsl(hex) {
|
|
23
|
-
if (!hex)
|
|
24
|
-
return '0 0% 0%';
|
|
80
|
+
if (!hex) return '0 0% 0%';
|
|
25
81
|
hex = hex.replace('#', '');
|
|
26
82
|
if (hex.length === 3) {
|
|
27
|
-
hex = hex
|
|
28
|
-
.split('')
|
|
29
|
-
.map((char) => char + char)
|
|
30
|
-
.join('');
|
|
83
|
+
hex = hex.split('').map((char)=>char + char).join('');
|
|
31
84
|
}
|
|
32
85
|
const r = Number.parseInt(hex.substring(0, 2), 16) / 255;
|
|
33
86
|
const g = Number.parseInt(hex.substring(2, 4), 16) / 255;
|
|
@@ -40,7 +93,7 @@ export function hexToHsl(hex) {
|
|
|
40
93
|
if (max !== min) {
|
|
41
94
|
const d = max - min;
|
|
42
95
|
s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
|
|
43
|
-
switch
|
|
96
|
+
switch(max){
|
|
44
97
|
case r:
|
|
45
98
|
h = ((g - b) / d + (g < b ? 6 : 0)) / 6;
|
|
46
99
|
break;
|
|
@@ -58,18 +111,15 @@ export function hexToHsl(hex) {
|
|
|
58
111
|
return `${h} ${s}% ${lRounded}%`;
|
|
59
112
|
}
|
|
60
113
|
export function generateColorModeCss(colors, options = {}) {
|
|
61
|
-
if (!colors)
|
|
62
|
-
return '';
|
|
114
|
+
if (!colors) return '';
|
|
63
115
|
const { themeName, isDark = false } = options;
|
|
64
|
-
const cssVariables = COLOR_VARIABLE_MAP.reduce((acc, { key, variable })
|
|
116
|
+
const cssVariables = COLOR_VARIABLE_MAP.reduce((acc, { key, variable })=>{
|
|
65
117
|
const value = normalizeColor(colors[key]);
|
|
66
|
-
if (!value)
|
|
67
|
-
return acc;
|
|
118
|
+
if (!value) return acc;
|
|
68
119
|
acc.push(`${variable}: hsl(${hexToHsl(value)});`);
|
|
69
120
|
return acc;
|
|
70
121
|
}, []);
|
|
71
|
-
if (cssVariables.length === 0)
|
|
72
|
-
return '';
|
|
122
|
+
if (cssVariables.length === 0) return '';
|
|
73
123
|
const selector = buildSelector(themeName, isDark);
|
|
74
124
|
return `${selector} {
|
|
75
125
|
${cssVariables.join('\n ')}
|
|
@@ -79,14 +129,18 @@ export function generateThemeColorsCss(options) {
|
|
|
79
129
|
const cssBlocks = [];
|
|
80
130
|
const { themeName, lightMode, darkMode } = options;
|
|
81
131
|
if (lightMode) {
|
|
82
|
-
const lightModeCss = generateColorModeCss(lightMode, {
|
|
83
|
-
|
|
84
|
-
|
|
132
|
+
const lightModeCss = generateColorModeCss(lightMode, {
|
|
133
|
+
themeName,
|
|
134
|
+
isDark: false
|
|
135
|
+
});
|
|
136
|
+
if (lightModeCss) cssBlocks.push(lightModeCss);
|
|
85
137
|
}
|
|
86
138
|
if (darkMode) {
|
|
87
|
-
const darkModeCss = generateColorModeCss(darkMode, {
|
|
88
|
-
|
|
89
|
-
|
|
139
|
+
const darkModeCss = generateColorModeCss(darkMode, {
|
|
140
|
+
themeName,
|
|
141
|
+
isDark: true
|
|
142
|
+
});
|
|
143
|
+
if (darkModeCss) cssBlocks.push(darkModeCss);
|
|
90
144
|
}
|
|
91
145
|
return cssBlocks.join('\n\n');
|
|
92
146
|
}
|
|
@@ -103,9 +157,9 @@ function buildSelector(themeName, isDark) {
|
|
|
103
157
|
return ':root';
|
|
104
158
|
}
|
|
105
159
|
function normalizeColor(value) {
|
|
106
|
-
if (typeof value !== 'string')
|
|
107
|
-
return null;
|
|
160
|
+
if (typeof value !== 'string') return null;
|
|
108
161
|
const trimmed = value.trim();
|
|
109
162
|
return trimmed.length === 0 ? null : trimmed;
|
|
110
163
|
}
|
|
164
|
+
|
|
111
165
|
//# sourceMappingURL=themeColors.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
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":"AA+BA,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;CACnC;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,MAAM,EAAEC,SAAS+B,OAAO,EAAE,CAAC;QAChD,OAAOD;IACT,GAAG,EAAE;IAEL,IAAIF,aAAazB,MAAM,KAAK,GAAG,OAAO;IAEtC,MAAM+B,WAAWC,cAAcT,WAAWC;IAC1C,OAAO,GAAGO,SAAS;EACnB,EAAEN,aAAarB,IAAI,CAAC,QAAQ;CAC7B,CAAC;AACF;AAEA,OAAO,SAAS6B,uBAAuBX,OAAmC;IACxE,MAAMY,YAAsB,EAAE;IAC9B,MAAM,EAAEX,SAAS,EAAEY,SAAS,EAAEC,QAAQ,EAAE,GAAGd;IAE3C,IAAIa,WAAW;QACb,MAAME,eAAejB,qBAAqBe,WAAW;YAAEZ;YAAWC,QAAQ;QAAM;QAChF,IAAIa,cAAcH,UAAUJ,IAAI,CAACO;IACnC;IAEA,IAAID,UAAU;QACZ,MAAME,cAAclB,qBAAqBgB,UAAU;YAAEb;YAAWC,QAAQ;QAAK;QAC7E,IAAIc,aAAaJ,UAAUJ,IAAI,CAACQ;IAClC;IAEA,OAAOJ,UAAU9B,IAAI,CAAC;AACxB;AAEA,SAAS4B,cAAcT,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,MAAMW,UAAUX,MAAMY,IAAI;IAC1B,OAAOD,QAAQvC,MAAM,KAAK,IAAI,OAAOuC;AACvC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import type { SiteSetting } from '
|
|
2
|
-
import type { ThemeTypographyPreset } from '../presets';
|
|
1
|
+
import type { SiteSetting } from '../payload-types.js';
|
|
2
|
+
import type { ThemeTypographyPreset } from '../presets.js';
|
|
3
3
|
type ThemeTypographyConfiguration = {
|
|
4
4
|
typography?: ThemeTypographyPreset | null;
|
|
5
5
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"themeUtils.d.ts","sourceRoot":"","sources":["../../src/utils/themeUtils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,
|
|
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"}
|
package/dist/utils/themeUtils.js
CHANGED
|
@@ -1,8 +1,7 @@
|
|
|
1
|
-
import { borderRadiusPresets } from '
|
|
1
|
+
import { borderRadiusPresets } from '../providers/Theme/themeConfig.js';
|
|
2
2
|
/**
|
|
3
3
|
* Generates CSS custom properties from theme configuration
|
|
4
|
-
*/
|
|
5
|
-
export function generateThemeCSS(config) {
|
|
4
|
+
*/ export function generateThemeCSS(config) {
|
|
6
5
|
const cssRules = [];
|
|
7
6
|
const customization = config.customization;
|
|
8
7
|
const themeSelector = config.theme ? `:root[data-theme='${config.theme}']` : ':root';
|
|
@@ -25,21 +24,19 @@ export function generateThemeCSS(config) {
|
|
|
25
24
|
}
|
|
26
25
|
/**
|
|
27
26
|
* Determines if a color is light or dark
|
|
28
|
-
*/
|
|
29
|
-
function isLightBackground(color) {
|
|
27
|
+
*/ function isLightBackground(color) {
|
|
30
28
|
// Simple heuristic: if it contains 'white', '#fff', or high RGB values, it's light
|
|
31
29
|
const lightPatterns = [
|
|
32
30
|
/white/i,
|
|
33
31
|
/#f{3,6}/i,
|
|
34
32
|
/rgb\s*\(\s*([2-9]\d{2}|1[5-9]\d|1\d{2}),/,
|
|
35
|
-
/hsl\s*\([^)]*,\s*[^,)]*,\s*([7-9]\d|100)%\)
|
|
33
|
+
/hsl\s*\([^)]*,\s*[^,)]*,\s*([7-9]\d|100)%\)/
|
|
36
34
|
];
|
|
37
|
-
return lightPatterns.some((pattern)
|
|
35
|
+
return lightPatterns.some((pattern)=>pattern.test(color));
|
|
38
36
|
}
|
|
39
37
|
/**
|
|
40
38
|
* Generate theme styles for use in components
|
|
41
|
-
*/
|
|
42
|
-
export function getThemeStyles(config) {
|
|
39
|
+
*/ export function getThemeStyles(config) {
|
|
43
40
|
const styles = {};
|
|
44
41
|
const customization = config.customization;
|
|
45
42
|
applyCustomizationStyleOverrides(styles, customization);
|
|
@@ -47,8 +44,7 @@ export function getThemeStyles(config) {
|
|
|
47
44
|
return styles;
|
|
48
45
|
}
|
|
49
46
|
function applyCustomizationRootRules(rules, customization) {
|
|
50
|
-
if (!customization)
|
|
51
|
-
return;
|
|
47
|
+
if (!customization) return;
|
|
52
48
|
if (customization.primaryColor) {
|
|
53
49
|
rules.push(` --primary-custom: ${customization.primaryColor};`);
|
|
54
50
|
}
|
|
@@ -65,13 +61,11 @@ function applyCustomizationRootRules(rules, customization) {
|
|
|
65
61
|
}
|
|
66
62
|
}
|
|
67
63
|
function applyBorderRadiusRule(rules, config) {
|
|
68
|
-
if (!config.borderRadius)
|
|
69
|
-
return;
|
|
64
|
+
if (!config.borderRadius) return;
|
|
70
65
|
const preset = borderRadiusPresets[config.borderRadius];
|
|
71
|
-
if (!preset)
|
|
72
|
-
return;
|
|
66
|
+
if (!preset) return;
|
|
73
67
|
const cssEntries = Object.entries(preset.css);
|
|
74
|
-
cssEntries.forEach(([property, value])
|
|
68
|
+
cssEntries.forEach(([property, value])=>{
|
|
75
69
|
rules.push(` ${property}: ${value};`);
|
|
76
70
|
});
|
|
77
71
|
const defaultRadius = preset.css['--radius-default'] ?? preset.css['--radius-medium'] ?? preset.css['--radius-large'];
|
|
@@ -80,13 +74,12 @@ function applyBorderRadiusRule(rules, config) {
|
|
|
80
74
|
}
|
|
81
75
|
}
|
|
82
76
|
function applyFontScaleRules(rules, config) {
|
|
83
|
-
if (!config.fontScale)
|
|
84
|
-
return;
|
|
77
|
+
if (!config.fontScale) return;
|
|
85
78
|
const scaleValues = {
|
|
86
79
|
small: '0.9',
|
|
87
80
|
medium: '1',
|
|
88
81
|
large: '1.1',
|
|
89
|
-
xl: '1.25'
|
|
82
|
+
xl: '1.25'
|
|
90
83
|
};
|
|
91
84
|
const scale = scaleValues[config.fontScale] ?? '1';
|
|
92
85
|
rules.push(` --font-scale: ${scale};`);
|
|
@@ -99,54 +92,51 @@ function applyFontScaleRules(rules, config) {
|
|
|
99
92
|
'text-xl': '1.25rem',
|
|
100
93
|
'text-2xl': '1.5rem',
|
|
101
94
|
'text-3xl': '1.875rem',
|
|
102
|
-
'text-4xl': '2.25rem'
|
|
95
|
+
'text-4xl': '2.25rem'
|
|
103
96
|
};
|
|
104
|
-
Object.entries(baseSizes).forEach(([className, baseSize])
|
|
97
|
+
Object.entries(baseSizes).forEach(([className, baseSize])=>{
|
|
105
98
|
const scaledSize = parseFloat(baseSize) * parseFloat(scale);
|
|
106
99
|
rules.push(` --${className}: ${scaledSize}rem;`);
|
|
107
100
|
});
|
|
108
101
|
}
|
|
109
102
|
function applySpacingRule(rules, config) {
|
|
110
|
-
if (!config.spacing)
|
|
111
|
-
return;
|
|
103
|
+
if (!config.spacing) return;
|
|
112
104
|
const spacingMultipliers = {
|
|
113
105
|
compact: '0.75',
|
|
114
106
|
medium: '1',
|
|
115
|
-
spacious: '1.5'
|
|
107
|
+
spacious: '1.5'
|
|
116
108
|
};
|
|
117
109
|
const multiplier = spacingMultipliers[config.spacing] ?? '1';
|
|
118
110
|
rules.push(` --spacing-scale: ${multiplier};`);
|
|
119
111
|
rules.push(` --theme-spacing: ${multiplier};`);
|
|
120
112
|
}
|
|
121
113
|
function applyAnimationRule(rules, config) {
|
|
122
|
-
if (!config.animationLevel)
|
|
123
|
-
return;
|
|
114
|
+
if (!config.animationLevel) return;
|
|
124
115
|
const animationSettings = {
|
|
125
116
|
none: {
|
|
126
117
|
duration: '0s',
|
|
127
118
|
easing: 'linear',
|
|
128
|
-
scale: '0'
|
|
119
|
+
scale: '0'
|
|
129
120
|
},
|
|
130
121
|
reduced: {
|
|
131
122
|
duration: '0.1s',
|
|
132
123
|
easing: 'ease-out',
|
|
133
|
-
scale: '0.5'
|
|
124
|
+
scale: '0.5'
|
|
134
125
|
},
|
|
135
126
|
medium: {
|
|
136
127
|
duration: '0.2s',
|
|
137
128
|
easing: 'ease-out',
|
|
138
|
-
scale: '1'
|
|
129
|
+
scale: '1'
|
|
139
130
|
},
|
|
140
131
|
full: {
|
|
141
132
|
duration: '0.3s',
|
|
142
133
|
easing: 'cubic-bezier(0.4, 0, 0.2, 1)',
|
|
143
|
-
scale: '1.2'
|
|
144
|
-
}
|
|
134
|
+
scale: '1.2'
|
|
135
|
+
}
|
|
145
136
|
};
|
|
146
137
|
const level = config.animationLevel;
|
|
147
138
|
const settings = animationSettings[level] ?? animationSettings.medium;
|
|
148
|
-
if (!settings)
|
|
149
|
-
return;
|
|
139
|
+
if (!settings) return;
|
|
150
140
|
rules.push(` --animation-duration: ${settings.duration};`);
|
|
151
141
|
rules.push(` --animation-easing: ${settings.easing};`);
|
|
152
142
|
rules.push(` --animation-scale: ${settings.scale};`);
|
|
@@ -154,8 +144,7 @@ function applyAnimationRule(rules, config) {
|
|
|
154
144
|
}
|
|
155
145
|
function applyTypographyRules(rules, config) {
|
|
156
146
|
const typography = config.typography;
|
|
157
|
-
if (!typography)
|
|
158
|
-
return;
|
|
147
|
+
if (!typography) return;
|
|
159
148
|
if (typography.fontFamily) {
|
|
160
149
|
rules.push(` --typography-fontFamily: ${typography.fontFamily};`);
|
|
161
150
|
}
|
|
@@ -169,14 +158,14 @@ function applyTypographyRules(rules, config) {
|
|
|
169
158
|
rules.push(` --typography-lineHeight: ${typography.lineHeight};`);
|
|
170
159
|
}
|
|
171
160
|
if (typography.fontWeights) {
|
|
172
|
-
Object.entries(typography.fontWeights).forEach(([token, weight])
|
|
161
|
+
Object.entries(typography.fontWeights).forEach(([token, weight])=>{
|
|
173
162
|
if (weight) {
|
|
174
163
|
rules.push(` --typography-fontWeights-${token}: ${weight};`);
|
|
175
164
|
}
|
|
176
165
|
});
|
|
177
166
|
}
|
|
178
167
|
if (typography.letterSpacing) {
|
|
179
|
-
Object.entries(typography.letterSpacing).forEach(([token, value])
|
|
168
|
+
Object.entries(typography.letterSpacing).forEach(([token, value])=>{
|
|
180
169
|
if (value) {
|
|
181
170
|
rules.push(` --typography-letterSpacing-${token}: ${value};`);
|
|
182
171
|
}
|
|
@@ -184,8 +173,7 @@ function applyTypographyRules(rules, config) {
|
|
|
184
173
|
}
|
|
185
174
|
}
|
|
186
175
|
function applyDarkModeOverrides(rules, config, customization, selector) {
|
|
187
|
-
if (config.colorMode !== 'dark' && config.colorMode !== 'auto')
|
|
188
|
-
return;
|
|
176
|
+
if (config.colorMode !== 'dark' && config.colorMode !== 'auto') return;
|
|
189
177
|
rules.push('');
|
|
190
178
|
rules.push('@media (prefers-color-scheme: dark) {');
|
|
191
179
|
rules.push(` ${selector} {`);
|
|
@@ -201,8 +189,7 @@ function applyDarkModeOverrides(rules, config, customization, selector) {
|
|
|
201
189
|
rules.push('}');
|
|
202
190
|
}
|
|
203
191
|
function applyReducedMotionOverride(rules, config) {
|
|
204
|
-
if (config.animationLevel !== 'none')
|
|
205
|
-
return;
|
|
192
|
+
if (config.animationLevel !== 'none') return;
|
|
206
193
|
rules.push('');
|
|
207
194
|
rules.push('@media (prefers-reduced-motion: reduce) {');
|
|
208
195
|
rules.push(' *, *::before, *::after {');
|
|
@@ -214,15 +201,13 @@ function applyReducedMotionOverride(rules, config) {
|
|
|
214
201
|
rules.push('}');
|
|
215
202
|
}
|
|
216
203
|
function appendCustomCSS(rules, customization) {
|
|
217
|
-
if (!customization?.customCSS)
|
|
218
|
-
return;
|
|
204
|
+
if (!customization?.customCSS) return;
|
|
219
205
|
rules.push('');
|
|
220
206
|
rules.push('/* Custom CSS */');
|
|
221
207
|
rules.push(customization.customCSS);
|
|
222
208
|
}
|
|
223
209
|
function applyCustomizationStyleOverrides(styles, customization) {
|
|
224
|
-
if (!customization)
|
|
225
|
-
return;
|
|
210
|
+
if (!customization) return;
|
|
226
211
|
if (customization.primaryColor) {
|
|
227
212
|
styles['--primary'] = customization.primaryColor;
|
|
228
213
|
}
|
|
@@ -239,8 +224,7 @@ function applyCustomizationStyleOverrides(styles, customization) {
|
|
|
239
224
|
}
|
|
240
225
|
}
|
|
241
226
|
function applyTypographyStyleOverrides(styles, typography) {
|
|
242
|
-
if (!typography)
|
|
243
|
-
return;
|
|
227
|
+
if (!typography) return;
|
|
244
228
|
if (typography.fontFamily) {
|
|
245
229
|
styles['--font-family-base'] = typography.fontFamily;
|
|
246
230
|
}
|
|
@@ -254,4 +238,5 @@ function applyTypographyStyleOverrides(styles, typography) {
|
|
|
254
238
|
styles['--line-height-base'] = typography.lineHeight;
|
|
255
239
|
}
|
|
256
240
|
}
|
|
241
|
+
|
|
257
242
|
//# sourceMappingURL=themeUtils.js.map
|