AI

Chat Widget

Floating chat launcher (bottom-right, with a slow lumen pulse) that springs open into a panel from its own corner.

The launcher pins to its corner with a slow lumen pulse, then springs open into the panel. Replies stream chunk by chunk.

Install

Copies the component source — plus its small internal deps — into your project. You own the code from the first minute.

terminal
npx lumora-ui@latest add chat-widget

Import

Using the workspace package instead? Deep imports keep cold starts lean; the barrel is fully tree-shakable either way.

app/page.tsx
import { ChatWidget } from "@lumora/ui/ai/chat-widget";
// or from the barrel:
import { ChatWidget } from "@lumora/ui";

Props worth knowing

onSend receives the text and history — return a Promise<string> for one reply or an AsyncIterable<string> to stream chunks into the assistant bubble. title, placeholder and initialMessages seed the panel. Props extend the natural HTML element, so className, event handlers, and aria attributes pass straight through.