@kilivi/payloadcms-theme-management 0.1.5 → 0.1.7
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/README.md +97 -97
- package/dist/components/ServerThemeInjector.d.ts +1 -1
- package/dist/components/ServerThemeInjector.d.ts.map +1 -1
- package/dist/components/{ServerThemeInjector.jsx → ServerThemeInjector.js} +50 -37
- 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.css +138 -138
- 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 +227 -134
- 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 +5 -5
- 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/src/--verbose/dist/fields/ThemeColorPickerField.scss +138 -0
- package/dist/src/dist/fields/ThemeColorPickerField.scss +138 -0
- 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 +38 -53
- 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
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AAE/C,MAAM,WAAW,4BAA4B;IAC5C,gDAAgD;IAChD,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,iFAAiF;IACjF,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,yCAAyC;IACzC,YAAY,CAAC,EAAE,WAAW,EAAE,CAAA;IAC5B,kDAAkD;IAClD,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,gEAAgE;IAChE,sBAAsB,CAAC,EAAE,OAAO,CAAA;IAChC,+BAA+B;IAC/B,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,gDAAgD;IAChD,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B,uDAAuD;IACvD,sBAAsB,CAAC,EAAE,OAAO,CAAA;IAChC,kDAAkD;IAClD,aAAa,CAAC,EAAE,OAAO,CAAA;CACvB;AAED,MAAM,WAAW,8BAA8B;IAC9C,iEAAiE;IACjE,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,0DAA0D;IAC1D,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,iDAAiD;IACjD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,kDAAkD;IAClD,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,8BAA8B;IAC9B,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,sDAAsD;IACtD,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC,CAAA;CACvD"}
|
package/dist/types.js
CHANGED
package/dist/types.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../src/types.ts"],"sourcesContent":["import type { ThemePreset } from './presets.js'\r\n\r\nexport interface ThemeManagementPluginOptions {\r\n\t/** Whether the plugin should register itself */\r\n\tenabled?: boolean\r\n\t/** Collection slug that stores site-level settings (default: `site-settings`) */\r\n\ttargetCollection?: string\r\n\t/** Theme presets available to editors */\r\n\tthemePresets?: ThemePreset[]\r\n\t/** Default preset name when no value is stored */\r\n\tdefaultTheme?: string\r\n\t/** Allow editors to toggle between light / dark / auto modes */\r\n\tincludeColorModeToggle?: boolean\r\n\t/** Expose custom CSS editor */\r\n\tincludeCustomCSS?: boolean\r\n\t/** Reserved for future use, keeps API parity */\r\n\tincludeBrandIdentity?: boolean\r\n\t/** Enable advanced controls such as animation level */\r\n\tenableAdvancedFeatures?: boolean\r\n\t/** Log helpful messages during config mutation */\r\n\tenableLogging?: boolean\r\n}\r\n\r\nexport interface FetchThemeConfigurationOptions {\r\n\t/** Optional tenant identifier if your project is multi-tenant */\r\n\ttenantSlug?: string\r\n\t/** Collection slug override (default: `site-settings`) */\r\n\tcollectionSlug?: string\r\n\t/** Depth parameter passed to Payload REST API */\r\n\tdepth?: number\r\n\t/** Locale parameter passed to Payload REST API */\r\n\tlocale?: string\r\n\t/** Include draft documents */\r\n\tdraft?: boolean\r\n\t/** Extra query parameters to append to the request */\r\n\tqueryParams?: Record<string, string | number | boolean>\r\n}\r\n\r\n"],"names":[],"mappings":"AAuBA,WAaC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import type { SiteSetting } from '
|
|
2
|
-
import type { Mode, ThemeDefaults } from '
|
|
3
|
-
import type { ThemeTypographyPreset } from '../presets';
|
|
1
|
+
import type { SiteSetting } from '../payload-types.js';
|
|
2
|
+
import type { Mode, ThemeDefaults } from '../providers/Theme/types.js';
|
|
3
|
+
import type { ThemeTypographyPreset } from '../presets.js';
|
|
4
4
|
interface ThemeTypographyOverride {
|
|
5
5
|
bodyFont?: string | null;
|
|
6
6
|
headingFont?: string | null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"resolveThemeConfiguration.d.ts","sourceRoot":"","sources":["../../src/utils/resolveThemeConfiguration.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"resolveThemeConfiguration.d.ts","sourceRoot":"","sources":["../../src/utils/resolveThemeConfiguration.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAA;AACtD,OAAO,KAAK,EAAE,IAAI,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAA;AAEtE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAA;AAG1D,UAAU,uBAAuB;IAC/B,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACxB,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC3B,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC9B,iBAAiB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACjC,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC5B,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;CAC3B;AAED,KAAK,sBAAsB,GAAG,WAAW,CAAC,oBAAoB,CAAC,GAAG;IAChE,UAAU,CAAC,EAAE,uBAAuB,GAAG,IAAI,CAAA;CAC5C,CAAA;AAED,QAAA,MAAM,oBAAoB,qDAAsD,CAAA;AAIhF,QAAA,MAAM,iBAAiB,uCAAwC,CAAA;AAC/D,QAAA,MAAM,cAAc,4CAA6C,CAAA;AACjE,QAAA,MAAM,sBAAsB,gDAAiD,CAAA;AAM7E,KAAK,kBAAkB,GAAG,CAAC,OAAO,oBAAoB,CAAC,CAAC,MAAM,CAAC,CAAA;AAC/D,KAAK,eAAe,GAAG,CAAC,OAAO,iBAAiB,CAAC,CAAC,MAAM,CAAC,CAAA;AACzD,KAAK,aAAa,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAA;AACpD,KAAK,oBAAoB,GAAG,CAAC,OAAO,sBAAsB,CAAC,CAAC,MAAM,CAAC,CAAA;AAInE,KAAK,uBAAuB,GAAG,WAAW,CAAC,sBAAsB,CAAC,WAAW,CAAC,CAAC,CAAA;AAO/E,MAAM,WAAW,0BAA0B;IACzC,KAAK,EAAE,aAAa,CAAA;IACpB,SAAS,EAAE,IAAI,CAAA;IACf,oBAAoB,EAAE,OAAO,CAAA;IAC7B,YAAY,EAAE,kBAAkB,CAAA;IAChC,SAAS,EAAE,eAAe,CAAA;IAC1B,OAAO,EAAE,aAAa,CAAA;IACtB,cAAc,EAAE,oBAAoB,CAAA;IACpC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAA;IACxB,SAAS,CAAC,EAAE,uBAAuB,CAAA;IACnC,QAAQ,CAAC,EAAE,uBAAuB,CAAA;IAClC,UAAU,EAAE,qBAAqB,GAAG,IAAI,CAAA;CACzC;AAED,eAAO,MAAM,2BAA2B,EAAE,0BAYzC,CAAA;AA4CD,wBAAgB,yBAAyB,CACvC,kBAAkB,CAAC,EAAE,sBAAsB,GAAG,IAAI,GACjD,0BAA0B,CA0D5B"}
|
|
@@ -1,19 +1,42 @@
|
|
|
1
|
-
import { FONT_VALUE_TO_CSS } from '
|
|
2
|
-
import { themeIsValid } from '
|
|
3
|
-
import { defaultThemePresets } from '../presets';
|
|
4
|
-
const BORDER_RADIUS_VALUES = [
|
|
1
|
+
import { FONT_VALUE_TO_CSS } from '../constants/themeFonts.js';
|
|
2
|
+
import { themeIsValid } from '../providers/Theme/types.js';
|
|
3
|
+
import { defaultThemePresets } from '../presets.js';
|
|
4
|
+
const BORDER_RADIUS_VALUES = [
|
|
5
|
+
'none',
|
|
6
|
+
'small',
|
|
7
|
+
'medium',
|
|
8
|
+
'large',
|
|
9
|
+
'xl'
|
|
10
|
+
];
|
|
5
11
|
const LEGACY_BORDER_RADIUS_ALIASES = {
|
|
6
|
-
full: 'xl'
|
|
12
|
+
full: 'xl'
|
|
7
13
|
};
|
|
8
|
-
const FONT_SCALE_VALUES = [
|
|
9
|
-
|
|
10
|
-
|
|
14
|
+
const FONT_SCALE_VALUES = [
|
|
15
|
+
'small',
|
|
16
|
+
'medium',
|
|
17
|
+
'large'
|
|
18
|
+
];
|
|
19
|
+
const SPACING_VALUES = [
|
|
20
|
+
'compact',
|
|
21
|
+
'medium',
|
|
22
|
+
'spacious'
|
|
23
|
+
];
|
|
24
|
+
const ANIMATION_LEVEL_VALUES = [
|
|
25
|
+
'none',
|
|
26
|
+
'reduced',
|
|
27
|
+
'medium',
|
|
28
|
+
'high'
|
|
29
|
+
];
|
|
11
30
|
const LEGACY_ANIMATION_ALIASES = {
|
|
12
|
-
full: 'high'
|
|
31
|
+
full: 'high'
|
|
13
32
|
};
|
|
14
|
-
const MODE_VALUES = [
|
|
33
|
+
const MODE_VALUES = [
|
|
34
|
+
'auto',
|
|
35
|
+
'light',
|
|
36
|
+
'dark'
|
|
37
|
+
];
|
|
15
38
|
const DEFAULT_THEME_NAME = 'cool';
|
|
16
|
-
const DEFAULT_THEME_PRESET = defaultThemePresets.find((preset)
|
|
39
|
+
const DEFAULT_THEME_PRESET = defaultThemePresets.find((preset)=>preset.name === DEFAULT_THEME_NAME);
|
|
17
40
|
export const DEFAULT_THEME_CONFIGURATION = {
|
|
18
41
|
theme: DEFAULT_THEME_NAME,
|
|
19
42
|
colorMode: 'auto',
|
|
@@ -25,7 +48,7 @@ export const DEFAULT_THEME_CONFIGURATION = {
|
|
|
25
48
|
customCSS: null,
|
|
26
49
|
lightMode: DEFAULT_THEME_PRESET?.lightMode,
|
|
27
50
|
darkMode: DEFAULT_THEME_PRESET?.darkMode,
|
|
28
|
-
typography: DEFAULT_THEME_PRESET?.typography ?? null
|
|
51
|
+
typography: DEFAULT_THEME_PRESET?.typography ?? null
|
|
29
52
|
};
|
|
30
53
|
function resolveBorderRadius(value) {
|
|
31
54
|
if (typeof value === 'string') {
|
|
@@ -64,24 +87,16 @@ export function resolveThemeConfiguration(themeConfiguration) {
|
|
|
64
87
|
if (!themeConfiguration) {
|
|
65
88
|
return DEFAULT_THEME_CONFIGURATION;
|
|
66
89
|
}
|
|
67
|
-
const { theme, colorMode, allowColorModeToggle, borderRadius, fontScale, spacing, animationLevel, customCSS, lightMode, darkMode, typography
|
|
68
|
-
const resolvedTheme = typeof theme === 'string' && themeIsValid(theme)
|
|
69
|
-
|
|
70
|
-
: DEFAULT_THEME_CONFIGURATION.theme;
|
|
71
|
-
const resolvedMode = isMode(colorMode)
|
|
72
|
-
? colorMode
|
|
73
|
-
: DEFAULT_THEME_CONFIGURATION.colorMode;
|
|
90
|
+
const { theme, colorMode, allowColorModeToggle, borderRadius, fontScale, spacing, animationLevel, customCSS, lightMode, darkMode, typography } = themeConfiguration;
|
|
91
|
+
const resolvedTheme = typeof theme === 'string' && themeIsValid(theme) ? theme : DEFAULT_THEME_CONFIGURATION.theme;
|
|
92
|
+
const resolvedMode = isMode(colorMode) ? colorMode : DEFAULT_THEME_CONFIGURATION.colorMode;
|
|
74
93
|
const resolvedBorderRadius = resolveBorderRadius(borderRadius);
|
|
75
|
-
const resolvedFontScale = isFontScale(fontScale)
|
|
76
|
-
? fontScale
|
|
77
|
-
: DEFAULT_THEME_CONFIGURATION.fontScale;
|
|
94
|
+
const resolvedFontScale = isFontScale(fontScale) ? fontScale : DEFAULT_THEME_CONFIGURATION.fontScale;
|
|
78
95
|
const resolvedSpacing = isSpacing(spacing) ? spacing : DEFAULT_THEME_CONFIGURATION.spacing;
|
|
79
96
|
const resolvedAnimationLevel = resolveAnimationLevel(animationLevel);
|
|
80
|
-
const resolvedAllowToggle = typeof allowColorModeToggle === 'boolean'
|
|
81
|
-
? allowColorModeToggle
|
|
82
|
-
: DEFAULT_THEME_CONFIGURATION.allowColorModeToggle;
|
|
97
|
+
const resolvedAllowToggle = typeof allowColorModeToggle === 'boolean' ? allowColorModeToggle : DEFAULT_THEME_CONFIGURATION.allowColorModeToggle;
|
|
83
98
|
const resolvedCustomCSS = typeof customCSS === 'string' ? customCSS : null;
|
|
84
|
-
const preset = defaultThemePresets.find((candidate)
|
|
99
|
+
const preset = defaultThemePresets.find((candidate)=>candidate.name === resolvedTheme);
|
|
85
100
|
const baseLightMode = preset?.lightMode ?? DEFAULT_THEME_CONFIGURATION.lightMode;
|
|
86
101
|
const baseDarkMode = preset?.darkMode ?? DEFAULT_THEME_CONFIGURATION.darkMode;
|
|
87
102
|
const resolvedLightMode = mergeColorModes(baseLightMode, lightMode);
|
|
@@ -98,24 +113,23 @@ export function resolveThemeConfiguration(themeConfiguration) {
|
|
|
98
113
|
customCSS: resolvedCustomCSS,
|
|
99
114
|
lightMode: resolvedLightMode,
|
|
100
115
|
darkMode: resolvedDarkMode,
|
|
101
|
-
typography: resolvedTypography
|
|
116
|
+
typography: resolvedTypography
|
|
102
117
|
};
|
|
103
118
|
}
|
|
104
119
|
function mergeColorModes(base, overrides) {
|
|
105
120
|
const merged = {};
|
|
106
121
|
if (base) {
|
|
107
|
-
Object.entries(base).forEach(([key, value])
|
|
122
|
+
Object.entries(base).forEach(([key, value])=>{
|
|
108
123
|
if (typeof value === 'string' && value.trim().length > 0) {
|
|
109
124
|
merged[key] = value;
|
|
110
125
|
}
|
|
111
126
|
});
|
|
112
127
|
}
|
|
113
128
|
if (overrides) {
|
|
114
|
-
Object.entries(overrides).forEach(([key, value])
|
|
129
|
+
Object.entries(overrides).forEach(([key, value])=>{
|
|
115
130
|
if (typeof value === 'string' && value.trim().length > 0) {
|
|
116
131
|
merged[key] = value;
|
|
117
|
-
}
|
|
118
|
-
else if (value === null) {
|
|
132
|
+
} else if (value === null) {
|
|
119
133
|
delete merged[key];
|
|
120
134
|
}
|
|
121
135
|
});
|
|
@@ -131,8 +145,12 @@ function mergeTypography(base, overrides) {
|
|
|
131
145
|
headingFamily: base?.headingFamily ?? 'var(--font-geist-sans)',
|
|
132
146
|
baseFontSize: base?.baseFontSize ?? '16px',
|
|
133
147
|
lineHeight: base?.lineHeight ?? '1.6',
|
|
134
|
-
fontWeights: {
|
|
135
|
-
|
|
148
|
+
fontWeights: {
|
|
149
|
+
...base?.fontWeights ?? {}
|
|
150
|
+
},
|
|
151
|
+
letterSpacing: {
|
|
152
|
+
...base?.letterSpacing ?? {}
|
|
153
|
+
}
|
|
136
154
|
};
|
|
137
155
|
if (overrides) {
|
|
138
156
|
const resolvedBodyFont = resolveFontSelection(overrides.bodyFont, overrides.bodyFontCustom, base?.fontFamily);
|
|
@@ -158,9 +176,10 @@ function resolveFontSelection(selection, custom, fallback) {
|
|
|
158
176
|
}
|
|
159
177
|
if (selection === 'custom') {
|
|
160
178
|
const trimmed = custom?.trim();
|
|
161
|
-
return trimmed && trimmed.length > 0 ? trimmed :
|
|
179
|
+
return trimmed && trimmed.length > 0 ? trimmed : fallback ?? null;
|
|
162
180
|
}
|
|
163
181
|
const mapped = FONT_VALUE_TO_CSS[selection];
|
|
164
182
|
return mapped ?? fallback ?? null;
|
|
165
183
|
}
|
|
184
|
+
|
|
166
185
|
//# sourceMappingURL=resolveThemeConfiguration.js.map
|
|
@@ -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'\r\nimport type { SiteSetting } from '../payload-types.js'\r\nimport type { Mode, ThemeDefaults } from '../providers/Theme/types.js'\r\nimport { themeIsValid } from '../providers/Theme/types.js'\r\nimport type { ThemeTypographyPreset } from '../presets.js'\r\nimport { defaultThemePresets } from '../presets.js'\r\n\r\ninterface ThemeTypographyOverride {\r\n bodyFont?: string | null\r\n headingFont?: string | null\r\n bodyFontCustom?: string | null\r\n headingFontCustom?: string | null\r\n baseFontSize?: string | null\r\n lineHeight?: string | null\r\n}\r\n\r\ntype SiteThemeConfiguration = SiteSetting['themeConfiguration'] & {\r\n typography?: ThemeTypographyOverride | null\r\n}\r\n\r\nconst BORDER_RADIUS_VALUES = ['none', 'small', 'medium', 'large', 'xl'] as const\r\nconst LEGACY_BORDER_RADIUS_ALIASES: Record<string, (typeof BORDER_RADIUS_VALUES)[number]> = {\r\n full: 'xl',\r\n}\r\nconst FONT_SCALE_VALUES = ['small', 'medium', 'large'] as const\r\nconst SPACING_VALUES = ['compact', 'medium', 'spacious'] as const\r\nconst ANIMATION_LEVEL_VALUES = ['none', 'reduced', 'medium', 'high'] as const\r\nconst LEGACY_ANIMATION_ALIASES: Record<string, (typeof ANIMATION_LEVEL_VALUES)[number]> = {\r\n full: 'high',\r\n}\r\nconst MODE_VALUES = ['auto', 'light', 'dark'] as const\r\n\r\ntype BorderRadiusOption = (typeof BORDER_RADIUS_VALUES)[number]\r\ntype FontScaleOption = (typeof FONT_SCALE_VALUES)[number]\r\ntype SpacingOption = (typeof SPACING_VALUES)[number]\r\ntype AnimationLevelOption = (typeof ANIMATION_LEVEL_VALUES)[number]\r\n\r\ntype ThemeModeOption = (typeof MODE_VALUES)[number]\r\n\r\ntype ThemeColorConfiguration = NonNullable<SiteThemeConfiguration['lightMode']>\r\n\r\nconst DEFAULT_THEME_NAME: ThemeDefaults = 'cool'\r\nconst DEFAULT_THEME_PRESET = defaultThemePresets.find(\r\n (preset) => preset.name === DEFAULT_THEME_NAME,\r\n)\r\n\r\nexport interface ResolvedThemeConfiguration {\r\n theme: ThemeDefaults\r\n colorMode: Mode\r\n allowColorModeToggle: boolean\r\n borderRadius: BorderRadiusOption\r\n fontScale: FontScaleOption\r\n spacing: SpacingOption\r\n animationLevel: AnimationLevelOption\r\n customCSS: string | null\r\n lightMode?: ThemeColorConfiguration\r\n darkMode?: ThemeColorConfiguration\r\n typography: ThemeTypographyPreset | null\r\n}\r\n\r\nexport const DEFAULT_THEME_CONFIGURATION: ResolvedThemeConfiguration = {\r\n theme: DEFAULT_THEME_NAME,\r\n colorMode: 'auto',\r\n allowColorModeToggle: true,\r\n borderRadius: 'medium',\r\n fontScale: 'medium',\r\n spacing: 'medium',\r\n animationLevel: 'medium',\r\n customCSS: null,\r\n lightMode: DEFAULT_THEME_PRESET?.lightMode,\r\n darkMode: DEFAULT_THEME_PRESET?.darkMode,\r\n typography: DEFAULT_THEME_PRESET?.typography ?? null,\r\n}\r\n\r\nfunction resolveBorderRadius(value: unknown): BorderRadiusOption {\r\n if (typeof value === 'string') {\r\n if (BORDER_RADIUS_VALUES.includes(value as BorderRadiusOption)) {\r\n return value as BorderRadiusOption\r\n }\r\n\r\n const legacyMatch = LEGACY_BORDER_RADIUS_ALIASES[value]\r\n if (legacyMatch) {\r\n return legacyMatch\r\n }\r\n }\r\n\r\n return DEFAULT_THEME_CONFIGURATION.borderRadius\r\n}\r\n\r\nfunction isFontScale(value: unknown): value is FontScaleOption {\r\n return typeof value === 'string' && FONT_SCALE_VALUES.includes(value as FontScaleOption)\r\n}\r\n\r\nfunction isSpacing(value: unknown): value is SpacingOption {\r\n return typeof value === 'string' && SPACING_VALUES.includes(value as SpacingOption)\r\n}\r\n\r\nfunction resolveAnimationLevel(value: unknown): AnimationLevelOption {\r\n if (typeof value === 'string') {\r\n if (ANIMATION_LEVEL_VALUES.includes(value as AnimationLevelOption)) {\r\n return value as AnimationLevelOption\r\n }\r\n\r\n const legacyMatch = LEGACY_ANIMATION_ALIASES[value]\r\n if (legacyMatch) {\r\n return legacyMatch\r\n }\r\n }\r\n\r\n return DEFAULT_THEME_CONFIGURATION.animationLevel\r\n}\r\n\r\nfunction isMode(value: unknown): value is ThemeModeOption {\r\n return typeof value === 'string' && MODE_VALUES.includes(value as ThemeModeOption)\r\n}\r\n\r\nexport function resolveThemeConfiguration(\r\n themeConfiguration?: SiteThemeConfiguration | null,\r\n): ResolvedThemeConfiguration {\r\n if (!themeConfiguration) {\r\n return DEFAULT_THEME_CONFIGURATION\r\n }\r\n\r\n const {\r\n theme,\r\n colorMode,\r\n allowColorModeToggle,\r\n borderRadius,\r\n fontScale,\r\n spacing,\r\n animationLevel,\r\n customCSS,\r\n lightMode,\r\n darkMode,\r\n typography,\r\n } = themeConfiguration\r\n\r\n const resolvedTheme =\r\n typeof theme === 'string' && themeIsValid(theme)\r\n ? (theme as ThemeDefaults)\r\n : DEFAULT_THEME_CONFIGURATION.theme\r\n const resolvedMode = isMode(colorMode)\r\n ? (colorMode as Mode)\r\n : DEFAULT_THEME_CONFIGURATION.colorMode\r\n const resolvedBorderRadius = resolveBorderRadius(borderRadius)\r\n const resolvedFontScale = isFontScale(fontScale)\r\n ? fontScale\r\n : DEFAULT_THEME_CONFIGURATION.fontScale\r\n const resolvedSpacing = isSpacing(spacing) ? spacing : DEFAULT_THEME_CONFIGURATION.spacing\r\n const resolvedAnimationLevel = resolveAnimationLevel(animationLevel)\r\n const resolvedAllowToggle =\r\n typeof allowColorModeToggle === 'boolean'\r\n ? allowColorModeToggle\r\n : DEFAULT_THEME_CONFIGURATION.allowColorModeToggle\r\n const resolvedCustomCSS = typeof customCSS === 'string' ? customCSS : null\r\n const preset = defaultThemePresets.find((candidate) => candidate.name === resolvedTheme)\r\n const baseLightMode = preset?.lightMode ?? DEFAULT_THEME_CONFIGURATION.lightMode\r\n const baseDarkMode = preset?.darkMode ?? DEFAULT_THEME_CONFIGURATION.darkMode\r\n const resolvedLightMode = mergeColorModes(baseLightMode, lightMode)\r\n const resolvedDarkMode = mergeColorModes(baseDarkMode, darkMode)\r\n const resolvedTypography =\r\n mergeTypography(preset?.typography, typography) ?? preset?.typography ?? null\r\n\r\n return {\r\n theme: resolvedTheme,\r\n colorMode: resolvedMode,\r\n allowColorModeToggle: resolvedAllowToggle,\r\n borderRadius: resolvedBorderRadius,\r\n fontScale: resolvedFontScale,\r\n spacing: resolvedSpacing,\r\n animationLevel: resolvedAnimationLevel,\r\n customCSS: resolvedCustomCSS,\r\n lightMode: resolvedLightMode,\r\n darkMode: resolvedDarkMode,\r\n typography: resolvedTypography,\r\n }\r\n}\r\n\r\nfunction mergeColorModes(\r\n base?: ThemeColorConfiguration,\r\n overrides?: SiteThemeConfiguration['lightMode'],\r\n): ThemeColorConfiguration | undefined {\r\n const merged: Record<string, string> = {}\r\n\r\n if (base) {\r\n Object.entries(base).forEach(([key, value]) => {\r\n if (typeof value === 'string' && value.trim().length > 0) {\r\n merged[key] = value\r\n }\r\n })\r\n }\r\n\r\n if (overrides) {\r\n Object.entries(overrides).forEach(([key, value]) => {\r\n if (typeof value === 'string' && value.trim().length > 0) {\r\n merged[key] = value\r\n } else if (value === null) {\r\n delete merged[key]\r\n }\r\n })\r\n }\r\n\r\n return Object.keys(merged).length > 0 ? (merged as ThemeColorConfiguration) : undefined\r\n}\r\n\r\nfunction mergeTypography(\r\n base?: ThemeTypographyPreset | null,\r\n overrides?: ThemeTypographyOverride | null,\r\n): ThemeTypographyPreset | null {\r\n if (!base && !overrides) {\r\n return base ?? null\r\n }\r\n\r\n const result: ThemeTypographyPreset = {\r\n fontFamily: base?.fontFamily ?? 'var(--font-geist-sans)',\r\n headingFamily: base?.headingFamily ?? 'var(--font-geist-sans)',\r\n baseFontSize: base?.baseFontSize ?? '16px',\r\n lineHeight: base?.lineHeight ?? '1.6',\r\n fontWeights: { ...(base?.fontWeights ?? {}) },\r\n letterSpacing: { ...(base?.letterSpacing ?? {}) },\r\n }\r\n\r\n if (overrides) {\r\n const resolvedBodyFont = resolveFontSelection(\r\n overrides.bodyFont,\r\n overrides.bodyFontCustom,\r\n base?.fontFamily,\r\n )\r\n if (resolvedBodyFont) {\r\n result.fontFamily = resolvedBodyFont\r\n }\r\n\r\n const resolvedHeadingFont = resolveFontSelection(\r\n overrides.headingFont,\r\n overrides.headingFontCustom,\r\n base?.headingFamily,\r\n )\r\n if (resolvedHeadingFont) {\r\n result.headingFamily = resolvedHeadingFont\r\n }\r\n\r\n if (overrides.baseFontSize && overrides.baseFontSize !== 'preset') {\r\n result.baseFontSize = overrides.baseFontSize\r\n }\r\n\r\n if (overrides.lineHeight && overrides.lineHeight !== 'preset') {\r\n result.lineHeight = overrides.lineHeight\r\n }\r\n }\r\n\r\n return result\r\n}\r\n\r\nfunction resolveFontSelection(\r\n selection?: string | null,\r\n custom?: string | null,\r\n fallback?: string | null,\r\n): string | null {\r\n if (!selection || selection === 'preset') {\r\n return fallback ?? null\r\n }\r\n\r\n if (selection === 'custom') {\r\n const trimmed = custom?.trim()\r\n return trimmed && trimmed.length > 0 ? trimmed : (fallback ?? null)\r\n }\r\n\r\n const mapped = FONT_VALUE_TO_CSS[selection]\r\n return mapped ?? fallback ?? null\r\n}\r\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'\r\nimport { join } from 'path'\r\nimport type { ThemeDefaults } from '../providers/Theme/types.js'\r\n\r\nconst themeCriticalFiles: Record<string, string> = {\r\n cool: 'cool-critical.css',\r\n brutal: 'brutal-critical.css',\r\n neon: 'neon-critical.css',\r\n solar: 'solar-critical.css',\r\n dealership: 'dealership-critical.css',\r\n 'real-estate': 'real-estate-critical.css',\r\n 'real-estate-gold': 'real-estate-gold-critical.css',\r\n 'real-estate-neutral': 'real-estate-neutral-critical.css',\r\n}\r\n\r\nconst themeFullFiles: Record<string, string> = {\r\n cool: 'cool.css',\r\n brutal: 'brutal.css',\r\n neon: 'neon.css',\r\n solar: 'solar.css',\r\n dealership: 'dealership.css',\r\n 'real-estate': 'real-estate.css',\r\n 'real-estate-gold': 'real-estate-gold.css',\r\n 'real-estate-neutral': 'real-estate-neutral.css',\r\n}\r\n\r\nexport async function getThemeCriticalCSS(theme: ThemeDefaults): Promise<string | null> {\r\n try {\r\n const filename = themeCriticalFiles[theme]\r\n if (!filename) {\r\n console.warn(`Critical CSS file not found for theme: ${theme}`)\r\n return null\r\n }\r\n\r\n const filePath = join(process.cwd(), 'public', 'themes', filename)\r\n const css = await readFile(filePath, 'utf-8')\r\n\r\n return css.replace(/\\r\\n/g, '\\n').replace(/\\r/g, '\\n')\r\n } catch (error) {\r\n console.error(`Error reading critical CSS for theme ${theme}:`, error)\r\n return null\r\n }\r\n}\r\n\r\nexport function getThemeCSSPath(theme: ThemeDefaults): string {\r\n const filename = themeFullFiles[theme]\r\n return `/themes/${filename}`\r\n}\r\n\r\nexport function generateThemePreloadLinks(theme: ThemeDefaults): string {\r\n const cssPath = getThemeCSSPath(theme)\r\n return `<link rel=\"preload\" href=\"${cssPath}\" as=\"style\" onload=\"this.onload=null;this.rel='stylesheet'\">`\r\n}\r\n\r\nexport function createFallbackCriticalCSS(theme: ThemeDefaults): string {\r\n return `\r\n/* Fallback critical CSS for ${theme} theme */\r\n[data-theme=\"${theme}\"] {\r\n --background: hsl(0 0% 100%);\r\n --foreground: hsl(222 47% 11%);\r\n --primary: hsl(221 83% 53%);\r\n --primary-foreground: hsl(210 40% 98%);\r\n color-scheme: light;\r\n}\r\n\r\n[data-theme=\"${theme}\"][data-theme-mode=\"dark\"] {\r\n --background: hsl(222 47% 11%);\r\n --foreground: hsl(210 40% 98%);\r\n --primary: hsl(217 91% 60%);\r\n --primary-foreground: hsl(222 47% 11%);\r\n color-scheme: dark;\r\n}\r\n`.trim()\r\n}\r\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 {\r\n background?: string | null\r\n foreground?: string | null\r\n card?: string | null\r\n cardForeground?: string | null\r\n popover?: string | null\r\n popoverForeground?: string | null\r\n primary?: string | null\r\n primaryForeground?: string | null\r\n secondary?: string | null\r\n secondaryForeground?: string | null\r\n muted?: string | null\r\n mutedForeground?: string | null\r\n accent?: string | null\r\n accentForeground?: string | null\r\n destructive?: string | null\r\n destructiveForeground?: string | null\r\n border?: string | null\r\n input?: string | null\r\n ring?: string | null\r\n}\r\n\r\nexport interface ThemeColors {\r\n lightMode?: ColorMode\r\n darkMode?: ColorMode\r\n}\r\n\r\ninterface GenerateThemeColorsOptions extends ThemeColors {\r\n themeName?: string\r\n}\r\n\r\nconst COLOR_VARIABLE_MAP: Array<{ key: keyof ColorMode; variable: string }> = [\r\n { key: 'background', variable: '--background' },\r\n { key: 'foreground', variable: '--foreground' },\r\n { key: 'card', variable: '--card' },\r\n { key: 'cardForeground', variable: '--card-foreground' },\r\n { key: 'popover', variable: '--popover' },\r\n { key: 'popoverForeground', variable: '--popover-foreground' },\r\n { key: 'primary', variable: '--primary' },\r\n { key: 'primaryForeground', variable: '--primary-foreground' },\r\n { key: 'secondary', variable: '--secondary' },\r\n { key: 'secondaryForeground', variable: '--secondary-foreground' },\r\n { key: 'muted', variable: '--muted' },\r\n { key: 'mutedForeground', variable: '--muted-foreground' },\r\n { key: 'accent', variable: '--accent' },\r\n { key: 'accentForeground', variable: '--accent-foreground' },\r\n { key: 'destructive', variable: '--destructive' },\r\n { key: 'destructiveForeground', variable: '--destructive-foreground' },\r\n { key: 'border', variable: '--border' },\r\n { key: 'input', variable: '--input' },\r\n { key: 'ring', variable: '--ring' },\r\n]\r\n\r\nexport function hexToHsl(hex: string): string {\r\n if (!hex) return '0 0% 0%'\r\n\r\n hex = hex.replace('#', '')\r\n\r\n if (hex.length === 3) {\r\n hex = hex\r\n .split('')\r\n .map((char) => char + char)\r\n .join('')\r\n }\r\n\r\n const r = Number.parseInt(hex.substring(0, 2), 16) / 255\r\n const g = Number.parseInt(hex.substring(2, 4), 16) / 255\r\n const b = Number.parseInt(hex.substring(4, 6), 16) / 255\r\n\r\n const max = Math.max(r, g, b)\r\n const min = Math.min(r, g, b)\r\n let h = 0\r\n let s = 0\r\n const l = (max + min) / 2\r\n\r\n if (max !== min) {\r\n const d = max - min\r\n s = l > 0.5 ? d / (2 - max - min) : d / (max + min)\r\n\r\n switch (max) {\r\n case r:\r\n h = ((g - b) / d + (g < b ? 6 : 0)) / 6\r\n break\r\n case g:\r\n h = ((b - r) / d + 2) / 6\r\n break\r\n case b:\r\n h = ((r - g) / d + 4) / 6\r\n break\r\n }\r\n }\r\n\r\n h = Math.round(h * 360)\r\n s = Math.round(s * 100)\r\n const lRounded = Math.round(l * 100)\r\n\r\n return `${h} ${s}% ${lRounded}%`\r\n}\r\n\r\nexport function generateColorModeCss(\r\n colors: ColorMode,\r\n options: { themeName?: string; isDark?: boolean } = {},\r\n): string {\r\n if (!colors) return ''\r\n\r\n const { themeName, isDark = false } = options\r\n\r\n const cssVariables = COLOR_VARIABLE_MAP.reduce<string[]>((acc, { key, variable }) => {\r\n const value = normalizeColor(colors[key])\r\n if (!value) return acc\r\n acc.push(`${variable}: hsl(${hexToHsl(value)});`)\r\n return acc\r\n }, [])\r\n\r\n if (cssVariables.length === 0) return ''\r\n\r\n const selector = buildSelector(themeName, isDark)\r\n return `${selector} {\r\n ${cssVariables.join('\\n ')}\r\n}`\r\n}\r\n\r\nexport function generateThemeColorsCss(options: GenerateThemeColorsOptions): string {\r\n const cssBlocks: string[] = []\r\n const { themeName, lightMode, darkMode } = options\r\n\r\n if (lightMode) {\r\n const lightModeCss = generateColorModeCss(lightMode, { themeName, isDark: false })\r\n if (lightModeCss) cssBlocks.push(lightModeCss)\r\n }\r\n\r\n if (darkMode) {\r\n const darkModeCss = generateColorModeCss(darkMode, { themeName, isDark: true })\r\n if (darkModeCss) cssBlocks.push(darkModeCss)\r\n }\r\n\r\n return cssBlocks.join('\\n\\n')\r\n}\r\n\r\nfunction buildSelector(themeName: string | undefined, isDark: boolean): string {\r\n if (themeName) {\r\n if (isDark) {\r\n return `:root[data-theme='${themeName}'][data-theme-mode='dark'], .dark[data-theme='${themeName}']`\r\n }\r\n return `:root[data-theme='${themeName}']`\r\n }\r\n\r\n if (isDark) {\r\n return \":root[data-theme-mode='dark'], .dark\"\r\n }\r\n\r\n return ':root'\r\n}\r\n\r\nfunction normalizeColor(value: string | null | undefined): string | null {\r\n if (typeof value !== 'string') return null\r\n const trimmed = value.trim()\r\n return trimmed.length === 0 ? null : trimmed\r\n}\r\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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"}
|
|
@@ -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"}
|