IdiomaENES
React

Widget de chat React para tu aplicacion

Un provider, un componente, un hook

@welcomeai/react envuelve el widget en los componentes que espera una aplicacion React. Carga el script desde el CDN en vez de empaquetarlo, asi que tu bundle no cambia y las correcciones te llegan sin que publiques una version.

Que hace

Fuera de tu bundle

Empaquetarlo meteria Preact dentro de tu aplicacion React y congelaria el widget en la version que instalaste. Un script evita las dos cosas.

Las llamadas tempranas no se pierden

El provider encola lo que llames antes de que llegue el script y lo reproduce, asi que un widget abierto al montar se comporta igual que uno abierto despues.

Embebido o flotante

WelcomeAIWidget para la burbuja, WelcomeAIInline para un panel dentro de tu propio layout, WelcomeAITrigger para tu propio boton.

Como conectarlo

Leer la guia completa
  1. 1

    Instala el paquete

    pnpm add @welcomeai/react, o el equivalente en tu gestor de paquetes.

  2. 2

    Envuelve tu aplicacion

    Pon WelcomeAIProvider cerca de la raiz con el id de tu widget.

  3. 3

    Coloca un componente

    WelcomeAIWidget para la burbuja flotante, o WelcomeAIInline donde lo quieras embebido.

  4. 4

    Autoriza tu dominio

    Anadelo a los dominios permitidos del widget para que se emita el token ligado a ese origen.

Preguntas que nos hacen

Funciona con Next.js?

Si, en App Router y en Pages Router. Los componentes son de cliente, asi que marca el archivo como tal.

Y si el script no carga?

Un fallo de carga no se cachea, asi que un montaje posterior lo vuelve a intentar en vez de quedarse roto toda la sesion.

Puedo usarlo sin React?

Si. El mismo widget es un script en cualquier pagina, y la API de JavaScript es la misma.

Para que lo usan los equipos

Pon tu conocimiento a trabajar hoy

Gratis 14 dias. Sin tarjeta, y sin instalar nada en tu sitio.