Alle Komponenten

View, die Tokens für Abstände, Farbe, Radius und Elevation als Props entgegennimmt.

• Props für Padding und Margin
• Hintergrund aus Theme-Farben
• Radius und 6 Elevation-Stufen

Vertikale und horizontale Stacks mit token-basierten Abständen.

• VStack und HStack
• Gap aus Abstands-Tokens
• Ausrichtung, Verteilung und Umbruch

Typografie-Primitiv, an die Schriftskala des Themes gebunden.

• 18 Typ-Varianten
• Farb-Tokens aus dem Theme
• Gut lesbare Akzentfarben

Text mit Header-Rolle, abgebildet auf die Überschriftenstile.

• Ebenen 1-3 plus 2 Display-Größen
• Header-Rolle für Screenreader

Horizontaler Haarlinien-Trenner.

• Einrückung auf beiden Seiten
• Linienstärke aus Tokens

Pressable mit Reanimated-Spring-Skalierung beim Drücken.

• Konfigurierbare Skalierung
• Berücksichtigt reduzierte Bewegung
• Fokusring für die Tastatur

Einzeiliger Text, der nur bei Überlauf scrollt.

• Überlauf-Erkennung
• Konfigurierbare Geschwindigkeit und Pause
• Statisch bei reduzierter Bewegung

Animierter Seiten- oder Schrittindikator.

• Aktiver Punkt wird breiter
• Sagt den aktuellen Schritt an

Kleine Überzeile in Großbuchstaben mit Header-Rolle.

• Standardmäßig in Großbuchstaben
• Eigene Transformation und Farbe

Gezeichnetes Icon-Set, das auf iOS und Android gleich aussieht.

• 12 Glyphen
• Chevrons werden in RTL gespiegelt
• Für Screenreader ausgeblendet

Antippbare Kachel mit getöntem Icon-Chip und Label.

• 5 Töne
• Spring-Skalierung beim Drücken
• Leichte Haptik beim Drücken

Runder Avatar mit Bild oder Initialen.

• 4 Größen (sm-xl)
• Initialen aus einem Namen
• Eigener Hintergrund für Initialen

Zähler, kurzes Label oder Statuspunkt.

• 5 Farbvarianten
• Obergrenze bei Überlauf (99+)
• Punkt-Modus

Modales Sheet, das von unten hereingleitet.

• Zum Schließen nach unten ziehen
• Teile Header, Body und Footer
• Weicht der Tastatur aus
• Escape-Geste für Screenreader

Untere Tab-Leiste mit animierter Markierung für den aktiven Tab.

• Badges pro Tab
• Tab-Rollen mit Auswahlzustand
• Safe-Area-Inset

Button für die Hauptaktion mit Varianten, Größen, Ladezustand und Icons.

• 5 Varianten
• 3 Größen (sm/md/lg)
• Ladezustand
• Haptischer Druck

Theme-gestaltete Oberfläche, die mit einem Handler antippbar wird.

• 4 Elevation-Stufen
• 3 Dichte-Größen
• Header- und Footer-Slots

Checkbox mit optionalem Label.

• 2 Größen
• Checkbox-Rolle und -Zustand
• Leichte Haptik beim Umschalten

Auswählbarer Chip oder Filter-Tag.

• 3 Varianten und 3 Formen
• Vorangestelltes Icon
• ChipGroup-Layout

Feierliches Konfetti, das nie Berührungen blockiert.

• Konfigurierbare Partikelanzahl
• Startet beim Einblenden
• Berücksichtigt reduzierte Bewegung

Sich selbst aktualisierender Countdown bis zu einer Frist.

• 4 Formate
• Lokalisierbare Einheiten
• Label und Callback bei Ablauf

Feld für Datum, Uhrzeit oder Datum mit Uhrzeit.

• 3 Modi
• Mindest- und Höchstdatum
• Löschbar
• Schreibgeschützter Fallback ohne Picker

Felder für Start- und Enddatum eines Zeitraums.

• Jedes Ende begrenzt das andere
• Eigener Fehler pro Ende
• Löschbar

Zentrierter Leerzustand mit Icon, Titel, Nachricht und Aktion.

• 3 Größen
• Aktions-Slot
• Summary-Rolle

