Zum Inhalt springen
Fieldbook
Menü
Anmelden
DE

Datendarstellung

Guide steps accordion

Guide steps accordion: Ein nummeriertes Akkordeon aus Führungsstufen, deren Paneele im zusammengeklappten Zustand montiert bleiben können, so dass ein laufender Timer im Inneren der Stufen beim Schließen und Wiederöffnen weiterzählt.

Guide steps accordion verwenden

Guide steps accordion verwendet das Vorschauformat „Karte“ mit der Theme-Einstellung „hell/dunkel“.

Vorschau anpassen

Diese Einstellungen werden an die Demo übergeben. Standardwerte und Grenzen gelten für die Vorschau; die vollständige Props-API steht in der Implementierung.

EinstellungTypStandardwertVorschaugrenzen
keepMountedbooleantrueKeine weitere Grenze in den Metadaten.
accentColorcolor#38BDF8Keine weitere Grenze in den Metadaten.
transitionMsnumber250Von 100 bis 500; Schrittweite 50
showStepNumbersbooleantrueKeine weitere Grenze in den Metadaten.
Für welche Frameworks ist Guide steps accordion verfügbar?

Guide steps accordion ist für React, Vue, Svelte, Astro, HTML verfügbar. Die Live-Vorschau verwendet React; die folgenden Quellcode-Beobachtungen beziehen sich auf index.tsx. Prüfe die gewählte Portierung auf die benötigten Interaktionen.

Welche Abhängigkeiten hat Guide steps accordion?

Die React-Metadaten nennen keine zusätzlichen npm-Abhängigkeiten neben React.

Welche Details zur Barrierefreiheit sind in Guide steps accordion erkennbar?

Der React-Quellcode von Guide steps accordion enthält: native Elemente (button); Attribute und Ereignisbehandler (aria-controls, aria-expanded, aria-hidden, aria-labelledby); explizite Rollen (region). Dies sind Beobachtungen am Quellcode. Prüfe zugängliche Namen, Fokusreihenfolge und Tastaturverhalten auf der zusammengesetzten Seite.

Wie berücksichtigt Guide steps accordion reduzierte Bewegung?

Die Quellcode-Analyse fand in der index.tsx von Guide steps accordion keine direkte Abfrage über useReducedMotion() oder matchMedia. Prüfe die vollständige Implementierung, gemeinsame Stile und die gewählte Portierung mit aktivierter Bewegungsreduktion; diese Beobachtungen belegen keinen vollständigen Animationsstopp.

Verbinde deinen Agenten

Verwandte offene Komponenten

Standbild der UI-Komponente Height Morph Accordion von Fieldbook aus der Kategorie Datendarstellung.
2364Height Morph AccordionDatendarstellungEine Fragenliste, deren Antworttafeln mithilfe einer Feder auf ihre natürliche Höhe wachsen und schrumpfen und dabei die Reihen darunter verschieben.
Standbild der UI-Komponente FAQ Accordion von Fieldbook aus der Kategorie Datendarstellung.
1956FAQ AccordionDatendarstellungEine vertikale Liste mit Fragenüberschriften, bei der beim Öffnen eines Bereichs die Antwort angezeigt wird und der davor geöffnete Bereich geschlossen wird.
Standbild der UI-Komponente Stacked FAQ accordion von Fieldbook aus der Kategorie Datendarstellung.
2440Stacked FAQ accordionDatendarstellungEine vertikale Liste von Fragen, die sich nacheinander zu einem Antwortfeld erweitern, mit einem Chevron, das sich entsprechend dem offenen Zustand dreht.
Standbild der UI-Komponente Starred repos disclosure von Fieldbook aus der Kategorie Datendarstellung.
2244Starred repos disclosureDatendarstellungEine Kopfzeile mit einer Umschalttaste, die eine kurze, ausgeblendete Liste markierter Repositorys unter einer Zeile anzeigt, die immer sichtbar bleibt.
Standbild der UI-Komponente Animated metric counter von Fieldbook aus der Kategorie Datendarstellung.
2299Animated metric counterDatendarstellungEine große, bloße Zahl, die in dem Moment, in dem sie ins Bild gescrollt wird, von einem Startwert zu ihrem Ziel hochspringt und leicht über das Ziel hinausschießt, bevor sie sich stabilisiert, mit Tausendertrennzeichen und einem optionalen Suffix.
Standbild der UI-Komponente Before/After Code Diff von Fieldbook aus der Kategorie Datendarstellung.
2113Before/After Code DiffDatendarstellungZwei Codefelder nebeneinander, mit Vorher- und Nachherbeschriftung, mit eingefärbten hinzugefügten und entfernten Linien und einem Hover-Fokus-Effekt.