Sari la conținut
Yuvashadcn
Yuva pentru shadcn/uiMeniu

Yuva pentru shadcn/ui

Componente React pentru chat live, discuții pe paginile de documentație și înscrierea la liste de corespondență, copiate în proiectul tău shadcn/ui.

Registrul Yuva este un set de componente și hooks pe care CLI-ul shadcn le copiază în proiectul tău. Folosesc tema ta, comunică cu Yuva prin clientul useyuva și le poți edita.

Cerințe

  • Un proiect care folosește deja shadcn/ui, cu React și Tailwind CSS.
  • Un canal de chat Yuva și cheia lui publică (yuva_pk_…).

Configurează un canal

  1. În panoul Yuva, deschide Setări, căsuța ta și Canale, apoi adaugă un canal de chat.
  2. Adaugă ca origine permisă fiecare origine care va afișa componentele: site-ul tău și serverul de dezvoltare.
  3. Copiază cheia publică a canalului. Nu este un secret.
  4. Pentru discuții, setează modul de discuții al canalului la moderated sau open. Pentru formularul de înscriere, adaugă o listă de corespondență publică.

Dă componentelor cheia și adresa serverului tău Yuva, de exemplu în mediu:

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

Adaugă primul tău element

Instalează blocul de chat, apoi randează-l:

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

Elemente

Toate elementele registrului, grupate ca în bara laterală.

Blocuri

Componente

Hooks

Următorul →Yuva chat