feat(ST-1202): add lib/chart-colors.ts + vitest coverage

MD3-token-to-CSS-var mappings for STATUS, PRIORITY, VERIFY, JOB_STATUS
and SERIES_COLORS; all 5 tests pass.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

__tests__/lib/chart-colors.test.ts

@@ -0,0 +1,52 @@
+import { describe, it, expect } from 'vitest'
+import {
+  STATUS_COLORS,
+  PRIORITY_COLORS,
+  VERIFY_COLORS,
+  JOB_STATUS_COLORS,
+  SERIES_COLORS,
+} from '@/lib/chart-colors'
+
+describe('chart-colors', () => {
+  it('STATUS_COLORS has all TaskStatus keys and non-empty values', () => {
+    const keys: (keyof typeof STATUS_COLORS)[] = ['TO_DO', 'IN_PROGRESS', 'REVIEW', 'DONE']
+    for (const key of keys) {
+      expect(STATUS_COLORS[key]).toBeTruthy()
+      expect(typeof STATUS_COLORS[key]).toBe('string')
+    }
+  })
+
+  it('PRIORITY_COLORS has keys 1-4 with non-empty values', () => {
+    const keys = [1, 2, 3, 4] as const
+    for (const key of keys) {
+      expect(PRIORITY_COLORS[key]).toBeTruthy()
+      expect(typeof PRIORITY_COLORS[key]).toBe('string')
+    }
+  })
+
+  it('VERIFY_COLORS has all VerifyResult keys and non-empty values', () => {
+    const keys: (keyof typeof VERIFY_COLORS)[] = ['ALIGNED', 'PARTIAL', 'EMPTY', 'DIVERGENT']
+    for (const key of keys) {
+      expect(VERIFY_COLORS[key]).toBeTruthy()
+      expect(typeof VERIFY_COLORS[key]).toBe('string')
+    }
+  })
+
+  it('JOB_STATUS_COLORS has all ClaudeJobStatus keys and non-empty values', () => {
+    const keys: (keyof typeof JOB_STATUS_COLORS)[] = [
+      'queued', 'claimed', 'running', 'done', 'failed', 'cancelled',
+    ]
+    for (const key of keys) {
+      expect(JOB_STATUS_COLORS[key]).toBeTruthy()
+      expect(typeof JOB_STATUS_COLORS[key]).toBe('string')
+    }
+  })
+
+  it('SERIES_COLORS has 5 non-empty entries', () => {
+    expect(SERIES_COLORS).toHaveLength(5)
+    for (const color of SERIES_COLORS) {
+      expect(color).toBeTruthy()
+      expect(typeof color).toBe('string')
+    }
+  })
+})

lib/chart-colors.ts

@@ -0,0 +1,39 @@
+// Mapping van MD3-tokens naar CSS-var-strings voor Recharts fill/stroke.
+// Recharts accepteert gewone strings — 'var(--status-done)' werkt direct.
+export const STATUS_COLORS = {
+  TO_DO: 'var(--status-todo)',
+  IN_PROGRESS: 'var(--status-in-progress)',
+  REVIEW: 'var(--status-in-progress)',
+  DONE: 'var(--status-done)',
+} as const
+
+export const PRIORITY_COLORS = {
+  1: 'var(--priority-critical)',
+  2: 'var(--priority-high)',
+  3: 'var(--priority-medium)',
+  4: 'var(--priority-low)',
+} as const
+
+export const VERIFY_COLORS = {
+  ALIGNED: 'var(--status-done)',
+  PARTIAL: 'var(--priority-medium)',
+  EMPTY: 'var(--priority-critical)',
+  DIVERGENT: 'var(--priority-high)',
+} as const
+
+export const JOB_STATUS_COLORS = {
+  queued: 'var(--muted-foreground)',
+  claimed: 'var(--status-in-progress)',
+  running: 'var(--status-in-progress)',
+  done: 'var(--status-done)',
+  failed: 'var(--priority-critical)',
+  cancelled: 'var(--muted-foreground)',
+} as const
+
+export const SERIES_COLORS = [
+  'var(--chart-1)',
+  'var(--chart-2)',
+  'var(--chart-3)',
+  'var(--chart-4)',
+  'var(--chart-5)',
+] as const