Chat

npm install @telzino/voice

import { TelzinoChat } from '@telzino/voice';

const chat = new TelzinoChat({
  publishableKey: 'pk_live_...',
  agentId: '3f1c2a4e-8b7d-4c3a-9e2f-1a2b3c4d5e6f',
});

chat.on('message', (m) => render(m));          // { id, role: 'user' | 'agent', text, timestamp }
chat.on('typing', (busy) => showTyping(busy)); // the agent is working on a reply
chat.on('error', (err) => console.warn(err.code, err.message));

await chat.load();                     // the earlier conversation, for a returning visitor
await chat.send('Do you open on Sunday?');

import { useState } from 'react';
import { TelzinoProvider, useChat } from '@telzino/react';

function ChatBox({ agentId }: { agentId: string }) {
  const { messages, typing, error, send } = useChat(agentId);
  const [text, setText] = useState('');
  return (
    <form onSubmit={(e) => { e.preventDefault(); void send(text); setText(''); }}>
      {messages.map((m) => <p key={m.id} className={m.role}>{m.text}</p>)}
      {typing && <p className="typing">…</p>}
      {error && <p role="alert">{error.message}</p>}
      <input value={text} onChange={(e) => setText(e.target.value)} />
    </form>
  );
}

export default function App() {
  return (
    <TelzinoProvider config={{ publishableKey: 'pk_live_...' }}>
      <ChatBox agentId="3f1c2a4e-8b7d-4c3a-9e2f-1a2b3c4d5e6f" />
    </TelzinoProvider>
  );
}