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

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

tests/unit/uiTones.test.mjs

@@ -0,0 +1,20 @@
+import test from 'node:test'
+import assert from 'node:assert/strict'
+import { loadModule } from './load.mjs'
+
+const { badgeToneClass, BUTTON_CLASSES } = await loadModule('src/components/ui/tones.js')
+
+test('badgeToneClass', () => {
+  for (const t of ['muted', 'grey', undefined, 'unbekannt']) assert.equal(badgeToneClass(t), 'badge')
+  assert.equal(badgeToneClass('info'), 'badge blue')
+  assert.equal(badgeToneClass('blue'), 'badge blue')
+  assert.equal(badgeToneClass('ok'), 'badge green')
+  assert.equal(badgeToneClass('warn'), 'badge orange')
+  assert.equal(badgeToneClass('danger'), 'badge red')
+  assert.equal(badgeToneClass('violet'), 'badge violet')
+  assert.equal(badgeToneClass('plain'), 'badge plain')
+})
+
+test('Button-Varianten', () => {
+  assert.deepEqual(BUTTON_CLASSES, { default: 'btn', ghost: 'btn', primary: 'btn btn-primary', quiet: 'btn btn-quiet', danger: 'link-danger' })
+})