Docs

Construye con Blind Agents.

Guías cortas y código copiable. Cualquier integración funciona en menos de 10 minutos — si te toma más, es bug nuestro.

Sitios web

5 integraciones

HTML / Sitio estático

/docs#html

Drop-in script. Funciona en cualquier sitio sin framework. El widget se inyecta como un iframe aislado.

  1. Copia el agent ID desde Agents. No necesitas API key para el chat.
  2. Pega el script antes del cierre de </body>.
  3. El widget aparece como un FAB en la esquina inferior derecha.
<script
  src="https://cdn.blindagents.com/chat.js"
  data-agent-id="YOUR_AGENT_UUID"
  defer
></script>

React

/docs#react

Componente React tipado. Mismo paquete oficial: `@duvandroid/react-blind-agents`. Compatible con Suspense.

  1. Instala el paquete con tu manejador favorito.
  2. Monta `<ChatWidget>` una vez en la raíz de tu app.
  3. Pásale tu `agentId` (y, opcional, `primaryColor` y `position`). Sin API key.
pnpm add @duvandroid/react-blind-agents
# o
npm install @duvandroid/react-blind-agents

Next.js

/docs#nextjs

Compatible con App Router y Pages Router. Importa desde `@duvandroid/react-blind-agents/next` para el wrapper que maneja `next/script` por ti.

  1. Instala `@duvandroid/react-blind-agents`.
  2. Importa `ChatWidget` desde la subruta `/next`.
  3. Monta el widget dentro del `<body>` de tu layout raíz (App Router) o en `_app` (Pages Router).
import { ChatWidget } from "@duvandroid/react-blind-agents/next";

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="es">
      <body>
        {children}
        <ChatWidget
          agentId={process.env.NEXT_PUBLIC_BA_AGENT_ID!}
          primaryColor="#4f46e5"
          strategy="afterInteractive"
        />
      </body>
    </html>
  );
}

Shopify

/docs#shopify

App oficial en el Shopify App Store. Sincroniza productos, pedidos y clientes para que el agente conteste con contexto comercial.

  1. Instala Blind Agents desde el Shopify App Store.
  2. Aprueba los scopes de lectura de catálogo y pedidos.
  3. El widget aparece automáticamente en tu storefront.

Liquid override (opcional) · html

{%- comment -%} theme.liquid — pegar antes de </body> {%- endcomment -%}
<script
  src="https://cdn.blindagents.com/chat.js"
  data-agent-id="{{ settings.ba_agent_id }}"
  data-external-id="{{ customer.id }}"
  data-primary-color="#4f46e5"
  defer
></script>

WordPress

/docs#wordpress

Plugin oficial. Instalación en 1 click sin tocar código. Compatible con WooCommerce.

  1. Busca "Blind Agents" en WordPress → Plugins → Add new.
  2. Activa el plugin y pega tu agent ID.
  3. El widget se inyecta automáticamente en todas las páginas.

Functions.php override · html

<?php
add_action('wp_footer', function () {
  $agent = get_option('blindagents_agent_id');
  if (!$agent) return;
  printf(
    '<script src="https://cdn.blindagents.com/chat.js" data-agent-id="%s" defer></script>',
    esc_attr($agent)
  );
});

Developers

3 integraciones

REST API

/docs#rest-api

Todo lo que la UI hace, la API también. OpenAPI 3.1, generación de tipos con `openapi-typescript`.

  1. Genera un token desde Settings → API Keys.
  2. Usa `Authorization: Bearer <token>` en cada request.
  3. Para webhooks valida el header `X-BA-Signature` con HMAC-SHA256.
curl https://api.blindagents.com/v1/contacts \
  -H "Authorization: Bearer $BA_TOKEN" \
  -H "Content-Type: application/json"

Webhooks

/docs#webhooks

Eventos en tiempo real con HMAC firmado. Retries automáticos con backoff exponencial.

  1. Configura el endpoint en Settings → Webhooks.
  2. Recibirás eventos: `conversation.started`, `message.received`, `appointment.created`, `pipeline.moved`, etc.
  3. Valida la firma con tu webhook secret.
  4. Responde 2xx en menos de 5 segundos o el evento entra en cola de retry.
import crypto from "node:crypto";
import express from "express";

const app = express();
app.use(express.raw({ type: "application/json" }));

app.post("/webhooks/ba", (req, res) => {
  const signature = req.header("X-BA-Signature") ?? "";
  const expected = crypto
    .createHmac("sha256", process.env.BA_WEBHOOK_SECRET!)
    .update(req.body)
    .digest("hex");

  if (!crypto.timingSafeEqual(Buffer.from(signature), Buffer.from(expected))) {
    return res.status(401).send("invalid signature");
  }

  const event = JSON.parse(req.body.toString());
  switch (event.type) {
    case "appointment.created":
      // sync to your calendar
      break;
    case "conversation.started":
      // notify support
      break;
  }
  res.sendStatus(200);
});

Agent tools (MCP)

/docs#mcp-tools

Adjunta tus propias herramientas al agente vía Model Context Protocol. El agente las invoca con razonamiento basado en contexto.

  1. Implementa un servidor MCP siguiendo la spec (stdio o HTTP).
  2. Registra el servidor en Settings → Agents → Tools.
  3. El agente descubre las tools y las llama cuando son relevantes.

Tool MCP en TypeScript · ts

import { Server } from "@modelcontextprotocol/sdk/server";

const server = new Server({ name: "inventory", version: "1.0.0" });

server.tool("check_stock", {
  description: "Verifica disponibilidad de un producto",
  inputSchema: {
    type: "object",
    properties: { sku: { type: "string" } },
    required: ["sku"],
  },
}, async ({ sku }) => {
  const stock = await db.query("SELECT quantity FROM inventory WHERE sku = $1", [sku]);
  return { content: [{ type: "text", text: `Stock: ${stock}` }] };
});

server.connect();

Canales

1 integraciones

WhatsApp Business

/docs#whatsapp

Conexión vía WhatsApp Business API. Multi-número, plantillas, multimedia, listas de difusión.

  1. Inicia el flujo OAuth en Settings → Channels → WhatsApp.
  2. Verifica tu número y display name con Meta.
  3. Sube tus plantillas (24h fuera de ventana de servicio).
  4. El agente empieza a recibir y responder mensajes automáticamente.

Enviar plantilla · bash

curl https://api.blindagents.com/v1/whatsapp/send \
  -X POST \
  -H "Authorization: Bearer $BA_TOKEN" \
  -d '{
    "to": "+573001234567",
    "template": "appointment_reminder",
    "language": "es",
    "components": [
      { "type": "body", "parameters": [{ "type": "text", "text": "10:30am" }]}
    ]
  }'

Automatización

1 integraciones

Zapier

/docs#zapier

App oficial en Zapier. Conecta Blind Agents con +5,000 apps sin escribir código.

  1. Conecta tu cuenta de Blind Agents en zapier.com.
  2. Elige triggers: nueva conversación, cita agendada, contacto creado, ticket abierto.
  3. Elige acciones: enviar mensaje, mover en pipeline, crear contacto, agendar cita.
Blind Agents