@partython/brain-react

Drop-in React chat widget for the Partython AI brain.

npm install @partython/brain-react

Quick start

import { ChatWidget } from '@partython/brain-react';

export default function App() {
  return (
    <>
      {/* your app */}
      <ChatWidget apiKey="pk_live_..." />
    </>
  );
}

That's it. The widget renders a floating launcher button. Clicking opens a chat panel that talks to https://brain.partython.com/api/v1/respond using the API key, persists conversation history in localStorage, and auto-generates a stable channel_user_id per visitor.

Props

| Prop | Type | Default | Description | |------------------|-----------------------------------|-------------------------------------|--------------------------------------------------------------| | apiKey | string (required) | — | Your pk_live_... key | | baseUrl | string | https://brain.partython.com | Override for self-hosted | | channelUserId | string | auto-generated, persisted | Stable conversation participant id | | theme | 'light' \| 'dark' | 'light' | Color scheme | | position | 'bottom-right' \| 'bottom-left' \| 'top-right' \| 'top-left' | 'bottom-right' | Launcher placement on screen | | title | string | 'Chat with us' | Header text | | welcomeMessage | string | 'Hi! How can I help today?' | First assistant turn | | placeholder | string | 'Type a message...' | Input placeholder | | primaryColor | string | '#6366F1' | Hex color for launcher / user bubble / send button |

Headless hook

If you'd rather build your own UI:

import { useBrain } from '@partython/brain-react';

function CustomChat() {
  const { send } = useBrain({ apiKey: 'pk_live_...' });

  const onClick = async () => {
    const result = await send("I need a 5-year-old's birthday party kit");
    console.log(result.response);
  };

  return <button onClick={onClick}>Ask</button>;
}

send returns the brain's full response: { response, assistant_name, request_id, metadata }. Throws on non-2xx errors with .status and .body attached.

Persistence

The widget stores up to 50 most-recent messages in localStorage under a key scoped to (apiKey, channelUserId). Conversation survives reloads and tab restores. Clearing browser storage resets it.

Server-side rendering

The widget guards every localStorage and window access. SSR builds (Next.js, Remix, Astro) won't crash — first hydration just starts a fresh session.

Accessibility

• Launcher: aria-label="Open chat"
• Panel: role="dialog" with aria-label
• Close button: aria-label="Close"
• Input: aria-label="Message input"
• Send: aria-label="Send"
• Enter submits, Shift+Enter inserts newline

License

MIT