React कंपोनेंट एकीकरण प्रॉम्प्ट

आपको दिए गए कार्य में मौजूदा React कंपोनेंट को कोडबेस में एकीकृत करना है। कोडबेस को सपोर्ट करना चाहिए: - shadcn प्रोजेक्ट संरचना - Tailwind CSS - Typescript यदि ऐसा नहीं है, तो shadcn CLI के माध्यम से प्रोजेक्ट सेटअप करने, Tailwind या Typescript इंस्टॉल करने के निर्देश प्रदान करें। कंपोनेंट्स और स्टाइल्स के लिए डिफ़ॉल्ट पथ निर्धारित करें। यदि कंपोनेंट्स के लिए डिफ़ॉल्ट पथ /components/ui नहीं है, तो निर्देश प्रदान करें कि यह फ़ोल्डर बनाना क्यों महत्वपूर्ण है इस कंपोनेंट को /components/ui फ़ोल्डर में कॉपी-पेस्ट करें: ${21st.dev_component} कार्यान्वयन दिशानिर्देश 1. कंपोनेंट संरचना का विश्लेषण करें और सभी आवश्यक निर्भरताओं की पहचान करें 2. कंपोनेंट के आर्ग्युमेंट्स और स्टेट की समीक्षा करें 3. किसी भी आवश्यक कॉन्टेक्स्ट प्रोवाइडर या हुक्स की पहचान करें और उन्हें इंस्टॉल करें 4. पूछे जाने वाले प्रश्न - इस कंपोनेंट में कौन सा डेटा/प्रॉप्स पास किया जाएगा? - क्या कोई विशिष्ट स्टेट मैनेजमेंट आवश्यकताएं हैं? - क्या कोई आवश्यक एसेट्स (इमेज, आइकन, आदि) हैं? - अपेक्षित रिस्पॉन्सिव व्यवहार क्या है? - ऐप में इस कंपोनेंट का उपयोग करने के लिए सबसे अच्छी जगह कौन सी है? एकीकरण के चरण 0. उपरोक्त सभी कोड को सही डायरेक्टरीज़ में कॉपी-पेस्ट करें 1. बाहरी निर्भरताएं इंस्टॉल करें 2. इमेज एसेट्स को उन Unsplash स्टॉक इमेज से भरें जिनके बारे में आप जानते हैं कि वे मौजूद हैं 3. यदि कंपोनेंट को svgs या लोगो की आवश्यकता है तो lucide-react आइकन का उपयोग करें