54 lines
1.5 KiB
TypeScript
54 lines
1.5 KiB
TypeScript
|
/**
|
||
|
|
* Chart color utilities for Recharts compatibility
|
||
|
|
*
|
||
|
|
* Recharts doesn't properly parse CSS custom properties or OKLCH colors,
|
||
|
|
* so we provide static hex colors that work reliably across themes.
|
||
|
|
*/
|
||
|
|
|
||
|
|
export const chartColors = {
|
||
|
|
primary: '#3b82f6', // Blue
|
||
|
|
success: '#22c55e', // Green
|
||
|
|
warning: '#eab308', // Yellow
|
||
|
|
destructive: '#ef4444', // Red
|
||
|
|
accent: '#06b6d4', // Cyan
|
||
|
|
muted: '#9ca3af', // Gray
|
||
|
|
running: '#22c55e', // Same as success
|
||
|
|
stopped: '#6b7280', // Darker gray
|
||
|
|
fatal: '#ef4444', // Same as destructive
|
||
|
|
starting: '#eab308', // Same as warning
|
||
|
|
backoff: '#f97316', // Orange
|
||
|
|
stopping: '#fb923c', // Light orange
|
||
|
|
exited: '#9ca3af', // Same as muted
|
||
|
|
unknown: '#64748b', // Slate
|
||
|
|
};
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Get color for process state
|
||
|
|
*/
|
||
|
|
export function getStateColor(state: string): string {
|
||
|
|
const stateMap: Record<string, string> = {
|
||
|
|
running: chartColors.running,
|
||
|
|
stopped: chartColors.stopped,
|
||
|
|
fatal: chartColors.fatal,
|
||
|
|
starting: chartColors.starting,
|
||
|
|
backoff: chartColors.backoff,
|
||
|
|
stopping: chartColors.stopping,
|
||
|
|
exited: chartColors.exited,
|
||
|
|
unknown: chartColors.unknown,
|
||
|
|
};
|
||
|
|
|
||
|
|
return stateMap[state.toLowerCase()] || chartColors.muted;
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Color palette for multiple data series
|
||
|
|
*/
|
||
|
|
export const colorPalette = [
|
||
|
|
chartColors.primary,
|
||
|
|
chartColors.success,
|
||
|
|
chartColors.warning,
|
||
|
|
chartColors.accent,
|
||
|
|
chartColors.destructive,
|
||
|
|
chartColors.muted,
|
||
|
|
];
|