Import

import { TTS } from 'react-agents';

Usage

The TTS component adds text-to-speech capabilities to your agent, allowing it to speak messages using a specified voice endpoint.

1. Add the component to your agent:

   return (
     <Agent>
       {/* ... */}
       <TTS voiceEndpoint="elevenlabs:scillia:kNBPK9DILaezWWUSHpF9" />
       {/* ... */}
     </Agent>
   );

2. Use the say action in your agent's responses:

   agent.say({ text: "Hello, I can speak!" });

   Or, simply chat with the agent to get them to speak.

Props

• voiceEndpoint (string, optional)
  • Endpoint for the text-to-speech
  • Format is provider:voiceName:voiceId
  • If not provided, will use a default voice

Custom voices

You can create and use custom voices with the USDK CLI. The voice commands allow you to manage custom voices for your agents.

Available Commands

1. List voices

   • Command: voice list
   • Shows all voices associated with your account
   • Displays voice IDs and names for use in voiceEndpoint prop

2. Create a voice

   • Command: voice create <name> <audioFile>
   • Requirements:
     • Audio sample of the voice to clone
     • Supported formats: MP3, WAV
   • Parameters:
     • <name>: Desired name for your voice
     • <audioFile>: Path to your audio sample

3. Test a voice

   • Command: voice play <voiceName> "Your test message"
   • Lets you hear how your created voice sounds

Using Custom Voices

Once created, use your custom voice in the TTS component by setting the voiceEndpoint prop:

<TTS voiceEndpoint="elevenlabs:scillia:kNBPK9DILaezWWUSHpF9" />