Design: UI-Bausteine rendern die neuen Klassen (Button, Badge, Card, Kopf, Reiter, Stat)

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

src/components/ui/tones.js

@@ -0,0 +1,28 @@
+/* Klassen der Bausteine: reine Zuordnung, ohne JSX (Test: tests/unit/uiTones.test.mjs) */
+
+// Badge-Ton (alter und neuer Name) auf die Klasse; "muted"/"grey" und alles Unbekannte = neutral
+const BADGE_TONES = {
+  info: 'blue',
+  blue: 'blue',
+  ok: 'green',
+  green: 'green',
+  warn: 'orange',
+  orange: 'orange',
+  danger: 'red',
+  red: 'red',
+  violet: 'violet',
+  plain: 'plain',
+}
+
+export function badgeToneClass(tone) {
+  const t = Object.prototype.hasOwnProperty.call(BADGE_TONES, tone) ? BADGE_TONES[tone] : ''
+  return t ? `badge ${t}` : 'badge'
+}
+
+export const BUTTON_CLASSES = {
+  default: 'btn',
+  ghost: 'btn',
+  primary: 'btn btn-primary',
+  quiet: 'btn btn-quiet',
+  danger: 'link-danger',
+}