@serviceagent/react

@serviceagent/react

React components for ServiceAgent — AI chat, voice agents, and calendar booking for any React app.

Install

npm install @serviceagent/react

Quick Start

Chat Widget

import { Chat } from '@serviceagent/react';

export default function App() {
  return <Chat />;
}

Set environment variables:

NEXT_PUBLIC_SERVICEAGENT_WIDGET_KEY=wid_xxxxx
NEXT_PUBLIC_SERVICEAGENT_API_URL=https://process.serviceagent.ai

Voice Agent

import { VoiceAgent } from '@serviceagent/react';

export default function App() {
  return (
    <VoiceAgent
      token="session_token"
      orgId="org_id"
      voiceAgentId="agent_id"
    />
  );
}

Calendar Booking

import { CalendarBooking } from '@serviceagent/react';

export default function App() {
  return <CalendarBooking bookingKey="your_booking_key" />;
}

Components

Component	Description
<Chat />	Floating AI chat bubble
<ChatIframe />	Chat in iframe (strict CSP)
<CalendarBooking />	Appointment scheduling widget
<VoiceAgent />	Real-time AI voice call
<AivaCallButton />	Voice call toggle button
<AivaTurnIndicator />	Voice turn state indicator
<AivaTranscriptView />	Voice conversation transcript

Hooks

Hook	Description
useServiceAgent()	Control chat: open(), close(), toggle(), send()
useAiva()	Voice state: connection, call, turn, transcript

CLI Setup (30 seconds)

npx @serviceagent/cli add

License

MIT