@daxap/ai-chat-bot

A modern, customizable AI chat bot component for React applications.

Features

• 🤖 AI-powered chat interface
• 🎨 Modern and responsive design
• 🔒 Secure client authentication
• 📝 Markdown support
• 🎯 Customizable styling
• 🔍 Verbose mode for debugging

Installation

npm install @daxap/ai-chat-bot
# or
yarn add @daxap/ai-chat-bot

Usage

import { AIChatBot } from "@daxap/ai-chat-bot";
import "@daxap/ai-chat-bot/styles.css";

function App() {
  return (
    <AIChatBot
      clientId="your-client-id"
      clientSecret="your-client-secret"
      endpoint="your-api-endpoint"
      placeholder="Type your message here..."
      className="custom-class"
      verbose={true}
    />
  );
}

Props

| Prop | Type | Required | Description | | -------------- | ------- | -------- | -------------------------------------------- | | clientId | string | Yes | The client ID for the chat bot | | clientSecret | string | Yes | The client secret for the chat bot | | endpoint | string | Yes | The API endpoint for the chat bot | | className | string | No | Additional CSS class name for custom styling | | placeholder | string | No | Placeholder text for the input field | | verbose | boolean | No | Enable verbose mode for debugging |

Styling

The component comes with default styles that can be customized using Tailwind CSS. You can override the default styles by:

1. Importing the default styles:

import "@daxap/ai-chat-bot/styles.css";

2. Adding your own custom classes through the className prop.

Dependencies

This package requires React 18.2.0 or higher and uses the following peer dependencies:

• React
• React DOM

Development

To build the package:

npm run build

To test the package:

npm test

License

ISC © Mustafa Gul