sammy-sdk-react
v0.2.2
Published
React hooks and provider for the Sammy AI agent client (useSammyChat, useSammyStream, SammyProvider).
Maintainers
esammyReadme
sammy-sdk-react
React hooks and provider for the Sammy AI agent client.
sammy-sdk-react wraps sammy-sdk-client in idiomatic React: a single <SammyProvider> at the top of your tree, and hooks (useSammyChat, useSammyStream, ...) anywhere below.
For a fully-styled drop-in widget see sammy-sdk-ui.
Install
npm install sammy-sdk-reactreact (>=18) is a peer dependency — bring your own.
Quick start
// app/layout.tsx (Next.js App Router)
"use client";
import { SammyProvider } from "sammy-sdk-react";
export default function RootLayout({ children }: { children: React.ReactNode }) {
return (
<html>
<body>
<SammyProvider endpoint="/api/chat">{children}</SammyProvider>
</body>
</html>
);
}// app/chat.tsx
"use client";
import { useSammyChat } from "sammy-sdk-react";
export function Chat() {
const { messages, send, isStreaming, streamingText } = useSammyChat();
return (
<div>
{messages.map((m, i) => (
<p key={i}><b>{m.role}:</b> {m.content}</p>
))}
{isStreaming && <p><b>assistant:</b> {streamingText}…</p>}
<button onClick={() => send("hello")} disabled={isStreaming}>Send</button>
</div>
);
}Hooks
| Hook | What it gives you |
|---|---|
| useSammyChat({ conversationId?, initialMessages?, onMessage?, onToolCall?, onError? }) | High-level chat: messages, send, isLoading, isStreaming, streamingText, activeAgent, activeToolCall, error, clear, conversationId |
| useSammyStream() | Low-level stream control: startStream, abort, isStreaming |
| useSammyAgent() | Track active agent + history |
| useSammyStatus() | Endpoint connectivity + latency |
<SammyProvider> accepts the same config as SammyClient — endpoint, headers, conversationId, retries, timeout.
License
MIT