@kilivi/payloadcms-theme-management 0.1.3 → 0.1.5
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.js → ServerThemeInjector.jsx} +9 -6
- package/dist/components/ServerThemeInjector.jsx.map +1 -0
- package/dist/components/ThemePreview.d.ts +2 -1
- package/dist/components/ThemePreview.d.ts.map +1 -1
- package/dist/components/ThemePreview.jsx +231 -0
- package/dist/components/ThemePreview.jsx.map +1 -0
- package/dist/fields/ColorPickerField.d.ts +1 -1
- package/dist/fields/ColorPickerField.d.ts.map +1 -1
- package/dist/fields/ColorPickerField.jsx +205 -0
- package/dist/fields/ColorPickerField.jsx.map +1 -0
- package/dist/fields/RadiusField.d.ts +1 -1
- package/dist/fields/RadiusField.d.ts.map +1 -1
- package/dist/fields/RadiusField.jsx +123 -0
- package/dist/fields/RadiusField.jsx.map +1 -0
- package/dist/fields/ThemeColorPickerField.css +138 -0
- package/dist/fields/ThemeColorPickerField.d.ts +1 -1
- package/dist/fields/ThemeColorPickerField.d.ts.map +1 -1
- package/dist/fields/ThemeColorPickerField.jsx +110 -0
- package/dist/fields/ThemeColorPickerField.jsx.map +1 -0
- package/dist/fields/ThemePreviewField.d.ts +1 -1
- package/dist/fields/ThemePreviewField.d.ts.map +1 -1
- package/dist/fields/ThemePreviewField.jsx +420 -0
- package/dist/fields/ThemePreviewField.jsx.map +1 -0
- package/dist/fields/ThemeTokenSelectField.d.ts +1 -1
- package/dist/fields/ThemeTokenSelectField.d.ts.map +1 -1
- package/dist/fields/{ThemeTokenSelectField.js → ThemeTokenSelectField.jsx} +53 -30
- package/dist/fields/{ThemeTokenSelectField.js.map → ThemeTokenSelectField.jsx.map} +1 -1
- package/dist/providers/Theme/{index.js → index.jsx} +3 -4
- package/dist/providers/Theme/index.jsx.map +1 -0
- package/package.json +8 -4
- package/dist/components/ServerThemeInjector.js.map +0 -1
- package/dist/components/ThemePreview.js +0 -153
- package/dist/components/ThemePreview.js.map +0 -1
- package/dist/fields/ColorPickerField.js +0 -153
- package/dist/fields/ColorPickerField.js.map +0 -1
- package/dist/fields/RadiusField.js +0 -91
- package/dist/fields/RadiusField.js.map +0 -1
- package/dist/fields/ThemeColorPickerField.js +0 -84
- package/dist/fields/ThemeColorPickerField.js.map +0 -1
- package/dist/fields/ThemePreviewField.js +0 -336
- package/dist/fields/ThemePreviewField.js.map +0 -1
- package/dist/providers/Theme/index.js.map +0 -1
|
@@ -0,0 +1,420 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { useField, useForm, useFormFields } from '@payloadcms/ui';
|
|
3
|
+
import { useCallback, useEffect, useMemo, useRef } from 'react';
|
|
4
|
+
import { borderRadiusPresets } from '@/providers/Theme/themeConfig';
|
|
5
|
+
import { resolveTypographyPreview } from '../components/typographyPreviewUtils';
|
|
6
|
+
import { defaultThemePresets } from '../index';
|
|
7
|
+
import { darkModeDefaults, lightModeDefaults } from './colorModeFields';
|
|
8
|
+
const FALLBACK_THEME = defaultThemePresets[0]?.name ?? 'cool';
|
|
9
|
+
const themePresets = defaultThemePresets.reduce((acc, preset) => {
|
|
10
|
+
acc[preset.name] = {
|
|
11
|
+
label: preset.label,
|
|
12
|
+
lightMode: { ...lightModeDefaults, ...(preset.lightMode ?? {}) },
|
|
13
|
+
darkMode: { ...darkModeDefaults, ...(preset.darkMode ?? {}) },
|
|
14
|
+
typography: preset.typography,
|
|
15
|
+
borderRadius: preset.borderRadius,
|
|
16
|
+
};
|
|
17
|
+
return acc;
|
|
18
|
+
}, {});
|
|
19
|
+
const colorKeys = Object.keys(lightModeDefaults);
|
|
20
|
+
function ModePreview({ icon, title, colors, typography, radius }) {
|
|
21
|
+
const background = colors.background ?? '#ffffff';
|
|
22
|
+
const foreground = colors.foreground ?? '#0a0a0a';
|
|
23
|
+
const borderColor = colors.border ?? 'rgba(148, 163, 184, 0.35)';
|
|
24
|
+
const cardBackground = colors.card ?? background;
|
|
25
|
+
const cardForeground = colors.cardForeground ?? foreground;
|
|
26
|
+
const primary = colors.primary ?? foreground;
|
|
27
|
+
const primaryForeground = colors.primaryForeground ?? background;
|
|
28
|
+
const secondary = colors.secondary ?? '#f4f4f5';
|
|
29
|
+
const secondaryForeground = colors.secondaryForeground ?? foreground;
|
|
30
|
+
const muted = colors.muted ?? secondary;
|
|
31
|
+
const mutedForeground = colors.mutedForeground ?? secondaryForeground;
|
|
32
|
+
const accent = colors.accent ?? secondary;
|
|
33
|
+
const accentForeground = colors.accentForeground ?? secondaryForeground;
|
|
34
|
+
const headingFont = typography.headingFont;
|
|
35
|
+
const bodyFont = typography.bodyFont;
|
|
36
|
+
const baseFontSize = typography.baseFontSize;
|
|
37
|
+
const lineHeight = typography.lineHeight;
|
|
38
|
+
return (<div style={{
|
|
39
|
+
display: 'grid',
|
|
40
|
+
gap: '16px',
|
|
41
|
+
padding: '18px',
|
|
42
|
+
borderRadius: '12px',
|
|
43
|
+
backgroundColor: background,
|
|
44
|
+
color: foreground,
|
|
45
|
+
border: `1px solid ${borderColor}`,
|
|
46
|
+
boxShadow: '0 8px 20px rgba(15, 23, 42, 0.08)',
|
|
47
|
+
fontFamily: bodyFont,
|
|
48
|
+
}}>
|
|
49
|
+
<div style={{
|
|
50
|
+
display: 'flex',
|
|
51
|
+
alignItems: 'center',
|
|
52
|
+
justifyContent: 'space-between',
|
|
53
|
+
fontSize: '12px',
|
|
54
|
+
fontWeight: 600,
|
|
55
|
+
letterSpacing: '0.08em',
|
|
56
|
+
textTransform: 'uppercase',
|
|
57
|
+
opacity: 0.7,
|
|
58
|
+
}}>
|
|
59
|
+
<span>
|
|
60
|
+
{icon} {title}
|
|
61
|
+
</span>
|
|
62
|
+
<span style={{ fontFamily: 'monospace', fontSize: '11px' }}>
|
|
63
|
+
{background.toUpperCase()}
|
|
64
|
+
</span>
|
|
65
|
+
</div>
|
|
66
|
+
|
|
67
|
+
<div style={{
|
|
68
|
+
backgroundColor: cardBackground,
|
|
69
|
+
color: cardForeground,
|
|
70
|
+
borderRadius: radius.card,
|
|
71
|
+
border: `1px solid ${borderColor}`,
|
|
72
|
+
padding: '16px',
|
|
73
|
+
display: 'flex',
|
|
74
|
+
gap: '12px',
|
|
75
|
+
flexWrap: 'wrap',
|
|
76
|
+
}}>
|
|
77
|
+
<button type="button" style={{
|
|
78
|
+
padding: '10px 18px',
|
|
79
|
+
borderRadius: radius.pill,
|
|
80
|
+
border: 'none',
|
|
81
|
+
cursor: 'pointer',
|
|
82
|
+
fontSize: '12px',
|
|
83
|
+
fontWeight: 600,
|
|
84
|
+
letterSpacing: '0.02em',
|
|
85
|
+
backgroundColor: primary,
|
|
86
|
+
color: primaryForeground,
|
|
87
|
+
boxShadow: '0 6px 14px rgba(15, 23, 42, 0.15)',
|
|
88
|
+
}}>
|
|
89
|
+
Primary Action
|
|
90
|
+
</button>
|
|
91
|
+
<button type="button" style={{
|
|
92
|
+
padding: '10px 18px',
|
|
93
|
+
borderRadius: radius.chip,
|
|
94
|
+
border: '1px solid transparent',
|
|
95
|
+
cursor: 'pointer',
|
|
96
|
+
fontSize: '12px',
|
|
97
|
+
fontWeight: 600,
|
|
98
|
+
letterSpacing: '0.02em',
|
|
99
|
+
backgroundColor: secondary,
|
|
100
|
+
color: secondaryForeground,
|
|
101
|
+
boxShadow: 'inset 0 0 0 1px rgba(15, 23, 42, 0.08)',
|
|
102
|
+
}}>
|
|
103
|
+
Secondary
|
|
104
|
+
</button>
|
|
105
|
+
</div>
|
|
106
|
+
|
|
107
|
+
<div style={{
|
|
108
|
+
display: 'grid',
|
|
109
|
+
gridTemplateColumns: 'repeat(auto-fit, minmax(120px, 1fr))',
|
|
110
|
+
gap: '10px',
|
|
111
|
+
}}>
|
|
112
|
+
<div style={{
|
|
113
|
+
borderRadius: radius.chip,
|
|
114
|
+
padding: '10px 12px',
|
|
115
|
+
fontSize: '12px',
|
|
116
|
+
fontWeight: 500,
|
|
117
|
+
backgroundColor: muted,
|
|
118
|
+
color: mutedForeground,
|
|
119
|
+
}}>
|
|
120
|
+
Muted Card
|
|
121
|
+
</div>
|
|
122
|
+
<div style={{
|
|
123
|
+
borderRadius: radius.chip,
|
|
124
|
+
padding: '10px 12px',
|
|
125
|
+
fontSize: '12px',
|
|
126
|
+
fontWeight: 500,
|
|
127
|
+
backgroundColor: accent,
|
|
128
|
+
color: accentForeground,
|
|
129
|
+
}}>
|
|
130
|
+
Accent Tag
|
|
131
|
+
</div>
|
|
132
|
+
</div>
|
|
133
|
+
|
|
134
|
+
<div style={{
|
|
135
|
+
display: 'grid',
|
|
136
|
+
gap: '8px',
|
|
137
|
+
borderRadius: '10px',
|
|
138
|
+
border: `1px dashed ${borderColor}`,
|
|
139
|
+
padding: '14px',
|
|
140
|
+
backgroundColor: 'rgba(148, 163, 184, 0.08)',
|
|
141
|
+
}}>
|
|
142
|
+
<div style={{
|
|
143
|
+
fontFamily: headingFont,
|
|
144
|
+
fontSize: 'clamp(24px, 3vw, 32px)',
|
|
145
|
+
fontWeight: 600,
|
|
146
|
+
lineHeight: 1.2,
|
|
147
|
+
}}>
|
|
148
|
+
Nadpis / Heading preview
|
|
149
|
+
</div>
|
|
150
|
+
<p style={{
|
|
151
|
+
margin: 0,
|
|
152
|
+
fontFamily: bodyFont,
|
|
153
|
+
fontSize: baseFontSize,
|
|
154
|
+
lineHeight,
|
|
155
|
+
color: foreground,
|
|
156
|
+
opacity: 0.85,
|
|
157
|
+
}}>
|
|
158
|
+
Sphinx of black quartz, judge my vow. Příliš žluťoučký kůň úpěl ďábelské ódy.
|
|
159
|
+
</p>
|
|
160
|
+
<div style={{
|
|
161
|
+
display: 'flex',
|
|
162
|
+
flexWrap: 'wrap',
|
|
163
|
+
gap: '10px',
|
|
164
|
+
fontSize: '11px',
|
|
165
|
+
color: 'rgba(15, 23, 42, 0.7)',
|
|
166
|
+
}}>
|
|
167
|
+
<span>Body: {typography.bodyLabel}</span>
|
|
168
|
+
<span>Heading: {typography.headingLabel}</span>
|
|
169
|
+
<span>Base size: {baseFontSize}</span>
|
|
170
|
+
<span>Line height: {lineHeight}</span>
|
|
171
|
+
</div>
|
|
172
|
+
</div>
|
|
173
|
+
</div>);
|
|
174
|
+
}
|
|
175
|
+
export default function ThemePreviewField(props) {
|
|
176
|
+
const { field, path } = props;
|
|
177
|
+
const { value: selectedTheme, setValue } = useField({ path });
|
|
178
|
+
const { dispatchFields } = useForm();
|
|
179
|
+
const formFields = useFormFields(([formState]) => formState);
|
|
180
|
+
const hasAppliedInitialPresetRef = useRef(false);
|
|
181
|
+
const applyPreset = useCallback((presetName) => {
|
|
182
|
+
const preset = themePresets[presetName];
|
|
183
|
+
if (!preset) {
|
|
184
|
+
return;
|
|
185
|
+
}
|
|
186
|
+
colorKeys.forEach((key) => {
|
|
187
|
+
const lightValue = preset.lightMode[key];
|
|
188
|
+
const darkValue = preset.darkMode[key];
|
|
189
|
+
if (lightValue) {
|
|
190
|
+
dispatchFields({
|
|
191
|
+
type: 'UPDATE',
|
|
192
|
+
path: `themeConfiguration.lightMode.${key}`,
|
|
193
|
+
value: lightValue,
|
|
194
|
+
});
|
|
195
|
+
}
|
|
196
|
+
if (darkValue) {
|
|
197
|
+
dispatchFields({
|
|
198
|
+
type: 'UPDATE',
|
|
199
|
+
path: `themeConfiguration.darkMode.${key}`,
|
|
200
|
+
value: darkValue,
|
|
201
|
+
});
|
|
202
|
+
}
|
|
203
|
+
});
|
|
204
|
+
}, [dispatchFields]);
|
|
205
|
+
const handleThemeChange = useCallback((event) => {
|
|
206
|
+
const value = event.target.value;
|
|
207
|
+
setValue(value);
|
|
208
|
+
if (!value) {
|
|
209
|
+
return;
|
|
210
|
+
}
|
|
211
|
+
hasAppliedInitialPresetRef.current = true;
|
|
212
|
+
applyPreset(value);
|
|
213
|
+
}, [applyPreset, setValue]);
|
|
214
|
+
useEffect(() => {
|
|
215
|
+
if (!selectedTheme) {
|
|
216
|
+
return;
|
|
217
|
+
}
|
|
218
|
+
if (themePresets[selectedTheme]) {
|
|
219
|
+
return;
|
|
220
|
+
}
|
|
221
|
+
hasAppliedInitialPresetRef.current = false;
|
|
222
|
+
setValue(FALLBACK_THEME);
|
|
223
|
+
}, [selectedTheme, setValue]);
|
|
224
|
+
useEffect(() => {
|
|
225
|
+
if (hasAppliedInitialPresetRef.current) {
|
|
226
|
+
return;
|
|
227
|
+
}
|
|
228
|
+
if (!selectedTheme) {
|
|
229
|
+
return;
|
|
230
|
+
}
|
|
231
|
+
if (!formFields) {
|
|
232
|
+
return;
|
|
233
|
+
}
|
|
234
|
+
const preset = themePresets[selectedTheme];
|
|
235
|
+
if (!preset) {
|
|
236
|
+
hasAppliedInitialPresetRef.current = true;
|
|
237
|
+
return;
|
|
238
|
+
}
|
|
239
|
+
const hasExistingValues = colorKeys.some((key) => {
|
|
240
|
+
const lightField = formFields[`themeConfiguration.lightMode.${key}`];
|
|
241
|
+
const darkField = formFields[`themeConfiguration.darkMode.${key}`];
|
|
242
|
+
const lightValue = typeof lightField?.value === 'string' && lightField.value.trim().length > 0;
|
|
243
|
+
const darkValue = typeof darkField?.value === 'string' && darkField.value.trim().length > 0;
|
|
244
|
+
return lightValue || darkValue;
|
|
245
|
+
});
|
|
246
|
+
if (hasExistingValues) {
|
|
247
|
+
hasAppliedInitialPresetRef.current = true;
|
|
248
|
+
return;
|
|
249
|
+
}
|
|
250
|
+
applyPreset(selectedTheme);
|
|
251
|
+
hasAppliedInitialPresetRef.current = true;
|
|
252
|
+
}, [selectedTheme, formFields, applyPreset]);
|
|
253
|
+
const lightModeColors = useMemo(() => {
|
|
254
|
+
const presetLightMode = selectedTheme ? themePresets[selectedTheme]?.lightMode : undefined;
|
|
255
|
+
return colorKeys.reduce((acc, key) => {
|
|
256
|
+
const fieldState = formFields?.[`themeConfiguration.lightMode.${key}`];
|
|
257
|
+
const rawValue = typeof fieldState?.value === 'string' && fieldState.value.trim().length > 0
|
|
258
|
+
? fieldState.value
|
|
259
|
+
: undefined;
|
|
260
|
+
acc[key] = rawValue ?? presetLightMode?.[key] ?? lightModeDefaults[key];
|
|
261
|
+
return acc;
|
|
262
|
+
}, {});
|
|
263
|
+
}, [formFields, selectedTheme]);
|
|
264
|
+
const darkModeColors = useMemo(() => {
|
|
265
|
+
const presetDarkMode = selectedTheme ? themePresets[selectedTheme]?.darkMode : undefined;
|
|
266
|
+
return colorKeys.reduce((acc, key) => {
|
|
267
|
+
const fieldState = formFields?.[`themeConfiguration.darkMode.${key}`];
|
|
268
|
+
const rawValue = typeof fieldState?.value === 'string' && fieldState.value.trim().length > 0
|
|
269
|
+
? fieldState.value
|
|
270
|
+
: undefined;
|
|
271
|
+
acc[key] = rawValue ?? presetDarkMode?.[key] ?? darkModeDefaults[key];
|
|
272
|
+
return acc;
|
|
273
|
+
}, {});
|
|
274
|
+
}, [formFields, selectedTheme]);
|
|
275
|
+
const activePreset = selectedTheme ? themePresets[selectedTheme] : undefined;
|
|
276
|
+
const formTypographySelection = useMemo(() => {
|
|
277
|
+
if (!formFields) {
|
|
278
|
+
return null;
|
|
279
|
+
}
|
|
280
|
+
const getValue = (key) => formFields[`themeConfiguration.typography.${key}`]?.value;
|
|
281
|
+
return {
|
|
282
|
+
bodyFont: getValue('bodyFont') ?? undefined,
|
|
283
|
+
headingFont: getValue('headingFont') ?? undefined,
|
|
284
|
+
bodyFontCustom: getValue('bodyFontCustom') ?? undefined,
|
|
285
|
+
headingFontCustom: getValue('headingFontCustom') ?? undefined,
|
|
286
|
+
baseFontSize: getValue('baseFontSize') ?? undefined,
|
|
287
|
+
lineHeight: getValue('lineHeight') ?? undefined,
|
|
288
|
+
};
|
|
289
|
+
}, [formFields]);
|
|
290
|
+
const previewTypography = useMemo(() => {
|
|
291
|
+
return resolveTypographyPreview(formTypographySelection, selectedTheme);
|
|
292
|
+
}, [formTypographySelection, selectedTheme]);
|
|
293
|
+
const borderRadiusValue = formFields?.['themeConfiguration.borderRadius']?.value;
|
|
294
|
+
const presetRadius = activePreset?.borderRadius ?? 'medium';
|
|
295
|
+
const resolvedBorderRadius = (typeof borderRadiusValue === 'string' && borderRadiusValue.length
|
|
296
|
+
? borderRadiusValue
|
|
297
|
+
: presetRadius);
|
|
298
|
+
const borderRadiusPreset = borderRadiusPresets[resolvedBorderRadius] ?? borderRadiusPresets.medium;
|
|
299
|
+
const borderRadiusCSS = typeof borderRadiusPreset.css === 'string'
|
|
300
|
+
? { '--radius-default': borderRadiusPreset.css }
|
|
301
|
+
: borderRadiusPreset.css;
|
|
302
|
+
const previewRadius = {
|
|
303
|
+
card: borderRadiusCSS['--radius-large'] ?? '1rem',
|
|
304
|
+
chip: borderRadiusCSS['--radius-default'] ?? '0.75rem',
|
|
305
|
+
pill: borderRadiusCSS['--radius-xl'] ?? borderRadiusCSS['--radius-large'] ?? '999px',
|
|
306
|
+
};
|
|
307
|
+
const fieldLabel = typeof field.label === 'string' ? field.label : field.label?.en || field.label?.cs || 'Theme';
|
|
308
|
+
return (<div style={{ marginBottom: '24px' }}>
|
|
309
|
+
<label style={{
|
|
310
|
+
display: 'block',
|
|
311
|
+
marginBottom: '10px',
|
|
312
|
+
fontSize: '13px',
|
|
313
|
+
fontWeight: 600,
|
|
314
|
+
color: 'var(--theme-elevation-800)',
|
|
315
|
+
}}>
|
|
316
|
+
{fieldLabel}
|
|
317
|
+
</label>
|
|
318
|
+
|
|
319
|
+
<div style={{
|
|
320
|
+
display: 'flex',
|
|
321
|
+
flexWrap: 'wrap',
|
|
322
|
+
gap: '24px',
|
|
323
|
+
alignItems: 'flex-start',
|
|
324
|
+
}}>
|
|
325
|
+
<div style={{
|
|
326
|
+
flex: '0 0 320px',
|
|
327
|
+
minWidth: '260px',
|
|
328
|
+
maxWidth: '420px',
|
|
329
|
+
display: 'grid',
|
|
330
|
+
gap: '12px',
|
|
331
|
+
}}>
|
|
332
|
+
<select value={selectedTheme || ''} onChange={handleThemeChange} style={{
|
|
333
|
+
width: '100%',
|
|
334
|
+
padding: '12px 14px',
|
|
335
|
+
fontSize: '14px',
|
|
336
|
+
borderRadius: '8px',
|
|
337
|
+
border: '1px solid var(--theme-elevation-250)',
|
|
338
|
+
backgroundColor: 'var(--theme-input-bg)',
|
|
339
|
+
color: 'var(--theme-elevation-800)',
|
|
340
|
+
cursor: 'pointer',
|
|
341
|
+
}}>
|
|
342
|
+
<option value="">Select a theme…</option>
|
|
343
|
+
{Object.entries(themePresets).map(([key, preset]) => (<option key={key} value={key}>
|
|
344
|
+
{preset.label}
|
|
345
|
+
</option>))}
|
|
346
|
+
</select>
|
|
347
|
+
|
|
348
|
+
{activePreset && (<div style={{
|
|
349
|
+
padding: '12px',
|
|
350
|
+
borderRadius: '10px',
|
|
351
|
+
border: '1px solid var(--theme-elevation-200)',
|
|
352
|
+
backgroundColor: 'var(--theme-elevation-50)',
|
|
353
|
+
display: 'grid',
|
|
354
|
+
gap: '6px',
|
|
355
|
+
fontSize: '12px',
|
|
356
|
+
color: 'var(--theme-elevation-600)',
|
|
357
|
+
}}>
|
|
358
|
+
<div style={{ fontWeight: 600, color: 'var(--theme-elevation-800)' }}>
|
|
359
|
+
{activePreset.label}
|
|
360
|
+
</div>
|
|
361
|
+
<div>Primary color: {activePreset.lightMode.primary}</div>
|
|
362
|
+
<div>Accent color: {activePreset.lightMode.accent}</div>
|
|
363
|
+
</div>)}
|
|
364
|
+
|
|
365
|
+
{field.admin?.description && (<div style={{
|
|
366
|
+
fontSize: '12px',
|
|
367
|
+
color: 'var(--theme-elevation-600)',
|
|
368
|
+
lineHeight: 1.5,
|
|
369
|
+
}}>
|
|
370
|
+
{typeof field.admin.description === 'string'
|
|
371
|
+
? field.admin.description
|
|
372
|
+
: field.admin.description?.en || field.admin.description?.cs || ''}
|
|
373
|
+
</div>)}
|
|
374
|
+
</div>
|
|
375
|
+
|
|
376
|
+
<div style={{
|
|
377
|
+
flex: '1 1 420px',
|
|
378
|
+
minWidth: '320px',
|
|
379
|
+
position: 'sticky',
|
|
380
|
+
top: '96px',
|
|
381
|
+
alignSelf: 'flex-start',
|
|
382
|
+
}}>
|
|
383
|
+
<div style={{
|
|
384
|
+
width: '100%',
|
|
385
|
+
borderRadius: '16px',
|
|
386
|
+
border: '1px solid var(--theme-elevation-200)',
|
|
387
|
+
backgroundColor: 'var(--theme-elevation-25)',
|
|
388
|
+
padding: '20px',
|
|
389
|
+
display: 'grid',
|
|
390
|
+
gap: '18px',
|
|
391
|
+
maxHeight: 'calc(100vh - 140px)',
|
|
392
|
+
overflowY: 'auto',
|
|
393
|
+
}}>
|
|
394
|
+
<div style={{
|
|
395
|
+
display: 'flex',
|
|
396
|
+
alignItems: 'center',
|
|
397
|
+
justifyContent: 'space-between',
|
|
398
|
+
fontWeight: 600,
|
|
399
|
+
fontSize: '13px',
|
|
400
|
+
color: 'var(--theme-elevation-800)',
|
|
401
|
+
}}>
|
|
402
|
+
<span>🎨 Live Preview</span>
|
|
403
|
+
<span style={{ fontSize: '12px', color: 'var(--theme-elevation-600)' }}>
|
|
404
|
+
{activePreset ? activePreset.label : 'Custom palette'}
|
|
405
|
+
</span>
|
|
406
|
+
</div>
|
|
407
|
+
|
|
408
|
+
<div style={{
|
|
409
|
+
display: 'grid',
|
|
410
|
+
gap: '16px',
|
|
411
|
+
}}>
|
|
412
|
+
<ModePreview icon="☀️" title="Light Mode" colors={lightModeColors} typography={previewTypography} radius={previewRadius}/>
|
|
413
|
+
<ModePreview icon="🌙" title="Dark Mode" colors={darkModeColors} typography={previewTypography} radius={previewRadius}/>
|
|
414
|
+
</div>
|
|
415
|
+
</div>
|
|
416
|
+
</div>
|
|
417
|
+
</div>
|
|
418
|
+
</div>);
|
|
419
|
+
}
|
|
420
|
+
//# sourceMappingURL=ThemePreviewField.jsx.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ThemePreviewField.jsx","sourceRoot":"","sources":["../../src/fields/ThemePreviewField.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { SelectFieldClientProps } from 'payload';
|
|
2
|
-
export default function ThemeTokenSelectField(props: SelectFieldClientProps): import("react
|
|
2
|
+
export default function ThemeTokenSelectField(props: SelectFieldClientProps): import("react").JSX.Element;
|
|
3
3
|
//# sourceMappingURL=ThemeTokenSelectField.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ThemeTokenSelectField.d.ts","sourceRoot":"","sources":["../../src/fields/ThemeTokenSelectField.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAA;AAkFrD,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,KAAK,EAAE,sBAAsB
|
|
1
|
+
{"version":3,"file":"ThemeTokenSelectField.d.ts","sourceRoot":"","sources":["../../src/fields/ThemeTokenSelectField.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAA;AAkFrD,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,KAAK,EAAE,sBAAsB,+BA8H1E"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
2
|
import { useField } from '@payloadcms/ui';
|
|
4
3
|
import { useCallback, useEffect, useState } from 'react';
|
|
5
4
|
import { defaultThemePresets } from '../presets';
|
|
@@ -95,34 +94,58 @@ export default function ThemeTokenSelectField(props) {
|
|
|
95
94
|
typeof field.admin.description.en === 'string') {
|
|
96
95
|
description = field.admin.description.en;
|
|
97
96
|
}
|
|
98
|
-
return (
|
|
99
|
-
|
|
100
|
-
|
|
97
|
+
return (<div className="field-type theme-token-select">
|
|
98
|
+
{label && (<label className="field-label" htmlFor={path} style={{ display: 'block', marginBottom: '8px' }}>
|
|
99
|
+
{label}
|
|
100
|
+
{field.required && <span className="required">*</span>}
|
|
101
|
+
</label>)}
|
|
102
|
+
|
|
103
|
+
{description && (<div className="field-description" style={{ marginBottom: '12px', fontSize: '13px', color: 'var(--theme-elevation-500)' }}>
|
|
104
|
+
{description}
|
|
105
|
+
</div>)}
|
|
106
|
+
|
|
107
|
+
<div className="token-grid" style={{
|
|
108
|
+
display: 'grid',
|
|
109
|
+
gridTemplateColumns: 'repeat(auto-fill, minmax(140px, 1fr))',
|
|
110
|
+
gap: '10px',
|
|
111
|
+
}}>
|
|
112
|
+
{options.map((option) => {
|
|
113
|
+
const isActive = option.value === selectedValue;
|
|
114
|
+
return (<button type="button" key={option.value} onClick={() => handleSelect(option.value)} style={{
|
|
115
|
+
display: 'flex',
|
|
116
|
+
alignItems: 'center',
|
|
101
117
|
gap: '10px',
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
118
|
+
padding: '10px 12px',
|
|
119
|
+
borderRadius: '10px',
|
|
120
|
+
border: isActive
|
|
121
|
+
? '2px solid var(--theme-primary-500)'
|
|
122
|
+
: '1px solid var(--theme-elevation-150)',
|
|
123
|
+
backgroundColor: 'var(--theme-elevation-0)',
|
|
124
|
+
boxShadow: isActive
|
|
125
|
+
? '0 10px 20px -10px rgba(59, 130, 246, 0.4)'
|
|
126
|
+
: '0 1px 2px rgba(15, 23, 42, 0.08)',
|
|
127
|
+
cursor: 'pointer',
|
|
128
|
+
transition: 'border-color 0.2s ease, box-shadow 0.2s ease',
|
|
129
|
+
}}>
|
|
130
|
+
<span aria-hidden style={{
|
|
131
|
+
width: '32px',
|
|
132
|
+
height: '32px',
|
|
133
|
+
borderRadius: '8px',
|
|
134
|
+
border: '1px solid rgba(15, 23, 42, 0.08)',
|
|
135
|
+
background: option.color,
|
|
136
|
+
}}/>
|
|
137
|
+
<span style={{ fontSize: '13px', fontWeight: 600, color: 'var(--theme-elevation-800)' }}>
|
|
138
|
+
{option.label}
|
|
139
|
+
</span>
|
|
140
|
+
</button>);
|
|
141
|
+
})}
|
|
142
|
+
</div>
|
|
143
|
+
|
|
144
|
+
<select id={path} value={selectedValue} onChange={(event) => handleSelect(event.target.value)} style={{ display: 'none' }}>
|
|
145
|
+
{options.map((option) => (<option key={option.value} value={option.value}>
|
|
146
|
+
{option.label}
|
|
147
|
+
</option>))}
|
|
148
|
+
</select>
|
|
149
|
+
</div>);
|
|
127
150
|
}
|
|
128
|
-
//# sourceMappingURL=ThemeTokenSelectField.
|
|
151
|
+
//# sourceMappingURL=ThemeTokenSelectField.jsx.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ThemeTokenSelectField.
|
|
1
|
+
{"version":3,"file":"ThemeTokenSelectField.jsx","sourceRoot":"","sources":["../../src/fields/ThemeTokenSelectField.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;AAEZ,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AAEzC,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACxD,OAAO,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAA;AAChD,OAAO,EAAE,yBAAyB,EAAE,MAAM,oCAAoC,CAAA;AAS9E,MAAM,eAAe,GAAuB;IAC1C,EAAE,KAAK,EAAE,YAAY,EAAE,KAAK,EAAE,kBAAkB,EAAE,KAAK,EAAE,mBAAmB,EAAE;IAC9E,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,aAAa,EAAE;IACjE,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,eAAe,EAAE,KAAK,EAAE,cAAc,EAAE;IACjE,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,gBAAgB,EAAE,KAAK,EAAE,eAAe,EAAE;IACpE,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,mBAAmB,EAAE,KAAK,EAAE,kBAAkB,EAAE;IAC7E,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,gBAAgB,EAAE;CACxE,CAAA;AAED,KAAK,UAAU,uBAAuB;IACpC,IAAI,CAAC;QACH,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,oBAAoB,CAAC,CAAA;QAClD,IAAI,CAAC,QAAQ,CAAC,EAAE,EAAE,CAAC;YACjB,OAAO,IAAI,CAAA;QACb,CAAC;QACD,MAAM,IAAI,GAAG,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAA;QAClC,OAAO,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,kBAAkB,IAAI,IAAI,CAAA;IACpD,CAAC;IAAC,OAAO,KAAK,EAAE,CAAC;QACf,OAAO,CAAC,IAAI,CAAC,8DAA8D,EAAE,KAAK,CAAC,CAAA;QACnF,OAAO,IAAI,CAAA;IACb,CAAC;AACH,CAAC;AAED,SAAS,6BAA6B,CAAC,aAA6C;IAClF,IAAI,CAAC,aAAa,EAAE,CAAC;QACnB,OAAO,eAAe,CAAA;IACxB,CAAC;IAED,MAAM,QAAQ,GAAG,yBAAyB,CAAC,aAAa,CAAC,CAAA;IACzD,MAAM,SAAS,GAAG,QAAQ,CAAC,SAAS,IAAI,mBAAmB,CAAC,CAAC,CAAC,EAAE,SAAS,IAAI,EAAE,CAAA;IAC/E,MAAM,WAAW,GAAa;QAC5B,YAAY;QACZ,MAAM;QACN,OAAO;QACP,QAAQ;QACR,WAAW;QACX,SAAS;QACT,SAAS;KACV,CAAA;IAED,MAAM,cAAc,GAAG,SAAsD,CAAA;IAE7E,MAAM,MAAM,GAAG,WAAW;SACvB,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE;QACX,MAAM,KAAK,GAAG,cAAc,EAAE,CAAC,GAAG,CAAC,CAAA;QACnC,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,CAAC,IAAI,EAAE,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;YAC3D,OAAO,IAAI,CAAA;QACb,CAAC;QAED,MAAM,QAAQ,GAA2B;YACvC,UAAU,EAAE,kBAAkB;YAC9B,IAAI,EAAE,iBAAiB;YACvB,KAAK,EAAE,eAAe;YACtB,MAAM,EAAE,gBAAgB;YACxB,SAAS,EAAE,mBAAmB;YAC9B,OAAO,EAAE,iBAAiB;YAC1B,OAAO,EAAE,iBAAiB;SAC3B,CAAA;QAED,OAAO;YACL,KAAK,EAAE,GAAG;YACV,KAAK,EAAE,QAAQ,CAAC,GAAG,CAAC,IAAI,GAAG;YAC3B,KAAK,EAAE,KAAK;SACb,CAAA;IACH,CAAC,CAAC;SACD,MAAM,CAAC,CAAC,KAAK,EAA6B,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAA;IAE/D,OAAO,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,eAAe,CAAA;AACrD,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,KAA6B;IACzE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,KAAK,CAAA;IAC7B,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,QAAQ,CAAS,EAAE,IAAI,EAAE,CAAC,CAAA;IACtD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAqB,eAAe,CAAC,CAAA;IAC3E,MAAM,aAAa,GAAG,KAAK,IAAI,YAAY,CAAA;IAE3C,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,SAAS,GAAG,IAAI,CAAA;QAEpB,uBAAuB,EAAE,CAAC,IAAI,CAAC,CAAC,aAAa,EAAE,EAAE;YAC/C,IAAI,CAAC,SAAS;gBAAE,OAAM;YACtB,UAAU,CAAC,6BAA6B,CAAC,aAAa,CAAC,CAAC,CAAA;QAC1D,CAAC,CAAC,CAAA;QAEF,OAAO,GAAG,EAAE;YACV,SAAS,GAAG,KAAK,CAAA;QACnB,CAAC,CAAA;IACH,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,MAAM,YAAY,GAAG,WAAW,CAC9B,CAAC,SAAiB,EAAE,EAAE;QACpB,QAAQ,CAAC,SAAS,CAAC,CAAA;IACrB,CAAC,EACD,CAAC,QAAQ,CAAC,CACX,CAAA;IAED,MAAM,KAAK,GAAG,OAAO,KAAK,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAA;IAChE,IAAI,WAAW,GAAG,EAAE,CAAA;IACpB,IAAI,OAAO,KAAK,CAAC,KAAK,EAAE,WAAW,KAAK,QAAQ,EAAE,CAAC;QACjD,WAAW,GAAG,KAAK,CAAC,KAAK,CAAC,WAAW,CAAA;IACvC,CAAC;SAAM,IACL,KAAK,CAAC,KAAK,EAAE,WAAW;QACxB,OAAO,KAAK,CAAC,KAAK,CAAC,WAAW,KAAK,QAAQ;QAC3C,OAAO,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,EAAE,KAAK,QAAQ,EAC9C,CAAC;QACD,WAAW,GAAG,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,EAAE,CAAA;IAC1C,CAAC;IAED,OAAO,CACL,CAAC,GAAG,CAAC,SAAS,CAAC,+BAA+B,CAC5C;MAAA,CAAC,KAAK,IAAI,CACR,CAAC,KAAK,CACJ,SAAS,CAAC,aAAa,CACvB,OAAO,CAAC,CAAC,IAAI,CAAC,CACd,KAAK,CAAC,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,YAAY,EAAE,KAAK,EAAE,CAAC,CAEjD;UAAA,CAAC,KAAK,CACN;UAAA,CAAC,KAAK,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,EAAE,IAAI,CAAC,CACxD;QAAA,EAAE,KAAK,CAAC,CACT,CAED;;MAAA,CAAC,WAAW,IAAI,CACd,CAAC,GAAG,CACF,SAAS,CAAC,mBAAmB,CAC7B,KAAK,CAAC,CAAC,EAAE,YAAY,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,4BAA4B,EAAE,CAAC,CAEvF;UAAA,CAAC,WAAW,CACd;QAAA,EAAE,GAAG,CAAC,CACP,CAED;;MAAA,CAAC,GAAG,CACF,SAAS,CAAC,YAAY,CACtB,KAAK,CAAC,CAAC;YACL,OAAO,EAAE,MAAM;YACf,mBAAmB,EAAE,uCAAuC;YAC5D,GAAG,EAAE,MAAM;SACZ,CAAC,CAEF;QAAA,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE;YACtB,MAAM,QAAQ,GAAG,MAAM,CAAC,KAAK,KAAK,aAAa,CAAA;YAC/C,OAAO,CACL,CAAC,MAAM,CACL,IAAI,CAAC,QAAQ,CACb,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAClB,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAC1C,KAAK,CAAC,CAAC;oBACL,OAAO,EAAE,MAAM;oBACf,UAAU,EAAE,QAAQ;oBACpB,GAAG,EAAE,MAAM;oBACX,OAAO,EAAE,WAAW;oBACpB,YAAY,EAAE,MAAM;oBACpB,MAAM,EAAE,QAAQ;wBACd,CAAC,CAAC,oCAAoC;wBACtC,CAAC,CAAC,sCAAsC;oBAC1C,eAAe,EAAE,0BAA0B;oBAC3C,SAAS,EAAE,QAAQ;wBACjB,CAAC,CAAC,2CAA2C;wBAC7C,CAAC,CAAC,kCAAkC;oBACtC,MAAM,EAAE,SAAS;oBACjB,UAAU,EAAE,8CAA8C;iBAC3D,CAAC,CAEF;cAAA,CAAC,IAAI,CACH,WAAW,CACX,KAAK,CAAC,CAAC;oBACL,KAAK,EAAE,MAAM;oBACb,MAAM,EAAE,MAAM;oBACd,YAAY,EAAE,KAAK;oBACnB,MAAM,EAAE,kCAAkC;oBAC1C,UAAU,EAAE,MAAM,CAAC,KAAK;iBACzB,CAAC,EAEJ;cAAA,CAAC,IAAI,CACH,KAAK,CAAC,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,GAAG,EAAE,KAAK,EAAE,4BAA4B,EAAE,CAAC,CAElF;gBAAA,CAAC,MAAM,CAAC,KAAK,CACf;cAAA,EAAE,IAAI,CACR;YAAA,EAAE,MAAM,CAAC,CACV,CAAA;QACH,CAAC,CAAC,CACJ;MAAA,EAAE,GAAG,CAEL;;MAAA,CAAC,MAAM,CACL,EAAE,CAAC,CAAC,IAAI,CAAC,CACT,KAAK,CAAC,CAAC,aAAa,CAAC,CACrB,QAAQ,CAAC,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CACtD,KAAK,CAAC,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,CAE3B;QAAA,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CACvB,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAC7C;YAAA,CAAC,MAAM,CAAC,KAAK,CACf;UAAA,EAAE,MAAM,CAAC,CACV,CAAC,CACJ;MAAA,EAAE,MAAM,CACV;IAAA,EAAE,GAAG,CAAC,CACP,CAAA;AACH,CAAC"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import {
|
|
3
|
-
import { createContext, useCallback, useContext, useEffect, useMemo, useState } from 'react';
|
|
2
|
+
import React, { createContext, useCallback, useContext, useEffect, useMemo, useState } from 'react';
|
|
4
3
|
import { defaultMode, modeLocalStorageKey } from './shared';
|
|
5
4
|
const ThemeContext = createContext(undefined);
|
|
6
5
|
export const useTheme = () => {
|
|
@@ -93,6 +92,6 @@ export const ThemeProvider = ({ children, initialTheme, initialMode, allowColorM
|
|
|
93
92
|
isColorModeToggleAllowed: allowColorModeToggle,
|
|
94
93
|
refreshTheme,
|
|
95
94
|
}), [theme, mode, updateMode, allowColorModeToggle, refreshTheme]);
|
|
96
|
-
return
|
|
95
|
+
return <ThemeContext.Provider value={contextValue}>{children}</ThemeContext.Provider>;
|
|
97
96
|
};
|
|
98
|
-
//# sourceMappingURL=index.
|
|
97
|
+
//# sourceMappingURL=index.jsx.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.jsx","sourceRoot":"","sources":["../../../src/providers/Theme/index.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kilivi/payloadcms-theme-management",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.5",
|
|
4
4
|
"description": "Theme configuration plugin for Payload CMS v3",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -55,14 +55,18 @@
|
|
|
55
55
|
"payload": "^3.58.0",
|
|
56
56
|
"react": "^19.0.0",
|
|
57
57
|
"react-dom": "^19.0.0",
|
|
58
|
-
"typescript": "^5.5.3"
|
|
58
|
+
"typescript": "^5.5.3",
|
|
59
|
+
"copyfiles": "^2.4.1"
|
|
59
60
|
},
|
|
60
61
|
"publishConfig": {
|
|
61
62
|
"access": "public"
|
|
62
63
|
},
|
|
63
64
|
"scripts": {
|
|
64
|
-
"build": "tsc",
|
|
65
|
+
"build": "pnpm run clean && tsc && pnpm run copyfiles",
|
|
65
66
|
"dev": "tsc --watch",
|
|
66
|
-
"clean": "rm -rf dist"
|
|
67
|
+
"clean": "rm -rf dist tsconfig.tsbuildinfo",
|
|
68
|
+
"copyfiles": "copyfiles -u 1 \"src/**/*.{html,css,scss,ttf,woff,woff2,eot,svg,jpg,png,json}\" dist/",
|
|
69
|
+
"lint": "eslint src",
|
|
70
|
+
"lint:fix": "eslint --fix --ext .ts,.tsx src"
|
|
67
71
|
}
|
|
68
72
|
}
|