Official React SDK for Voni AI Infrastructure
npm install @voniai/reactThe official React SDK for Voni AI - Programmable AI Infrastructure.
``bash`
npm install @voniai/react @voniai/nodejsor
yarn add @voniai/react @voniai/nodejs
`tsx
import { VoniProvider } from '@voniai/react';
function App() {
return (
// Option 1: Public Widget (No API Key required)
// Option 2: Internal Tools (Load API Key from Env)
// Supports: REACT_APP_VONI_API_KEY, VITE_VONI_API_KEY, NEXT_PUBLIC_VONI_API_KEY
//
//
//
);
}
`
> Security Warning: Do NOT include your Secret API Key in client-side code for public applications. Only use API Keys in the frontend for internal tools behind authentication.
`tsx
import { useChat } from '@voniai/react';
function MyChatComponent() {
const { messages, sendMessage, isLoading } = useChat({
projectId: 'your_project_id'
});
return (
$3
`tsx
import { VoniWidget } from '@voniai/react';function App() {
return (
My Website
);
}
`Features
- Headless Hooks: Build your own custom UI using
useChat.
- Context Managed: Shared client instance via VoniProvider.
- Type-Safe: Full TypeScript support.
- Plug-and-Play: Easy widget injection with VoniWidget.Hooks API
$3
Returns the underlying Voni client instance for advanced usage.$3
- messages: Array of message objects.
- sendMessage(content): Async function to send a message.
- isLoading: Boolean indicating if a response is pending.
- sessionId: Current chat session ID.
- clearMessages()`: Resets the message history.MIT