vowel-vanilla
Vowel Vanilla JavaScript Integration
Initialize a vowel.to voice agent in plain JavaScript applications with predictable startup and session behavior.
Overview
Use this skill when the app is not React-first and you want direct control over:
- Vowel client lifecycle
- Navigation + automation adapters
- Custom action registration
- Session start/stop UI wiring
Core Principles
1) Register Actions Before startSession()
All custom actions must be registered before the first call to startSession(). Actions added afterward are not available to the active session.
More from usevowel/skills
vowel-react
Initialize vowel.to voice agent in React applications (React 19+, Next.js, TanStack Router, React Router) with complete setup including adapters, providers, and custom actions. Use when setting up voice agent integration, configuring navigation adapters, implementing custom voice actions, or integrating state management with voice AI. Covers context-ready initialization (deferred setAppId, loading gate, buildVowelContext, getGameState fallback), apiKey-first token issuer identifiers (appId is a legacy alias), and optional convexUrl/tokenEndpoint overrides. Next.js notes include NEXT_PUBLIC_VOWEL_APP_ID (not VOWEL_APP_ID alone), import { Vowel } from @vowel.to/client (not window.Vowel without the standalone bundle), and keeping VowelProvider client in React state. The skill emphasizes writing to app stores rather than DOM manipulation, with automation harness disabled by default.
12vowel-webcomponent
Initialize vowel.to via the <vowel-voice-widget> web component for framework-agnostic integration. Use when adding a drop-in voice widget to any site and wiring custom actions/events after readiness.
8voweldocs
Add the branded VowelDocs voice-agent paradigm to supported documentation frameworks, especially Astro Starlight projects. Use this when embedding or maintaining the shipped VowelDocs experience in docs, including canonical route maps, SPA navigation adapters, credential modal UI, session/audio persistence, and framework-specific lifecycle workarounds.
3vowel-client
Core @vowel.to/client knowledge shared by all framework skills. Covers installation, connection paradigms (apiKey/appId/tokenProvider/direct token), voiceConfig reference (provider, model, voice, language, STT/TTS overrides, VAD, turn detection), adapter patterns, custom actions, context management, and environment variables. Framework-specific skills (vowel-react, vowel-vanilla, vowel-webcomponent) instruct agents to load this file first.
1