components/overview
zenit Storybook · 5f9add5+wip 2026-09-30
Komponenten
51 öffentliche Komponenten und 13 Fähigkeits-Labs. Jeder Clip ist das Metal-Drawable eines echten zenit-Storybook-Fensters, gesteuert vom E2E-Harness; Quellcode und Props werden direkt aus dem Repository extrahiert.
Buttonui.widgets.ButtonPrimäre, sekundäre, destruktive, linkartige und reine Icon-Buttons.
Checkboxui.widgets.CheckboxEin unabhängiger Boolean mit den Zuständen nicht markiert, markiert und unbestimmt.
Switchui.widgets.SwitchEin Schalter für Einstellungen, die sofort wirken.
Radioui.widgets.RadioGroupGenau einen Wert aus sich gegenseitig ausschließenden Optionen wählen.
Sliderui.widgets.SliderEinen Wert auf einem stufenlosen oder gestuften Bereich wählen.
Rateui.widgets.RateSternebewertungen oder Bewertungen mit begrenzter Anzahl.
NumberStepperui.widgets.NumberStepperPräzises Erhöhen und Verringern für Mengen und Parameter.
Inputui.widgets.InputEinzeilige Eingabe für Text, E-Mail, Passwort und Suche.
Textareaui.widgets.TextareaMehrzeilige Bearbeitung mit den Zuständen helper, error und disabled.
Selectui.widgets.SelectEinfach-, Mehrfach-, löschbare und durchsuchbare Auswahlfelder.
Form CompositionInput · Select · ButtonInput, Select und Button gemischt in einer Größe: eine Filterleiste und ein Geschäftsformular.
ComboBoxui.widgets.ComboBoxEine durchsuchbare, filterbare Eingabe, die ihren Wert zurückschreibt.
TagsInputui.widgets.TagsInputViele Tokens per Tastatur eingeben.
FileUploadui.widgets.FileUploadDateiauswahl und Ablagebereich.
DatePickerui.widgets.DatePickerEin Datum eingeben oder aus einem Kalender wählen.
DateRangePickerui.widgets.DateRangePickerEin Start- und ein Enddatum wählen.
Formui.widgets.FormOf(T)Typisierter Formularzustand, Feldmetadaten und Validierungszeitpunkt.
Badgeui.widgets.BadgeZurückhaltender Status, Zähler und semantische Labels.
Tagui.widgets.TagSchließbare oder schreibgeschützte Kategorie-Labels.
Chipui.widgets.ChipKompakte Auswahl, Filter oder Tokens mit Icon.
Cardui.widgets.CardFasst Titel, Inhalt und interaktive Fläche zu einer Einheit zusammen.
Alertui.widgets.AlertDauerhaftes Feedback innerhalb der Seite.
Progressui.widgets.ProgressBestimmter und unbestimmter Fortschritt.
Spinnerui.widgets.SpinnerEine kompakte Animation für kurze Wartezeiten.
Skeletonui.widgets.SkeletonPlatzhalterstruktur, während Inhalte laden.
Timelineui.widgets.TimelineVertikale Ereignisse nach Zeit oder Status.
Breadcrumbui.widgets.BreadcrumbZeigt den aktuellen Ort und seine übergeordneten Ebenen.
Stepsui.widgets.StepsErledigte, aktuelle und ausstehende Zustände einer mehrstufigen Aufgabe.
Treeui.widgets.TreeHierarchien, Dateibäume und aufklappbare Strukturen.
Tableui.widgets.TableEine einfache Tabelle mit festen Spalten und eigenen Zellen.
DataTableui.widgets.DataTableEine Datentabelle mit Filterung, Paginierung und Spaltenverhalten.
Calendarui.widgets.CalendarDatumsnavigation und -auswahl in der Monatsansicht.
Markdownui.widgets.MarkdownRendert eine unterstützte Markdown-Teilmenge als native Nodes.ui.system_iconsAnbieterneutrale semantische Icon-Rollen, Größen und Färbungen.
Tabsui.widgets.TabsZwischen gleichrangigen Ansichten in einem Kontext wechseln.
Accordionui.widgets.AccordionAbschnitte ein- und ausklappen.
Menuui.widgets.MenuKontextaktionen mit Tastenkürzel-Hinweisen.
DropdownMenuui.widgets.DropdownMenuEine Reihe von Befehlen, die sich über einen Button öffnet.
Notificationui.widgets.NotifierNicht blockierende Benachrichtigungen: neun Arten, Fortschritt, Aktionen, Stapelung und acht Andockpositionen.
Tooltipui.widgets.TooltipKurze ergänzende Hinweise für Bedienelemente.
Popoverui.widgets.PopoverReichhaltigerer temporärer Inhalt als ein Tooltip.
Modalui.widgets.ModalBlockierende Aufgaben, Bestätigungen und fokussierter Kontext.
Sheetui.widgets.SheetEin Seitenpanel, das vom Fensterrand hereingleitet.
GlassBoxui.widgets.GlassBoxEine Glasoberfläche mit echtem Hintergrund-Blur.
Dividerui.widgets.DividerHorizontale, vertikale und beschriftete Trenner.
Stackui.widgets.HStack / VStackÜbliche horizontale und vertikale Anordnung.
Layout / Box Modelui.boxEine Abdeckungsmatrix für Boxmodell, Prozentwerte, absolute Positionierung, Flex / Grid und Clipping.
VirtualListui.widgets.VirtualListBindet von großen gleichförmigen Listen nur den sichtbaren Ausschnitt ein.
VirtualList (Dynamic)ui.widgets.VirtualListEine virtuelle Liste mit variablen Zeilenhöhen.
ScrollAreaui.widgets.mountScrollAreaSelbst gezeichnetes Scrollen, Scrollbars und programmatische Positionierung.
Gridui.widgets.mountGridZweidimensionale Zeilen und Spalten mit eigenen Zellen.
GlassLabui.widgets.GlassBoxEine GlassBox-Optikbank: Brechung, Randbreite und Vergrößerung.
GlassIslandsui.widgets.GlassBoxMehrere Glasinseln über einem Hintergrund.
GlassMotionui.widgets.GlassBoxSich verformendes Glas und eine Toolbar, die beim Scrollen schwebt.
GlassChromeui.widgets.GlassBoxApp-Chrome: gläserne Titel- und Werkzeugleiste über scrollendem Inhalt.
CanvasEventsui.eventsEreignisse auf Canvas-Ebene: Scrollen, Zoomgeste, Ziehen und ein PNG-Hin-und-Zurück über die Zwischenablage.
Dragui.interactionZiehen und ein horizontaler Größenänderungsgriff.
Gesturesui.interactionGestenarbitrierung für Einfach-, Doppel-, Dreifachklick und langes Drücken.
AnimControlsui.fxAnimationssteuerung: Yoyo, Timelines, Keyframes und Federn.
VectorPathui.pathVektorpfad-Geometrie: Kontur, Füllung und Hit-Testing.
BlendModesui.boxMischmodi und Deckkraft-Compositing.
Emojiui.textFarbige Emoji, ZWJ-Sequenzen und Hautton-Modifikatoren.
RTLui.textGemischter Text aus Arabisch, Hebräisch und Latein.
WordNavui.widgets.TextareaWortweise Cursorbewegung über Schriftsysteme hinweg.