Inline-Edit
Wert anzeigen und direkt an der Stelle ändern: Klick, Enter oder F2 öffnen den Editor, Enter und Blur speichern, Escape bricht ab. Der neue Wert erscheint optimistisch mit Ladeindikator; scheitert das Speichern, rollt die Anzeige zurück und ein Toast erklärt den Fehler. EditableCell bringt denselben Editor in Data-Table-Zellen.
Text
Die Anzeige ist ein Button: Klick, Enter oder F2 öffnen den Editor, Enter und Blur speichern, Escape bricht ab. Während des Speicherns erscheint der neue Wert sofort mit Ladeindikator; der Fokus kehrt danach auf die Anzeige zurück.
Name
Notiz
Enter fügt eine Zeile ein, Strg/Cmd+Enter speichert.
Editoren
Select committet direkt nach der Auswahl, Zahl und Datum laufen über NumberField und ein natives Datumsfeld. Alle Editoren teilen Höhe, Fokusring und Touch-Fläche mit den übrigen Controls.
Status
Bestand
Übergabe
Validierung
validate läuft vor dem Speichern. Eine Meldung hält den Editor offen, markiert das Feld als ungültig und verbindet den Fehlertext über aria-describedby.
Kürzel
Erlaubt sind 2–4 Großbuchstaben.
Optimistisch mit Rollback
Der neue Wert erscheint sofort. Scheitert onSave, springt die Anzeige auf den alten Wert zurück, der Editor bleibt mit dem Entwurf offen und ein Toast meldet den Fehler. Gib für den Fehlerfall „Fehler“ ein.
Zuweisung
In der Data Table
EditableCell füllt die Zelle und bringt denselben Editor mit. Die Tabelle bleibt sortier- und filterfähig; hier ist beides aus, damit die Zeilen ruhig bleiben.
| Name | Rolle |
|---|---|
| Pflegefachkraft | |
| Auszubildender | |
| Stationsleitung |
Playground
Größe und deaktivierter Zustand lassen sich hier direkt umschalten. Die Anzeige bleibt auch deaktiviert fokussierbar, der Editor öffnet dann nicht.