mehdi-ai-assistant 0.0.1 → 0.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +109 -0
- package/package.json +3 -4
package/README.md
ADDED
|
@@ -0,0 +1,109 @@
|
|
|
1
|
+
<div align="center">
|
|
2
|
+
<h1>mehdi-ai-assistant 🤖 Powered By Mehdi Akbari</h1>
|
|
3
|
+
<p>یک کامپوننت چتبات هوشمند، زیبا و آماده برای پروژههای React و Next.js که با LangChain و Groq قدرت گرفته است.</p>
|
|
4
|
+
|
|
5
|
+
<p>
|
|
6
|
+
<a href="https://www.npmjs.com/package/mehdi-ai-assistant"><img src="https://img.shields.io/npm/v/mehdi-ai-assistant" alt="NPM Version"></a>
|
|
7
|
+
<a href="https://www.npmjs.com/package/mehdi-ai-assistant"><img src="https://img.shields.io/npm/l/mehdi-ai-assistant" alt="License"></a>
|
|
8
|
+
<a href="https://www.npmjs.com/package/mehdi-ai-assistant"><img src="https://img.shields.io/npm/dt/mehdi-ai-assistant" alt="NPM Downloads"></a>
|
|
9
|
+
</p>
|
|
10
|
+
</div>
|
|
11
|
+
|
|
12
|
+
## ✨ ویژگیها
|
|
13
|
+
|
|
14
|
+
- **نصب و استفاده آسان:** در کمتر از ۵ دقیقه ربات را به پروژه خود اضافه کنید.
|
|
15
|
+
- **امنیت بالا:** کلید API شما در سمت سرور محفوظ میماند و هرگز به مرورگر کاربر ارسال نمیشود.
|
|
16
|
+
- **سرعت فوقالعاده:** با استفاده از مدلهای بهینه شده در Groq، پاسخها به سرعت تولید میشوند.
|
|
17
|
+
- **قابلیت شخصیسازی:** به راحتی رنگها و استایل ربات را با وبسایت خود هماهنگ کنید.
|
|
18
|
+
- **سبک و کمحجم:** بدون وابستگیهای سنگین و اضافی.
|
|
19
|
+
|
|
20
|
+
## 🚀 نصب
|
|
21
|
+
|
|
22
|
+
برای نصب پکیج، از دستور زیر استفاده کنید:
|
|
23
|
+
|
|
24
|
+
```bash
|
|
25
|
+
npm install mehdi-ai-assistant
|
|
26
|
+
💡 راهنمای سریع (Quick Start)
|
|
27
|
+
برای استفاده از این پکیج در یک پروژه Next.js (App Router)، مراحل زیر را دنبال کنید.
|
|
28
|
+
قدم ۱: ساخت API Endpoint (سمت سرور)
|
|
29
|
+
برای حفظ امنیت کلید API، منطق ربات در سرور اجرا میشود.
|
|
30
|
+
۱. یک فایل در مسیر src/app/api/chat/route.ts بسازید.
|
|
31
|
+
۲. کدهای زیر را داخل آن قرار دهید:
|
|
32
|
+
code
|
|
33
|
+
TypeScript
|
|
34
|
+
// src/app/api/chat/route.ts
|
|
35
|
+
import { NextResponse } from 'next/server';
|
|
36
|
+
import { AiRobot } from 'mehdi-ai-assistant';
|
|
37
|
+
|
|
38
|
+
export async function POST(req: Request) {
|
|
39
|
+
try {
|
|
40
|
+
const { messages } = await req.json();
|
|
41
|
+
|
|
42
|
+
const bot = new AiRobot({
|
|
43
|
+
apiKey: process.env.GROQ_API_KEY!,
|
|
44
|
+
model: "llama3-8b-8192",
|
|
45
|
+
systemPrompt: "You are a helpful and friendly assistant."
|
|
46
|
+
});
|
|
47
|
+
|
|
48
|
+
const responseContent = await bot.chat(messages);
|
|
49
|
+
return NextResponse.json({ content: responseContent });
|
|
50
|
+
|
|
51
|
+
} catch (error) {
|
|
52
|
+
console.error(error);
|
|
53
|
+
return NextResponse.json({ error: 'Internal Server Error' }, { status: 500 });
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
۳. کلید API خود را در فایل .env.local در ریشه پروژه اضافه کنید:
|
|
57
|
+
code
|
|
58
|
+
Env
|
|
59
|
+
# .env.local
|
|
60
|
+
GROQ_API_KEY=gsk_...
|
|
61
|
+
قدم ۲: اضافه کردن کامپوننت به صفحه (سمت کلاینت)
|
|
62
|
+
حالا کامپوننت ChatBot را در صفحه مورد نظر خود قرار دهید.
|
|
63
|
+
code
|
|
64
|
+
Tsx
|
|
65
|
+
// src/app/page.tsx
|
|
66
|
+
"use client";
|
|
67
|
+
|
|
68
|
+
import { ChatBot } from "mehdi-ai-assistant/react";
|
|
69
|
+
import "mehdi-ai-assistant/dist/react.css";
|
|
70
|
+
|
|
71
|
+
export default function Home() {
|
|
72
|
+
return (
|
|
73
|
+
<div className="flex h-screen items-center justify-center bg-gray-100">
|
|
74
|
+
<div className="w-full max-w-md rounded-xl border bg-white shadow-xl">
|
|
75
|
+
<ChatBot
|
|
76
|
+
apiEndpoint="/api/chat"
|
|
77
|
+
title="دستیار هوشمند"
|
|
78
|
+
welcomeMessage="سلام! چطور میتوانم کمکتان کنم؟"
|
|
79
|
+
/>
|
|
80
|
+
</div>
|
|
81
|
+
</div>
|
|
82
|
+
);
|
|
83
|
+
}
|
|
84
|
+
تمام! ربات شما آماده استفاده است.
|
|
85
|
+
🎨 شخصیسازی استایل
|
|
86
|
+
شما میتوانید به راحتی رنگهای اصلی ربات را با استفاده از متغیرهای CSS (CSS Variables) تغییر دهید. کافیست در فایل CSS گلوبال پروژه خود، این متغیرها را بازنویسی کنید:
|
|
87
|
+
code
|
|
88
|
+
CSS
|
|
89
|
+
/* In your global.css */
|
|
90
|
+
:root {
|
|
91
|
+
--ai-primary: #007bff; /* رنگ اصلی (دکمه ارسال) */
|
|
92
|
+
--ai-primary-fg: #ffffff; /* رنگ متن روی دکمه */
|
|
93
|
+
--ai-user-bg: #007bff; /* رنگ حباب پیام کاربر */
|
|
94
|
+
--ai-user-text: #ffffff; /* رنگ متن پیام کاربر */
|
|
95
|
+
--ai-bot-bg: #f1f1f1; /* رنگ حباب پیام ربات */
|
|
96
|
+
}```
|
|
97
|
+
|
|
98
|
+
## ⚙️ پراپهای کامپوننت (API)
|
|
99
|
+
|
|
100
|
+
| پراپ | تایپ | الزامی | پیشفرض | توضیحات |
|
|
101
|
+
|----------------|-----------|:------:|---------------------------|-------------------------------------------|
|
|
102
|
+
| `apiEndpoint` | `string` | ✅ | - | آدرس API که در قدم ۱ ساختید. |
|
|
103
|
+
| `title` | `string` | ❌ | `"AI Assistant"` | عنوانی که در بالای پنجره چت نمایش داده میشود. |
|
|
104
|
+
| `welcomeMessage`| `string` | ❌ | "سلام! چطور..." | اولین پیامی که ربات به کاربر نشان میدهد. |
|
|
105
|
+
|
|
106
|
+
|
|
107
|
+
## 📄 لایسنس
|
|
108
|
+
|
|
109
|
+
این پروژه تحت لایسنس [ISC](https://opensource.org/licenses/ISC) منتشر شده است.
|
package/package.json
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "mehdi-ai-assistant",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.2",
|
|
4
4
|
"description": "A professional AI Chatbot for Next.js/React powered by LangChain",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"module": "./dist/index.mjs",
|
|
7
7
|
"types": "./dist/index.d.ts",
|
|
8
|
-
|
|
8
|
+
"exports": {
|
|
9
9
|
".": {
|
|
10
10
|
"types": "./dist/index.d.ts",
|
|
11
11
|
"import": "./dist/index.mjs",
|
|
@@ -21,7 +21,6 @@
|
|
|
21
21
|
"files": [
|
|
22
22
|
"dist"
|
|
23
23
|
],
|
|
24
|
-
|
|
25
24
|
"scripts": {
|
|
26
25
|
"build": "tsup",
|
|
27
26
|
"dev": "tsup --watch",
|
|
@@ -55,4 +54,4 @@
|
|
|
55
54
|
"tsup": "^8.5.1",
|
|
56
55
|
"typescript": "^5.0.0"
|
|
57
56
|
}
|
|
58
|
-
}
|
|
57
|
+
}
|