56 lines
1.6 KiB
TypeScript
56 lines
1.6 KiB
TypeScript
/**
|
|
* Shared theme utilities for ECharts-based chart components.
|
|
* Provides color palettes and option fragments that match the dees-catalog design tokens.
|
|
*/
|
|
|
|
const SERIES_COLORS = {
|
|
dark: [
|
|
'hsl(217.2 91.2% 59.8%)', // blue
|
|
'hsl(173.4 80.4% 40%)', // teal
|
|
'hsl(280.3 87.4% 66.7%)', // purple
|
|
'hsl(24.6 95% 53.1%)', // orange
|
|
'hsl(142 76% 36%)', // green
|
|
'hsl(346 77% 49%)', // rose
|
|
],
|
|
light: [
|
|
'hsl(222.2 47.4% 51.2%)',
|
|
'hsl(142.1 76.2% 36.3%)',
|
|
'hsl(280.3 47.7% 50.2%)',
|
|
'hsl(20.5 90.2% 48.2%)',
|
|
'hsl(160 60% 45%)',
|
|
'hsl(340 65% 47%)',
|
|
],
|
|
};
|
|
|
|
export function getEchartsSeriesColors(goBright: boolean): string[] {
|
|
return goBright ? SERIES_COLORS.light : SERIES_COLORS.dark;
|
|
}
|
|
|
|
export function getEchartsThemeOptions(goBright: boolean): Record<string, any> {
|
|
const isDark = !goBright;
|
|
return {
|
|
backgroundColor: 'transparent',
|
|
textStyle: {
|
|
color: isDark ? 'hsl(0 0% 63.9%)' : 'hsl(0 0% 20%)',
|
|
fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',
|
|
fontSize: 12,
|
|
},
|
|
color: goBright ? SERIES_COLORS.light : SERIES_COLORS.dark,
|
|
tooltip: {
|
|
backgroundColor: isDark ? 'hsl(0 0% 9%)' : 'hsl(0 0% 100%)',
|
|
borderColor: isDark ? 'hsl(0 0% 14.9%)' : 'hsl(0 0% 89.8%)',
|
|
textStyle: {
|
|
color: isDark ? 'hsl(0 0% 95%)' : 'hsl(0 0% 9%)',
|
|
fontSize: 12,
|
|
},
|
|
confine: true,
|
|
},
|
|
legend: {
|
|
textStyle: {
|
|
color: isDark ? 'hsl(0 0% 63.9%)' : 'hsl(0 0% 20%)',
|
|
fontSize: 12,
|
|
},
|
|
},
|
|
};
|
|
}
|