Lompat ke konten
Yuvashadcn
Yuva untuk shadcn/uiMenu

Yuva untuk shadcn/ui

Komponen React untuk obrolan langsung, diskusi halaman dokumentasi, dan pendaftaran milis, disalin ke proyek shadcn/ui Anda.

Registri Yuva adalah kumpulan komponen dan hook yang disalin CLI shadcn ke proyek Anda. Mereka memakai tema Anda, berbicara dengan Yuva lewat klien useyuva, dan bebas Anda ubah.

Persyaratan

  • Proyek yang sudah memakai shadcn/ui, dengan React dan Tailwind CSS.
  • Kanal obrolan Yuva dan kunci publiknya (yuva_pk_…).

Siapkan kanal

  1. Di panel Yuva, buka Pengaturan, kotak masuk Anda, Kanal, lalu tambahkan kanal obrolan.
  2. Tambahkan setiap origin yang akan menampilkan komponen sebagai origin yang diizinkan: situs Anda dan server pengembangan Anda.
  3. Salin kunci publik kanal. Kunci ini bukan rahasia.
  4. Untuk diskusi, atur mode diskusi kanal ke moderated atau open. Untuk formulir berlangganan, tambahkan milis publik.

Berikan kunci dan alamat server Yuva Anda ke komponen, misalnya lewat environment:

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

Tambahkan item pertama Anda

Instal blok obrolan, lalu render:

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}
    />
  )
}

Item

Semua item di registri, dikelompokkan seperti di bilah samping.

Blok

Komponen

Hook

Berikutnya →Yuva chat