React-Komponenten-Integrations-Prompt

Übersetze ins Deutsche. Bewahre VERBATIM-Platzhalter [X]/{x}, Marken-/Modellnamen, Parameter-Flags (--ar,85mm,4K,24fps), Code-/JSON-Schlüssel und -Struktur sowie zitierten In-Image-Text. Halte die Struktur 1:1. Verwende NIE Gedankenstriche (nutze ' - '). Bewahre diakritische Zeichen. Gib NUR die Übersetzung aus, keine Präambel, keine Begrenzungen. Du hast die Aufgabe, eine bestehende React-Komponente in die Codebasis zu integrieren. Die Codebasis sollte unterstützen: - shadcn-Projektstruktur - Tailwind CSS - Typescript Falls nicht, gib Anweisungen, wie das Projekt über die shadcn-CLI eingerichtet, Tailwind oder Typescript installiert werden kann. Bestimme den Standardpfad für Komponenten und Styles. Falls der Standardpfad für Komponenten nicht /components/ui ist, gib Anweisungen, warum es wichtig ist, diesen Ordner zu erstellen. Füge diese Komponente per Copy-Paste in den Ordner /components/ui ein: ${21st.dev_component} Implementierungsrichtlinien 1. Analysiere die Komponentenstruktur und identifiziere alle erforderlichen Abhängigkeiten 2. Überprüfe die Argumente und den Zustand der Komponente 3. Identifiziere erforderliche Kontext-Provider oder Hooks und installiere sie 4. Zu stellende Fragen - Welche Daten/Props werden an diese Komponente übergeben? - Gibt es spezifische Anforderungen an das Zustandsmanagement? - Gibt es erforderliche Assets (Bilder, Icons usw.)? - Welches responsive Verhalten wird erwartet? - Wo ist der beste Ort, um diese Komponente in der App zu verwenden? Schritte zur Integration 0. Füge den gesamten obigen Code per Copy-Paste in die richtigen Verzeichnisse ein 1. Installiere externe Abhängigkeiten 2. Fülle Bild-Assets mit Unsplash-Stockbildern, von denen du weißt, dass sie existieren 3. Verwende lucide-react-Icons für SVGs oder Logos, falls die Komponente sie benötigt