मजकुराकडे जा
Yuvashadcn
shadcn/ui साठी Yuvaमेनू

shadcn/ui साठी Yuva

लाइव्ह चॅट, दस्तऐवज पानांवरील चर्चा आणि मेलिंग लिस्ट साइन-अपसाठी React घटक, तुमच्या shadcn/ui प्रकल्पात कॉपी होतात.

Yuva रजिस्ट्री म्हणजे घटक आणि hooks चा संच, जो shadcn CLI तुमच्या प्रकल्पात कॉपी करते. ते तुमची थीम वापरतात, useyuva क्लायंटद्वारे Yuva शी बोलतात आणि संपादन करणे तुमच्या हातात आहे.

आवश्यकता

  • आधीपासून shadcn/ui वापरणारा प्रकल्प, React आणि Tailwind CSS सह.
  • एक Yuva चॅट चॅनेल आणि त्याची सार्वजनिक की (yuva_pk_…).

चॅनेल सेट करा

  1. Yuva पॅनेलमध्ये सेटिंग्ज, तुमचा इनबॉक्स, चॅनेल उघडा आणि एक चॅट चॅनेल जोडा.
  2. घटक दाखवणारा प्रत्येक origin परवानगी असलेला origin म्हणून जोडा: तुमची साइट आणि तुमचा डेव्हलपमेंट सर्व्हर.
  3. चॅनेलची सार्वजनिक की कॉपी करा. ती गुप्त नाही.
  4. चर्चांसाठी चॅनेलचा चर्चा मोड moderated किंवा open ठेवा. सबस्क्राइब फॉर्मसाठी एक सार्वजनिक मेलिंग लिस्ट जोडा.

की आणि तुमच्या Yuva सर्व्हरचा पत्ता घटकांना द्या, उदाहरणार्थ एन्व्हायर्नमेंटमध्ये:

.env.local
NEXT_PUBLIC_YUVA_SERVER=https://support.example.com
NEXT_PUBLIC_YUVA_CHANNEL=yuva_pk_xxxxxxxxxxxxxxxx

तुमचा पहिला आयटम जोडा

चॅट ब्लॉक इन्स्टॉल करा, मग तो रेंडर करा:

Shell
npx shadcn@latest add https://useyuva.com/r/yuva-chat.json
tsx
import { YuvaChat } from "@/components/yuva-chat"

export function Support() {
  return (
    <YuvaChat
      server={process.env.NEXT_PUBLIC_YUVA_SERVER}
      channel={process.env.NEXT_PUBLIC_YUVA_CHANNEL}
    />
  )
}

आयटम

रजिस्ट्रीमधील सर्व आयटम, साइडबारप्रमाणे गटबद्ध.

ब्लॉक

घटक

Hooks

पुढे →Yuva chat