React client SDK for chat functionality
npm install @ensembleapp/client-sdkA simple React library for chat functionality with built-in AI SDK integration.
``bash`
npm install @ensembleapp/client-sdk
`tsx
import { ChatWidget } from '@ensembleapp/client-sdk'
function App() {
return (
baseUrl: '/api',
token: 'your-jwt-token',
}}
threadId="user-123"
agentId="agent-234"
onMessage={(message) => console.log('New message:', message)}
onError={(error) => console.error('Chat error:', error)}
placeholder="Ask me anything..."
welcomeMessage="Hello! How can I help you today?"
/>
)
}
`
`tsx
import { useChat } from '@ensembleapp/client-sdk'
function CustomChat() {
const { messages, isLoading, sendMessage } = useChat({
api: {
baseUrl: '/api',
token: 'your-jwt-token',
},
threadId: 'user-123',
agentId="agent-234",
})
return (
API Reference
$3
-
api ({ baseUrl: string; token: string; headers? }): Base URL for the chat API, required auth token (sent as Authorization: Bearer ), and optional extra headers
- threadId (string): Thread/session ID (required)
- onMessage? (function): Callback when a new message is received
- onError? (function): Callback when an error occurs
- onFinish? (function): Callback when a conversation finishes
- className? (string): Additional CSS classes
- placeholder? (string): Input placeholder text
- welcomeMessage? (string): Initial welcome message$3
`tsx
const {
messages, // Array of chat messages
isLoading, // Boolean indicating if request is in progress
isError, // Boolean indicating if there's an error
sendMessage, // Function to send a message
stop, // Function to stop current request
setMessages, // Function to manually set messages
} = useChat(config)
``