React hooks + Provider for building chat UIs
React hooks + PersonaProvider for building chat UIs against any Persona backend (runtime or adapters).
Client-side only — never holds a credential.
baseUrlpoints to your own mounted runtime (e.g./api/persona).
See .
See .
npm install @personaai/reactimport { PersonaProvider, useChat } from '@personaai/react';
function App() { return ( <PersonaProvider baseUrl="/api/persona" defaultAgentId="..."> <Chat /> </PersonaProvider> );}
function Chat() { const { messages, input, setInput, handleSubmit, isStreaming } = useChat({ agentId: '...' }); return ( <div> {messages.map(m => <div key={m.id}>{m.content}</div>)} <form onSubmit={handleSubmit}> <input value={input} onChange={e => setInput(e.target.value)} /> <button disabled={isStreaming}>Send</button> </form> </div> );}