A floating AI-powered hybrid chatbot assistant widget for modern web apps.
This component allows users to upload PDFs, ingest URLs, and chat with an AI assistant. Designed as a bottom-right expandable widget, it delivers a seamless support experience similar to Intercom/Drift but powered by your own AI stack.
- 📂 Document ingestion – Upload PDFs or enter URLs for knowledge ingestion.
- 🔎 Contextual AI chat – Ask questions with responses grounded in uploaded documents.
- 🎨 Modern UI – Built with TailwindCSS + Lucide icons.
- ⚡ Streaming responses – Real-time token-by-token assistant replies.
- 🧭 Floating widget – Starts as a round bot icon → expands into full chat window.
- 🎚️ Animated upload panel – Upload section auto-hides after ingestion.
- 🛠️ Expandable / Collapsible – Open/close with a single click.
| Layer | Technology |
|---|---|
| Frontend | Next.js 15, React 18 |
| Styling | TailwindCSS, Lucide React Icons |
| Backend API | Next.js API Routes (/api/chat, /api/ingest) |
| AI Model Serving | Gemini API, OpenAI/GPT (pluggable) |
| Vector Database | Qdrant for document embeddings |
| Streaming | Native Web Streams API for token-by-token updates |
git clone https://github.com/yourusername/ai-chat-widget.git
cd ai-chat-widget