Formulare

Input

Textfeld mit Label, Hilfetext, Fehleranzeige und Icon-Slots.

Vorschau
Konfiguration
import { Input } from "@repo/ui/input"

<Input
  type="text"
  label="Vorname"
  placeholder="Max"
/>
Weitere Beispiele
Praxis-Beispiel: Registrierungsformular
Wir senden Ihnen eine Bestätigung.
Mindestens 8 Zeichen, eine Zahl und ein Sonderzeichen.
Optional — wird in Ihrem Profil angezeigt.
Alle Zustände auf einen Blick
Zusätzliche Information für den Benutzer.
Dieses Feld ist erforderlich.

Checkbox

Checkbox mit Label und optionaler Beschreibung.

Vorschau
Konfiguration
import { Checkbox } from "@repo/ui/checkbox"

<Checkbox
  label="AGB akzeptieren"
  description="Ich stimme den Nutzungsbedingungen zu."
/>
Weitere Beispiele
Praxis-Beispiel: Einstellungen

Radio

Radio-Button mit Label und optionaler Beschreibung.

Vorschau
Konfiguration
import { Radio } from "@repo/ui/radio"

<Radio
  name="format"
  label="Live-Webinar"
  description="Teilnahme in Echtzeit"
  defaultChecked
/>
Weitere Beispiele
Praxis-Beispiel: Kursformat wählen

Slider

Schieberegler mit Wertanzeige.

Vorschau
CME-Jahresziel60
Konfiguration
import { Slider } from "@repo/ui/slider"

<Slider
  label="CME-Jahresziel"
  defaultValue={60}
  max={250}
/>