ai_assistant_ui

A customizable, modern, and futuristic AI Chat UI library for Flutter. Built with dynamic light/dark glassmorphism themes, markdown support, code highlighting, floating capsule input, and multi-AI provider support (Google Gemini, OpenAI, Claude, Ollama).

---

✨ Features

• 🎨 Futuristic UI: Glassmorphic styling with smooth message bubbles, timestamps, and responsive layouts.
• 🌓 Dynamic Light/Dark Themes: Easily sync with Theme.of(context).brightness or toggle via built-in ☀️ / 🌙 app bar controls.
• 🤖 Multi-AI Provider Integration: Connect seamlessly to:
  • Google Gemini (GeminiProvider)
  • OpenAI (OpenAIProvider)
  • Anthropic Claude (ClaudeProvider)
  • Ollama Local LLMs (OllamaProvider)
  • Custom AI Backends (CustomProvider)
• 💾 Session History & Persistence: Built-in support for offline storage via HiveChatStorage or in-memory MemoryChatStorage.
• 💬 Rich Formatting & Code Actions: Full GFM Markdown support with syntax-highlighted code blocks and single-tap copy buttons.
• ⌨️ Capsule Input Bar: Single-container rounded input bar with circular Send (Icons.arrow_upward_rounded) and Stop Generation (Icons.stop_rounded) buttons.

---

🚀 Getting Started

Add ai_assistant_ui to your pubspec.yaml:

dependencies:
  ai_assistant_ui: ^0.0.1

Or run:

flutter pub add ai_assistant_ui

---

💡 Usage Example

import 'package:flutter/material.dart';
import 'package:ai_assistant_ui/ai_assistant_ui.dart';

class ChatScreen extends StatelessWidget {
  const ChatScreen({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: AIChatView(
        provider: GeminiProvider(
          apiKey: 'YOUR_GEMINI_API_KEY',
          model: 'gemini-1.5-flash',
        ),
        config: const AIChatConfig(
          title: 'AravGPT',
          placeholderText: 'Ask anything...',
          welcomeMessage: 'How can I help you today?',
        ),
        isDarkMode: Theme.of(context).brightness == Brightness.dark,
        onThemeToggle: () {
          // Trigger your app's theme toggle handler
        },
      ),
    );
  }
}

---

📸 Screenshots

Dark Theme	Light Theme

---

🤖 AI Provider Configurations

1. Google Gemini

final provider = GeminiProvider(
  apiKey: 'YOUR_GEMINI_API_KEY',
  model: 'gemini-1.5-flash', // or 'gemini-1.5-pro'
);

2. OpenAI (ChatGPT)

final provider = OpenAIProvider(
  apiKey: 'YOUR_OPENAI_API_KEY',
  model: 'gpt-4o-mini',
);

3. Anthropic Claude

final provider = ClaudeProvider(
  apiKey: 'YOUR_CLAUDE_API_KEY',
  model: 'claude-3-5-sonnet-20240620',
);

4. Ollama (Local AI)

final provider = OllamaProvider(
  baseUrl: 'http://localhost:11434',
  model: 'llama3',
);

5. Custom Backend Provider

final provider = CustomProvider(
  providerId: 'custom-backend',
  displayName: 'My Custom AI',
  streamHandler: (history, prompt, attachments, cancelToken) async* {
    // Stream response text chunks from your backend API
    yield 'Response chunk 1';
    yield 'Response chunk 2';
  },
);

---

🔐 Security & API Key Best Practices

---

🎨 Theme & Config Customization

Configuration Options (AIChatConfig)

Option	Type	Default	Description
title	String	'AravGPT'	App bar title text
placeholderText	String	'Ask anything...'	Input field placeholder text
welcomeMessage	String	'How can I help you today?'	Welcome title displayed on empty state
enableHistoryDrawer	bool	true	Show side drawer menu with previous sessions
enableMarkdown	bool	true	Render assistant responses formatted in Markdown
enableCodeCopy	bool	true	Show copy button inside code blocks
enableStopGeneration	bool	true	Allow users to stop streaming responses

---

💾 Storage Options

// Persistent local storage via Hive
final storage = HiveChatStorage();

// Temporary in-memory storage
final storage = MemoryChatStorage();

---

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.