Reference - Bravilo Docs

El Chatbot está disponible a través de nuestro CDN como un archivo JavaScript único o a través de NPM como un paquete de componente React.

HTML
React

<script type="module">
import Chatbox from 'https://cdn.jsdelivr.net/npm/@bravilohq/embeds@latest/dist/chatbox/index.js';

Chatbox.initBubble({
agentId: 'TU_AGENT_ID',
});

</script>

import { Chatbox } from '@bravilohq/embeds';

function App() {
return (
<Chatbox
agentId="TU_AGENT_ID"
contact={{
firstName: 'John',
lastName: 'Doe',
email: 'customer@email.com',
phoneNumber: '+33612345644',
userId: '42424242',
initialMessages={[
'Hola Georges, ¿cómo estás hoy?',
'¿Cómo puedo ayudarte?',
]}
context="El usuario con quien estás hablando es John. Comienza saludándolo por su nombre."
/>
);

Atributos / Props

HTML
React

<script type="module">
import Chatbox from 'https://cdn.jsdelivr.net/npm/@bravilohq/embeds@latest/dist/chatbox/index.js';

Chatbox.initBubble({
agentId: 'TU_AGENT_ID',

// Si se proporciona creará un contacto para el usuario y lo vinculará a la conversación
contact: {
firstName: 'John',
lastName: 'Doe',
email: 'customer@email.com',
phoneNumber: '+33612345644',
userId: '42424242',
},
// Sobrescribir mensajes iniciales
initialMessages: [
'Hola Georges, ¿cómo estás hoy?',
'¿Cómo puedo ayudarte?',
],
// El contexto proporcionado se agregará al prompt del sistema del Agente
context: "El usuario con quien estás hablando es John. Comienza saludándolo por su nombre.",

});

</script>

<Chatbox
agentId="TU_AGENT_ID"
contact={{
firstName: 'John',
lastName: 'Doe',
email: 'customer@email.com',
phoneNumber: '+33612345644',
userId: '42424242',
initialMessages={[
'Hola Georges, ¿cómo estás hoy?',
'¿Cómo puedo ayudarte?',
]}
context="El usuario con quien estás hablando es John. Comienza saludándolo por su nombre."
/>

agentId

string

required

ID del Agente

contact

string

Show propiedades

firstName

string

Nombre

lastName

string

Apellido

string

phoneNumber

string

Número de teléfono

userId

string

ID de usuario personalizado

initialMessages

string array

Mensajes iniciales del Agente

context

string

Contexto extra que se agregará al prompt del sistema del Agente

Métodos

open

solo widget de burbuja

Abrir Chatbox de Burbuja

const widget = await Chatbox.initBubble({
agentId: 'TU_AGENT_ID',
widget.open()

solo widget de burbuja

Cerrar Chatbox de Burbuja

const widget = await Chatbox.initBubble({
agentId: 'TU_AGENT_ID',
widget.close()

toggle

solo widget de burbuja

Alternar Chatbox de Burbuja

const widget = await Chatbox.initBubble({
agentId: 'TU_AGENT_ID',
widget.toggle()

createNewConversation

Crear Nueva Conversación

const widget = await Chatbox.initBubble({
agentId: 'TU_AGENT_ID',
widget.createNewConversation()

​Atributos / Props

​Métodos

Atributos / Props

Métodos