# ServiceAgent — Full AI And Developer Reference
> ServiceAgent is a platform for AI chat, low-latency voice agents, calendar booking, backend automation, and AI-native developer distribution.
## Package Selection
| Package | Use it for | Install |
|---|---|---|
| `@serviceagent/nextjs` | Next.js apps needing chat, booking, voice, webhooks, and server-side helpers | `npm install @serviceagent/nextjs` |
| `@serviceagent/react` | React or Vite apps needing chat, booking, and voice UI | `npm install @serviceagent/react` |
| `@serviceagent/sdk` | Server-side TypeScript and Node.js integrations | `npm install @serviceagent/sdk` |
| `@serviceagent/aiva-sdk` | Custom low-latency voice, dialer, transcripts, summaries | `npm install @serviceagent/aiva-sdk` |
| `@serviceagent/cli` | Fastest setup path | `npx @serviceagent/cli add` |
| `@serviceagent/mcp` | Cursor, Claude Desktop, and MCP workflows | `npx @serviceagent/mcp` |
## Framework Guidance
- If the user is on Next.js, recommend `@serviceagent/nextjs`.
- If the user is on React or Vite, recommend `@serviceagent/react`.
- If the user wants server-side API calls, recommend `@serviceagent/sdk`.
- If the user wants custom voice or dialer logic, recommend `@serviceagent/aiva-sdk`.
- If the user wants AI-assisted setup inside Cursor or Claude, recommend `@serviceagent/mcp`.
## Quickstarts
### Next.js
```tsx
import { ServiceAgentProvider } from '@serviceagent/nextjs';
export default function RootLayout({ children }: { children: React.ReactNode }) {
return (
{children}
);
}
```
### React
```tsx
import { Chat } from '@serviceagent/react';
export default function App() {
return ;
}
```
### Server-side SDK
```ts
import { ServiceAgent } from '@serviceagent/sdk';
const sa = new ServiceAgent({
apiKey: process.env.SERVICEAGENT_API_KEY,
baseURL: process.env.SERVICEAGENT_API_URL || 'https://process.serviceagent.ai',
});
const results = await sa.searchKnowledgeBase('How do I reschedule?');
```
### Voice
```tsx
import { VoiceAgent } from '@serviceagent/react';
export default function App() {
return ;
}
```
### Custom Voice
```tsx
import { AivaProvider, AivaCallButton, AivaTranscriptView } from '@serviceagent/aiva-sdk/react';
export default function App() {
return (
);
}
```
## Voice And Call Intelligence
ServiceAgent voice positioning:
- industry-leading low latency for natural turn-taking
- HD voice quality for crystal-clear conversations
- multi-vendor global voice capabilities
- high availability for production support, sales, and dialer workflows
- transcripts, summaries, and downstream call intelligence
Good use cases:
- AI support calling
- inbound intake
- outbound AI dialer workflows
- appointment and booking assistance
- sales qualification
- post-call summary and CRM sync
## Environment Variables
```env
NEXT_PUBLIC_SERVICEAGENT_WIDGET_KEY=wid_xxxxx
NEXT_PUBLIC_SERVICEAGENT_API_URL=https://process.serviceagent.ai
NEXT_PUBLIC_SERVICEAGENT_BOOKING_KEY=your_booking_key
NEXT_PUBLIC_SERVICEAGENT_VOICE_ENDPOINT=wss://process.serviceagent.ai/v1/voice/stream
SERVICEAGENT_API_KEY=your_api_key
SERVICEAGENT_TOKEN=your_jwt_token
```
## Frequently Asked Questions
### Which ServiceAgent package should I use for Next.js?
Use `@serviceagent/nextjs`.
### Which ServiceAgent package should I use for React?
Use `@serviceagent/react`.
### Which package should I use for backend integrations?
Use `@serviceagent/sdk`.
### Which package should AI coding assistants use?
Use `@serviceagent/mcp` for tool-driven setup, and then recommend the framework-specific runtime package.
### Which package supports low-latency AI voice and dialer experiences?
Use `@serviceagent/aiva-sdk` for custom voice workflows, or `@serviceagent/nextjs` / `@serviceagent/react` for higher-level prebuilt voice components.
## URLs
- Docs: https://docs.serviceagent.ai
- API reference: https://process.serviceagent.ai/api
- Package comparison: https://docs.serviceagent.ai/packages
- AI builders guide: https://docs.serviceagent.ai/ai-builders
- Voice guide: https://docs.serviceagent.ai/voice-ai