Error Boundary mit Fallback zum erneuten Versuchen.

• Reset-Keys
• Eigenes Fallback-Rendering
• withErrorBoundary-HOC

Fehlerhinweis unter Formularfeldern.

• Alert-Rolle
• Live-Region (polite)

Feld-Label in Großbuchstaben mit Pflichtfeld-Markierung.

• Pflichtfeld-Markierung
• Als Pflichtfeld angesagt

Bildschirm-Header mit Zurück-Button, Titel und Aktionen.

• Reguläre und große Titel
• Zentrierter oder linksbündiger Titel
• Zurück-Chevron wird in RTL gespiegelt

Runder Button nur mit Icon.

• 4 Varianten und 3 Größen
• Eingebauter Hit-Slop
• Leichte Haptik

Texteingabe mit Label, Fehler und Fokusrahmen.

• Label, Fehler und Pflichtfeld
• Leitet ref und TextInput-Props weiter
• Mehrzeilig nutzbar

Plattformübergreifender Dialog zur Texteingabe.

• System-Dialog Alert.prompt auf iOS
• Theme-gestaltetes Modal auf Android
• Lokalisierte Buttons

Untere Aktionsleiste, die über der Tastatur bleibt.

• Hebt sich mit der Tastatur
• Auf Android standardmäßig aktiv

Listen- oder Seiten-Header in vier Größen.

• 4 Größen
• Optionen für die Texttransformation
• Header-Rolle

Listenzeile mit Icon, Untertitel, Wert und Chevron.

• Chevron, wenn antippbar
• Destruktiver Stil
• Eigene Slots

Gruppierter Listenabschnitt mit Titel und Fußnote.

• Gruppierte Karte oder einzelne Zeilen
• Titel und Fußnote

Listenzeile mit eingebautem Switch.

• Switch eingebaut
• Icon und Untertitel

Zentrierter Dialog mit Backdrop, Titel und Footer.

• Teile Header, Body und Footer
• Schließen per Backdrop
• Escape-Geste für Screenreader

Bestimmter horizontaler Fortschrittsbalken.

• Semantische oder eigene Farbe
• Fortschrittsbalken-Rolle mit Wert
• Konfigurierbare Höhe

Einzelne Radio-Option mit optionalem Label.

• Kontrollierte Auswahl
• Radio-Rolle
• Leichte Haptik

Bildschirm-Wrapper mit Safe Areas und maximaler Breite auf Tablets.

• Safe Areas oben und unten
• Zentrierter Inhalt auf Tablets
• Optionales Padding

Suchfeld mit Debounce und Lösch-Button.

• Eingebauter Debounce
• Lösch-Button
• Linke und rechte Slots

Inhaltsabschnitt mit Titel und Aktion.

• Titel als Überschrift
• Aktions-Slot

Segmentierte Einfachauswahl im iOS-Stil.

• Radio-Gruppe für Screenreader
• Typisierte Werte
• Leichte Haptik

Auswahl eines einzelnen Werts mit Optionen in einem Bottom Sheet.

• BottomSheet-Picker
• Icons für Optionen
• Label, Fehler und Pflichtfeld

Einstellungszeile mit abgerundeter Icon-Kachel.

• Icon-Kachel
• Destruktiver Stil
• Variante SettingsSwitchRow

Animierter Lade-Platzhalter.

• Card-Preset
• Berücksichtigt reduzierte Bewegung
• Lokalisiertes Lade-Label

Zentrierter Aktivitätsindikator mit optionalem Label.

• 2 Größen
• Wird Screenreadern angesagt

Statistik-Kachel mit Label, Wert und Zusatztext.

• 5 Töne
• 3 Größen
• Tabellarische Ziffern

Theme-gestalteter nativer Switch mit Label und Untertitel.

• Ganze Zeile antippbar
• Leichte Haptik
• Label wird mit Untertitel vorgelesen

Mehrzeilige Eingabe mit Label und Fehler.

• Mindesthöhe in Zeilen
• Label, Fehler und Pflichtfeld

Imperativer Toast, der einmal im App-Root eingebunden wird.

• 5 Varianten
• Position oben oder unten
• Aktions-Button
• Screenreader-Ansagen