An easy to use react client for building generative ai application using Rapida platform.
npm install rapida-reactThe VoiceAgent library provides a set of components, hooks, and utilities for integrating AI-powered voice assistants into applications. It supports real-time messaging, audio device management, and connection handling for seamless interaction.
To install the package, run:
``sh`
npm install rapida-react@latest
or using Yarn:
`sh`
yarn add rapida-react@latest
Import the necessary components and hooks from rapida-react@latest:
`tsx
import {
Channel,
ConnectionState,
MediaDeviceFailure,
ConnectionConfig,
AgentConfig,
} from "rapida-react";
import {
BrandIcon,
UserIcon,
MessagingAction,
ConversationMessages,
VoiceAgent,
VoiceAgentContext,
useConnectAgent,
useDisconnectAgent,
useInputModeToggleAgent,
useMicInputToggleAgent,
useSpeakerOuputToggleAgent,
useMultiband3DSpeakerTrackVolume,
useMultibandMicrophoneTrackVolume,
useSelectInputDeviceAgent,
} from "rapida-react";
`
Here is an example of how to use VoiceAgentContext.Provider to set up a voice agent:
`tsx`
new VoiceAgent(
new ConnectionConfig({
authorization: YOUR_TOKEN,
}),
new AgentConfig(ASSISTANT_ID).addArgument("key", "val")
)
}
>
brandIcon={BrandIcon}
className="h-full overflow-auto !pb-40 no-scrollbar"
intialConversations={[
{
role: "system",
messages: [
"I am Yuuki",
"An AI-powered coach to help you master the toughest challenges at your workplace.",
],
},
]}
/>
placeholder="How can I help you overcome a challenge?"
/>
The following components, hooks, and utilities are available for import:
- Channel: Defines communication channels.ConnectionState
- : Represents the state of a voice agent connection.MediaDeviceFailure
- : Handles media device errors.ConnectionConfig
- : Configures the connection settings for a voice agent.AgentConfig
- : Configures the agent settings, including parameters and keywords.
- BrandIcon: Displays the brand's representative icon.UserIcon
- : Displays the user's representative icon.MessagingAction
- : A messaging input component for user interactions.ConversationMessages
- : Manages and displays the conversation flow.
- VoiceAgent: The core AI voice agent instance.VoiceAgentContext
- : Provides the voice agent's context for managing interactions.
- useConnectAgent: Establishes a connection to the voice agent.useDisconnectAgent
- : Disconnects the agent from the session.useInputModeToggleAgent
- : Toggles between different input modes.useMicInputToggleAgent
- : Enables or disables microphone input.useSpeakerOuputToggleAgent
- : Enables or disables speaker output.useMultiband3DSpeakerTrackVolume
- : Adjusts multiband volume for speaker tracks.useMultibandMicrophoneTrackVolume
- : Adjusts multiband volume for microphone tracks.useSelectInputDeviceAgent`: Selects and manages input audio devices.
-
This project is licensed under the MIT License.