feat(260924-i8v): Proxmox-Kachel als Durchstich mit Balken und Zusammenfassung

- Typ proxmox am Ende von WIDGET_TYPES, WIDGET_MODULE_SLUGS = { proxmox: 'proxmox' } - gemeinsame Statusteile (proxmox-status, HealthBar, status-styles) nach components/proxmox/ - HealthBar variant compact: 6 px, ohne Legende, aria-hidden - Registry 3/4/8/8, Katalog-/Registry-/API-Tests auf die erste Modul-Kachel umgestellt - ProxmoxWidget liest nur listServers, zeigt Lade-, Leer-, Fehlerzustand Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
2026-09-24 13:24:51 +02:00
parent 8bfa4fc467
commit a906c6705d
19 changed files with 556 additions and 69 deletions
@@ -0,0 +1,67 @@
+import type { MeterLevel, ServerHealth } from './proxmox-status';
+
+/**
+ * Tailwind-Klassen je Zustand (quick-260924-h7x). Bewusst als vollstaendige,
+ * statische Zeichenketten — Tailwind findet Klassen nur, wenn sie woertlich im
+ * Quelltext stehen, zusammengesetzte Namen wie `bg-status-${x}` gingen verloren.
+ *
+ * `fill` = Flaeche (Leiste, Punkt, Balken), `pill` = Statuspille (12 %
+ * Flaeche + Textvariante), `text` = Schrift in Statusfarbe, `shadow` =
+ * zweischichtiger Schatten, der untere im Statuston getoent.
+ *
+ * Seit quick-260924-i8v gemeinsam fuer Modulseite und Dashboard-Kachel.
+ */
+export const HEALTH_STYLE: Record<
+  ServerHealth,
+  { fill: string; pill: string; text: string; shadow: string }
+> = {
+  ok: {
+    fill: 'bg-status-ok',
+    pill: 'bg-status-ok/12 text-status-ok-fg',
+    text: 'text-status-ok-fg',
+    shadow: 'shadow-[0_1px_2px_oklch(0_0_0/0.06),0_12px_28px_-14px_var(--status-ok)]',
+  },
+  warn: {
+    fill: 'bg-status-warn',
+    pill: 'bg-status-warn/12 text-status-warn-fg',
+    text: 'text-status-warn-fg',
+    shadow: 'shadow-[0_1px_2px_oklch(0_0_0/0.06),0_12px_28px_-14px_var(--status-warn)]',
+  },
+  down: {
+    fill: 'bg-status-down',
+    pill: 'bg-status-down/12 text-status-down-fg',
+    text: 'text-status-down-fg',
+    shadow: 'shadow-[0_1px_2px_oklch(0_0_0/0.06),0_12px_28px_-14px_var(--status-down)]',
+  },
+  idle: {
+    fill: 'bg-status-idle',
+    pill: 'bg-status-idle/12 text-status-idle-fg',
+    text: 'text-status-idle-fg',
+    shadow: 'shadow-[0_1px_2px_oklch(0_0_0/0.06),0_12px_28px_-14px_var(--status-idle)]',
+  },
+  // Kein farbiger Schatten: ein verwaister Server soll nicht „leuchten“.
+  orphan: {
+    fill: 'bg-status-orphan',
+    pill: 'bg-status-orphan/12 text-status-orphan-fg',
+    text: 'text-status-orphan-fg',
+    shadow: 'shadow-[0_1px_2px_oklch(0_0_0/0.04)]',
+  },
+};
+
+/** Balkenfarbe je Stufe; `unknown` wird schraffiert gezeichnet (siehe Meter). */
+export const METER_FILL: Record<Exclude<MeterLevel, 'unknown'>, string> = {
+  ok: 'bg-status-ok',
+  warn: 'bg-status-warn',
+  crit: 'bg-status-down',
+};
+
+/** Schriftfarbe der Prozentzahl je Stufe. */
+export const METER_TEXT: Record<MeterLevel, string> = {
+  ok: 'text-foreground',
+  warn: 'text-status-warn-fg',
+  crit: 'text-status-down-fg',
+  unknown: 'text-muted-foreground',
+};
+
+/** Eingelassenes Messfeld („Well“). */
+export const WELL = 'rounded-lg bg-well shadow-[inset_0_1px_2px_oklch(0_0_0/0.06)]';