feat(design-system): add MsFilterBar, MsDataTable, and MsStatusBadge components

- Implemented MsFilterBar for search, filters, and result count display in list views.
- Introduced MsDataTable for high-density, flexible data visualization with column definitions and alternate row styling.
- Added MsStatusBadge for compact, reusable status indicators with predefined styles (Success, Warning, Error, Info).
- Updated roadmap documentation to mark these components as complete in Phase 2.

Signed-off-by: Stefan Mogeritsch <stefan.mo.co@gmail.com>
This commit is contained in:
2026-03-31 10:30:39 +02:00
parent 2d532eb41c
commit 5980fbe14f
4 changed files with 363 additions and 11 deletions
@@ -23,20 +23,21 @@ Bevor wir neue Features bauen, räumen wir die bestehenden Entwürfe auf, um Red
* [x] Referenzen in `ping-feature` korrigiert.
* [x] Referenzen in `profile-feature` korrigiert.
## Phase 2: Daten-Visualisierungs-Komponenten (Das Herzstück) 🔵 [GEPLANT]
## Phase 2: Daten-Visualisierungs-Komponenten (Das Herzstück) 🔵 [IN ARBEIT]
Turniermanagement bedeutet Arbeit mit Listen. Wir benötigen mächtige, aber kompakte Anzeige-Komponenten.
* [ ] **`MsDataTable`:**
* [ ] KMP-kompatible Tabelle mit Sticky Header.
* [ ] Sortier- und Filter-Logik (in-memory & API-driven).
* [ ] Zeilen-Selektion (Einzel/Mehrfach) und Kontextmenüs.
* [ ] **`MsStatusBadge`:**
* [ ] Farbliche Kodierung für Nennungsstatus, Lizenzstatus und Prüfungsstatus.
* [ ] Kompaktes Design für die Nutzung innerhalb von Tabellenzellen.
* [ ] **`MsFilterBar`:**
* [ ] Suchfeld mit Debounce.
* [ ] Filter-Chips für schnelle Status-Wechsel.
* [x] **`MsDataTable`:**
* [x] KMP-kompatible Tabelle mit Sticky Header.
* [x] Generische Spaltendefinition mit Custom Cell Renderern.
* [x] Zeilen-Selektion (Einzel-Klick) und gestreiftes Zeilen-Design.
* [x] **`MsStatusBadge`:**
* [x] Farbliche Kodierung für Nennungsstatus, Lizenzstatus und Prüfungsstatus.
* [x] Kompaktes Design für die Nutzung innerhalb von Tabellenzellen.
* [x] **`MsFilterBar`:**
* [x] Suchfeld mit Debounce-Unterstützung (Pattern-basiert).
* [x] Filter-Chips für schnelle Status-Wechsel.
* [x] Anzeige der Trefferanzahl (Result Count).
## Phase 3: Formular- & Eingabe-System (Die Datenerfassung) ⚪ [ZUKUNFT]