@hostwebhook/voice-widget

Framework-agnostic voice agent widget for HostWebhook. Renders a <hw-voice> Web Component (works in plain HTML, React, Vue, Svelte, Astro, etc.) plus an optional typed React wrapper at @hostwebhook/voice-widget/react.

The widget connects the visitor's browser directly to the configured voice provider (ElevenLabs in v0.x, Vapi/Retell coming) over WebRTC. HostWebhook provisions the agent + handles the agent's tool webhooks; the audio loop itself never passes through our infra. That's by design — sub-second latency stays solved by the provider, our value lives in the workflow + RAG + audit layer.

Install

npm install @hostwebhook/voice-widget

The provider SDK is loaded lazily from a CDN (esm.sh by default) the first time the user starts a call — no audio plumbing in your baseline bundle.

Quick start (HTML)

<script type="module" src="https://cdn.jsdelivr.net/npm/@hostwebhook/voice-widget/dist/index.mjs"></script>

<hw-voice
  agent-id="agent_abc123"
  voice-provider="elevenlabs"
  primary-color="#7c3aed">
</hw-voice>

Quick start (React)

import { HwVoice } from '@hostwebhook/voice-widget/react';

<HwVoice
  agentId="agent_abc123"
  voiceProvider="elevenlabs"
  primaryColor="#7c3aed"
/>

Status

• v0.1 — minimal Web Component, ElevenLabs driver, public agents
• v0.2 — premium UI (animated orb, audio levels, transcript, mute, volume)
• v0.3 — signed sessions via HW backend (/voice-sessions/start), dashboard auto-pin
• v1.0 — Vapi + Retell drivers, full docs

License

MIT