shacn-dashboard/lib/chart-config.ts
Pierre Wessman 08a3132bec polish
2025-12-14 17:47:17 +01:00

60 lines
1.5 KiB
TypeScript

import {
Chart as ChartJS,
CategoryScale,
LinearScale,
PointElement,
LineElement,
BarElement,
Title,
Tooltip,
Legend,
Filler,
} from "chart.js"
ChartJS.register(
CategoryScale,
LinearScale,
PointElement,
LineElement,
BarElement,
Title,
Tooltip,
Legend,
Filler
)
export function getChartColors(theme: string | undefined) {
const isDark = theme === "dark"
return {
// Primary colors for chart elements
primary: isDark ? "rgb(96, 165, 250)" : "rgb(59, 130, 246)", // blue
secondary: isDark ? "rgb(168, 85, 247)" : "rgb(147, 51, 234)", // purple
success: isDark ? "rgb(74, 222, 128)" : "rgb(34, 197, 94)", // green
// Additional chart colors
orange: isDark ? "rgb(237, 152, 95)" : "rgb(237, 152, 95)",
pink: isDark ? "rgb(236, 72, 153)" : "rgb(236, 72, 153)",
amber: isDark ? "rgb(251, 191, 36)" : "rgb(251, 191, 36)",
teal: isDark ? "rgb(94, 234, 212)" : "rgb(94, 234, 212)",
rose: isDark ? "rgb(244, 114, 182)" : "rgb(244, 114, 182)",
blue: isDark ? "rgb(96, 123, 143)": "rgb(96, 123, 143)",
darkBlue: isDark ? "rgb(67, 78, 120)" : "rgb(67, 78, 120)",
// UI colors
grid: isDark ? "rgba(255, 255, 255, 0.1)" : "rgba(0, 0, 0, 0.1)",
text: isDark ? "rgba(255, 255, 255, 0.7)" : "rgba(0, 0, 0, 0.7)",
}
}
export const defaultChartOptions = {
responsive: true,
maintainAspectRatio: false,
plugins: {
legend: {
display: true,
position: "bottom" as const,
},
},
}