Persona: ویجت چت هوش مصنوعی برای هر سایتی
جاوااسکریپت
فرانتاند
هوش مصنوعیخلاصهٔ کاملتر
Persona یه ویجت چت هوش مصنوعیه که با TypeScript نوشته شده، با Vanilla JS رندر میشه و هیچ وابستگی به فریمورک نداره. ایدهش اینه که یه رابط کاربری آماده برای دستیار هوش مصنوعیات بده که تقریباً روی هر سایت و محصولی سوار میشه — از جمله روی چیزی که قبلاً با ریاکت یا ویو ساختی. تیم سازنده صادقانه میگه اگه بدون JSX ساختن AI اذیتت میکنه، احتمالاً Assistant UI یا CopilotKit یا AI Elements ورسل بیشتر به کارت میآد.
نصبش دو مسیر داره: از npm با هر باندلری، یا فقط با یه تگ اسکریپت ساده و بدون هیچ مرحلهی بیلد. سه چیدمان اصلی هم داره که همه با تغییر فیلد launcher جابهجا میشن: شناور (لانچر گوشهی صفحه، پیشفرض)، داکد (پنل کناری که کنار اپت میشینه) و تمامصفحه.
import { initAgentWidget } from "@runtypelabs/persona";
// Floating: the launcher in the corner is the default
initAgentWidget({ target: "#chat", config: { apiUrl } });
// Docked: wrap a region, reveal a side panel
initAgentWidget({ target: "#workspace", config: { apiUrl, launcher: { mountMode: "docked", dock: { side: "right", width: "420px" } } } });از نظر بکاند کاملاً بیطرفه: هر بکاندی که SSE بلد باشه کار میکنه. مخزن پروژه آداپتورهای آماده برای Vercel AI SDK، OpenAI Agents SDK، LangGraph.js و Eve ورسل داره، و یه «ماتریس هاست» که همون ایجنت واحد رو روی Hono، Express، SvelteKit و HTML خام اجرا میکنه تا ببینی هر فریمورک دقیقاً چی ازت میخواد. اگه اصلاً نخوای بکاند بالا بیاری، میشه با یه clientToken امن به بکاند میزبانیشده وصل شد.
فهرست فیچرها بلنده: استریم SSE با پارسرهای قابلتعویض و انیمیشنهای نمایش متن، محتوای چندرسانهای (تصویر و PDF و DOCX و…)، ورودی و خروجی صوتی با تشخیص فعالیت صوتی و قطعکردن وسط حرف، حبابهای جمعشوندهی reasoning، و نمایش فراخوانی ابزارها همراه با دروازهی تأیید انسانی برای تأیید یا رد اقدام ایجنت.
بخش جالب دیگهش پنل آرتیفکته (نمایش مارکداون و کامپوننت تو یه پنل کناری یا کشوی موبایل) و پشتیبانی از WebMCP: با webmcp: { enabled: true } میتونی اکشنهای خود صفحه رو از طریق document.modelContext در اختیار مدل بذاری. یه بازرس رویدادها هم داره که استریم رویدادها رو با فیلتر و زمانبندی نشون میده.
قابلیت شخصیسازی هم نقطهی تمرکزشونه: ۱۴ هوک رندر برای لانچر، هدر، کامپوزر، پیامها، ابزارها و بقیهی اجزا، بهعلاوه سیستم کامل توکنهای طراحی با متغیرهای CSS و تم روشن و تیره. یعنی به گفتهی خودشون میتونی هر تکه از رابط کاربری رو بدون fork کردن پروژه عوض کنی. کل پروژه با مجوز MIT منتشر شده و به Node.js 20 به بالا نیاز داره.
نکات کلیدی:
- ویجت چت AI با TypeScript و رندر Vanilla JS؛ بدون وابستگی به فریمورک، کنار ریاکت و ویو هم کار میکنه
- سه چیدمان شناور، داکد و تمامصفحه که فقط با فیلد launcher عوض میشن
- بکاند-اگنوستیک: هر بکاند SSE، با آداپتورهای آماده برای AI SDK، OpenAI Agents و LangGraph
- امکانات: استریم، صدا، آرتیفکت، نمایش فراخوانی ابزار و دروازهی تأیید انسانی، WebMCP
- سیستم پلاگین با ۱۴ هوک رندر و توکنهای طراحی؛ مجوز MIT و نیازمند Node 20+
