@saber2pr/ai-assistant 0.0.4

package/lib/components/MyRuntimeProvider/myModelAdapterStream.js

@@ -0,0 +1,180 @@
+"use strict";
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+var __await = (this && this.__await) || function (v) { return this instanceof __await ? (this.v = v, this) : new __await(v); }
+var __asyncValues = (this && this.__asyncValues) || function (o) {
+    if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
+    var m = o[Symbol.asyncIterator], i;
+    return m ? m.call(o) : (o = typeof __values === "function" ? __values(o) : o[Symbol.iterator](), i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i);
+    function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }
+    function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }
+};
+var __asyncGenerator = (this && this.__asyncGenerator) || function (thisArg, _arguments, generator) {
+    if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
+    var g = generator.apply(thisArg, _arguments || []), i, q = [];
+    return i = Object.create((typeof AsyncIterator === "function" ? AsyncIterator : Object).prototype), verb("next"), verb("throw"), verb("return", awaitReturn), i[Symbol.asyncIterator] = function () { return this; }, i;
+    function awaitReturn(f) { return function (v) { return Promise.resolve(v).then(f, reject); }; }
+    function verb(n, f) { if (g[n]) { i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; if (f) i[n] = f(i[n]); } }
+    function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }
+    function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }
+    function fulfill(value) { resume("next", value); }
+    function reject(value) { resume("throw", value); }
+    function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MyModelAdapterStream = void 0;
+var event_1 = require("@/utils/event");
+var constants_1 = require("@/constants");
+var MyModelAdapterStream = function (llm, onBeforeChat) { return ({
+    run: function (_a) {
+        return __asyncGenerator(this, arguments, function run_1(_b) {
+            var chatMessages, chunks, reply, _c, chunks_1, chunks_1_1, chunk, e_1_1, summaryResponse, title, error_1;
+            var _d, e_1, _e, _f;
+            var _g, _h, _j;
+            var messages = _b.messages, abortSignal = _b.abortSignal;
+            return __generator(this, function (_k) {
+                switch (_k.label) {
+                    case 0:
+                        chatMessages = messages.map(function (item) { return ({
+                            role: item.role,
+                            content: item.content[0].text,
+                        }); });
+                        if (!onBeforeChat) return [3 /*break*/, 2];
+                        return [4 /*yield*/, __await(onBeforeChat(chatMessages, llm))];
+                    case 1:
+                        chatMessages = _k.sent();
+                        _k.label = 2;
+                    case 2:
+                        console.log('🚀 ~ myModelAdapterStream ~ chatMessages:', chatMessages);
+                        return [4 /*yield*/, __await(llm.chat.completions.create({
+                                messages: chatMessages,
+                                temperature: 1,
+                                stream: true,
+                            }))];
+                    case 3:
+                        chunks = _k.sent();
+                        reply = "";
+                        _k.label = 4;
+                    case 4:
+                        _k.trys.push([4, 11, 12, 17]);
+                        _c = true, chunks_1 = __asyncValues(chunks);
+                        _k.label = 5;
+                    case 5: return [4 /*yield*/, __await(chunks_1.next())];
+                    case 6:
+                        if (!(chunks_1_1 = _k.sent(), _d = chunks_1_1.done, !_d)) return [3 /*break*/, 10];
+                        _f = chunks_1_1.value;
+                        _c = false;
+                        chunk = _f;
+                        reply += ((_g = chunk.choices[0]) === null || _g === void 0 ? void 0 : _g.delta.content) || "";
+                        return [4 /*yield*/, __await({
+                                status: {
+                                    type: 'running',
+                                },
+                                content: [
+                                    {
+                                        text: reply,
+                                        type: 'text',
+                                    },
+                                ],
+                            })];
+                    case 7: return [4 /*yield*/, _k.sent()];
+                    case 8:
+                        _k.sent();
+                        _k.label = 9;
+                    case 9:
+                        _c = true;
+                        return [3 /*break*/, 5];
+                    case 10: return [3 /*break*/, 17];
+                    case 11:
+                        e_1_1 = _k.sent();
+                        e_1 = { error: e_1_1 };
+                        return [3 /*break*/, 17];
+                    case 12:
+                        _k.trys.push([12, , 15, 16]);
+                        if (!(!_c && !_d && (_e = chunks_1.return))) return [3 /*break*/, 14];
+                        return [4 /*yield*/, __await(_e.call(chunks_1))];
+                    case 13:
+                        _k.sent();
+                        _k.label = 14;
+                    case 14: return [3 /*break*/, 16];
+                    case 15:
+                        if (e_1) throw e_1.error;
+                        return [7 /*endfinally*/];
+                    case 16: return [7 /*endfinally*/];
+                    case 17: return [4 /*yield*/, __await({
+                            status: {
+                                type: 'complete',
+                                reason: 'stop',
+                            },
+                            content: [
+                                {
+                                    text: reply,
+                                    type: 'text',
+                                },
+                            ],
+                        }
+                        // 对话完成后，如果这是第一轮对话，生成标题
+                        )];
+                    case 18: return [4 /*yield*/, _k.sent()];
+                    case 19:
+                        _k.sent();
+                        if (!(messages.length === 1)) return [3 /*break*/, 23];
+                        _k.label = 20;
+                    case 20:
+                        _k.trys.push([20, 22, , 23]);
+                        return [4 /*yield*/, __await(llm.chat.completions.create({
+                                messages: [
+                                    {
+                                        role: 'system',
+                                        content: 'You are a title generation assistant. Please summarize a short title (no more than 10 words) based on the user\'s input, without punctuation.'
+                                    },
+                                    {
+                                        role: 'user',
+                                        content: messages[0].content[0].text
+                                    }
+                                ],
+                                temperature: 0.5,
+                            }))];
+                    case 21:
+                        summaryResponse = _k.sent();
+                        title = (_j = (_h = summaryResponse.choices[0]) === null || _h === void 0 ? void 0 : _h.message.content) === null || _j === void 0 ? void 0 : _j.trim();
+                        if (title) {
+                            event_1.Dispatcher.instance.dispatch(constants_1.EVENT_THREAD_SET_TITLE, { data: title });
+                        }
+                        return [3 /*break*/, 23];
+                    case 22:
+                        error_1 = _k.sent();
+                        console.error('Failed to generate summary title:', error_1);
+                        return [3 /*break*/, 23];
+                    case 23: return [2 /*return*/];
+                }
+            });
+        });
+    },
+}); };
+exports.MyModelAdapterStream = MyModelAdapterStream;

package/lib/components/Thread/index.d.ts

@@ -0,0 +1,2 @@
+import { FC } from 'react';
+export declare const Thread: FC;

package/lib/components/Thread/index.js

@@ -0,0 +1,286 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Thread = void 0;
+var antd_1 = require("antd");
+var react_1 = __importStar(require("react"));
+var react_hook_speech_to_text_1 = __importDefault(require("react-hook-speech-to-text"));
+var icons_1 = require("@ant-design/icons");
+var react_2 = require("@assistant-ui/react");
+var MarkdownText_1 = require("../MarkdownText");
+var index_style_1 = require("./index.style");
+var context_1 = require("../../context");
+var useI18n_1 = require("../../hooks/useI18n");
+// 当前聊天对话上下文
+var Thread = function () {
+    var config = (0, react_1.useContext)(context_1.AIConfigContext);
+    var t = (0, useI18n_1.useI18n)().t;
+    return (react_1.default.createElement(react_2.ThreadPrimitive.Root, { style: { height: '100%' } },
+        react_1.default.createElement(react_2.ThreadPrimitive.Viewport, { style: { height: '100%', overflowY: 'scroll' } },
+            react_1.default.createElement("div", { style: {
+                    display: 'flex',
+                    flexDirection: 'column',
+                    minHeight: '100%',
+                } },
+                react_1.default.createElement("div", { style: {
+                        flexGrow: 1,
+                        paddingBottom: 24,
+                    } },
+                    react_1.default.createElement("div", { style: { padding: '0px 24px' } },
+                        react_1.default.createElement(ThreadWelcome, null),
+                        react_1.default.createElement(react_2.ThreadPrimitive.Messages, { components: {
+                                UserMessage: UserMessage,
+                                EditComposer: EditComposer,
+                                AssistantMessage: AssistantMessage,
+                            } }),
+                        react_1.default.createElement(react_2.ThreadPrimitive.If, { empty: true },
+                            react_1.default.createElement(antd_1.Alert, { style: {
+                                    margin: '16px 0px',
+                                    maxWidth: '100%',
+                                }, type: "warning", message: config.emptyMessage || t('defaultEmpty') })))),
+                react_1.default.createElement(index_style_1.ButtomSpace, { style: { width: '100%', boxSizing: 'border-box', paddingBottom: 16 } },
+                    react_1.default.createElement(ThreadScrollToBottom, null),
+                    react_1.default.createElement(Composer, null))))));
+};
+exports.Thread = Thread;
+// 滚动到消息底部
+var ThreadScrollToBottom = function () {
+    return (react_1.default.createElement(react_2.ThreadPrimitive.ScrollToBottom, { asChild: true },
+        react_1.default.createElement(antd_1.Button, { style: {
+                width: '47px',
+                height: '47px',
+                borderRadius: 12,
+            }, type: "dashed", icon: react_1.default.createElement(icons_1.ArrowDownOutlined, null) })));
+};
+// 顶部的欢迎语
+var ThreadWelcome = function () {
+    var config = (0, react_1.useContext)(context_1.AIConfigContext);
+    var t = (0, useI18n_1.useI18n)().t;
+    return (react_1.default.createElement(react_2.ThreadPrimitive.Empty, null,
+        react_1.default.createElement(antd_1.Alert, { style: {
+                maxWidth: '100%',
+            }, message: config.welcomeMessage || t('defaultWelcome') }),
+        react_1.default.createElement(ThreadWelcomeSuggestions, null)));
+};
+// 推荐的预置几个问答
+var ThreadWelcomeSuggestions = function () {
+    var config = (0, react_1.useContext)(context_1.AIConfigContext);
+    var _a = (0, useI18n_1.useI18n)(), t = _a.t, locale = _a.locale;
+    var suggestions = config.suggestions || (locale === 'zh-CN'
+        ? ["如何用 Typescript 实现 Helloworld？", "物联网是什么？"]
+        : ["How to implement Helloworld in Typescript?", "What is IoT?"]);
+    return (react_1.default.createElement(antd_1.Space, { style: { marginTop: 24 } }, suggestions.map(function (suggestion, index) { return (react_1.default.createElement(react_2.ThreadPrimitive.Suggestion, { key: index, prompt: suggestion, method: "replace", style: { border: 'none', padding: 0 }, autoSend: true },
+        react_1.default.createElement(antd_1.Card, { hoverable: true }, suggestion))); })));
+};
+// 底部的输入框
+var Composer = function () {
+    var config = (0, react_1.useContext)(context_1.AIConfigContext);
+    var t = (0, useI18n_1.useI18n)().t;
+    return (react_1.default.createElement(react_2.ComposerPrimitive.Root, null,
+        react_1.default.createElement(index_style_1.InputSpace, null,
+            react_1.default.createElement(index_style_1.UserInput, { rows: 1, autoFocus: true, placeholder: config.placeholder || t('defaultPlaceholder') }),
+            react_1.default.createElement(ComposerAction, null))));
+};
+// 小鸟叽叽喳喳地唱着动听的歌，五颜六色的花朵随风舞动，像是在跟我打招呼，真是太美妙啦！
+var SpeechInputButton = function () {
+    var _a = (0, react_hook_speech_to_text_1.default)({
+        continuous: true,
+        useLegacyResults: false,
+    }), error = _a.error, interimResult = _a.interimResult, isRecording = _a.isRecording, results = _a.results, startSpeechToText = _a.startSpeechToText, stopSpeechToText = _a.stopSpeechToText;
+    var threadRuntime = (0, react_2.useThreadRuntime)();
+    (0, react_1.useEffect)(function () {
+        if (interimResult) {
+            threadRuntime.composer.setText(interimResult);
+        }
+    }, [interimResult]);
+    if (error) {
+        console.log("Web Speech API is not available in this browser.", error);
+        return react_1.default.createElement(react_1.default.Fragment, null);
+    }
+    return (react_1.default.createElement(antd_1.Button, { style: {
+            width: '47px',
+            height: '47px',
+            borderRadius: 12,
+        }, onClick: function () {
+            if (isRecording) {
+                stopSpeechToText();
+            }
+            else {
+                startSpeechToText();
+            }
+        }, icon: isRecording ? react_1.default.createElement(icons_1.LoadingOutlined, null) : react_1.default.createElement(icons_1.AudioOutlined, null) }));
+};
+// 底部的发送/停止对话消息按钮
+var ComposerAction = function () {
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(react_2.ThreadPrimitive.If, { running: false },
+            react_1.default.createElement(antd_1.Space, null,
+                react_1.default.createElement(react_2.ComposerPrimitive.Send, { asChild: true },
+                    react_1.default.createElement(antd_1.Button, { style: {
+                            width: '47px',
+                            height: '47px',
+                            borderRadius: 12,
+                        }, icon: react_1.default.createElement(icons_1.SendOutlined, null) })),
+                react_1.default.createElement(SpeechInputButton, null))),
+        react_1.default.createElement(react_2.ThreadPrimitive.If, { running: true },
+            react_1.default.createElement(react_2.ComposerPrimitive.Cancel, { asChild: true },
+                react_1.default.createElement(antd_1.Button, { style: {
+                        width: '47px',
+                        height: '47px',
+                        borderRadius: 12,
+                    }, icon: react_1.default.createElement(icons_1.StopOutlined, null) })))));
+};
+// 用户询问的消息框
+var UserMessage = function () {
+    return (react_1.default.createElement(react_2.MessagePrimitive.Root, { style: {
+            display: 'flex',
+            justifyContent: 'flex-end',
+            marginTop: 16,
+        } },
+        react_1.default.createElement(antd_1.Space, { align: "start" },
+            react_1.default.createElement("div", null,
+                react_1.default.createElement(antd_1.Space, null,
+                    react_1.default.createElement(UserActionBar, null),
+                    react_1.default.createElement(index_style_1.MessageContainer, null,
+                        react_1.default.createElement(react_2.MessagePrimitive.Content, null))),
+                react_1.default.createElement(BranchPicker, { style: { marginTop: 8 } })),
+            react_1.default.createElement(antd_1.Avatar, null, "Y"))));
+};
+// 上下文用户消息框的工具栏
+var UserActionBar = function () {
+    return (react_1.default.createElement(react_2.ActionBarPrimitive.Root, { hideWhenRunning: true, autohide: "not-last" },
+        react_1.default.createElement(react_2.ActionBarPrimitive.Edit, { asChild: true },
+            react_1.default.createElement(icons_1.EditOutlined, null))));
+};
+// 编辑上下文询问的输入框
+var EditComposer = function () {
+    var t = (0, useI18n_1.useI18n)().t;
+    return (react_1.default.createElement(react_2.ComposerPrimitive.Root, { style: {
+            padding: '16px 8px',
+        } },
+        react_1.default.createElement(react_2.ComposerPrimitive.Input, { style: {
+                width: '100%',
+                height: 300,
+                boxSizing: 'border-box',
+                whiteSpace: 'pre-wrap',
+                wordBreak: 'break-word',
+                backgroundColor: '#eff6ff',
+                borderRadius: '14px',
+                border: 'none',
+                padding: '8px 20px',
+                // @ts-ignore
+                borderRadius: '14px',
+            } }),
+        react_1.default.createElement("div", { style: {
+                display: 'flex',
+                justifyContent: 'flex-end',
+            } },
+            react_1.default.createElement(antd_1.Space, null,
+                react_1.default.createElement(react_2.ComposerPrimitive.Cancel, { asChild: true },
+                    react_1.default.createElement(antd_1.Button, { type: "default", size: "small" }, t('cancel'))),
+                react_1.default.createElement(react_2.ComposerPrimitive.Send, { asChild: true },
+                    react_1.default.createElement(antd_1.Button, { type: "primary", size: "small" }, t('send')))))));
+};
+// AI 回答结果的消息框
+var AssistantMessage = function () {
+    return (react_1.default.createElement(react_2.MessagePrimitive.Root, { style: {
+            marginTop: 16,
+        } },
+        react_1.default.createElement(antd_1.Space, { align: "start" },
+            react_1.default.createElement(antd_1.Avatar, null, "AI"),
+            react_1.default.createElement("div", { style: {
+                    display: 'inline-block',
+                } },
+                react_1.default.createElement(react_2.MessagePrimitive.Content, { components: { Text: MarkdownText_1.MarkdownText } }),
+                react_1.default.createElement(AssistantActionBar, null),
+                react_1.default.createElement(BranchPicker, null)))));
+};
+var AssistantActionBar = function () {
+    return (react_1.default.createElement(react_2.ActionBarPrimitive.Root, { hideWhenRunning: true, autohide: "not-last", autohideFloat: "single-branch", style: {
+            marginTop: 8,
+        } },
+        react_1.default.createElement(antd_1.Space, null,
+            react_1.default.createElement(react_2.ActionBarPrimitive.Copy, { asChild: true },
+                react_1.default.createElement("div", { style: { cursor: 'pointer' } },
+                    react_1.default.createElement(react_2.MessagePrimitive.If, { copied: true },
+                        react_1.default.createElement(icons_1.CheckCircleOutlined, null)),
+                    react_1.default.createElement(react_2.MessagePrimitive.If, { copied: false },
+                        react_1.default.createElement(icons_1.CopyOutlined, null)))),
+            react_1.default.createElement(react_2.ActionBarPrimitive.Reload, { asChild: true },
+                react_1.default.createElement(icons_1.RedoOutlined, null)),
+            react_1.default.createElement(react_2.MessagePrimitive.If, { speaking: true },
+                react_1.default.createElement(react_2.ActionBarPrimitive.StopSpeaking, { asChild: true },
+                    react_1.default.createElement(icons_1.PauseCircleOutlined, null))),
+            react_1.default.createElement(react_2.MessagePrimitive.If, { speaking: false },
+                react_1.default.createElement(react_2.ActionBarPrimitive.Speak, { asChild: true },
+                    react_1.default.createElement(icons_1.PlayCircleOutlined, null))))));
+};
+var BranchPicker = function (_a) {
+    var className = _a.className, rest = __rest(_a, ["className"]);
+    return (react_1.default.createElement(react_2.BranchPickerPrimitive.Root, __assign({ hideWhenSingleBranch: true, style: __assign({ marginTop: 8 }, (rest.style || {})) }, rest),
+        react_1.default.createElement(react_2.BranchPickerPrimitive.Previous, { asChild: true },
+            react_1.default.createElement(icons_1.LeftOutlined, null)),
+        react_1.default.createElement("span", null,
+            react_1.default.createElement(react_2.BranchPickerPrimitive.Number, null),
+            " / ",
+            react_1.default.createElement(react_2.BranchPickerPrimitive.Count, null)),
+        react_1.default.createElement(react_2.BranchPickerPrimitive.Next, { asChild: true },
+            react_1.default.createElement(icons_1.RightOutlined, null))));
+};

package/lib/components/Thread/index.style.d.ts

@@ -0,0 +1,15 @@
+export declare const MessageContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const ButtomSpace: import("styled-components").StyledComponent<import("react").FC<import("antd").SpaceProps> & {
+    Compact: import("react").FC<import("antd/lib/space/Compact").SpaceCompactProps>;
+}, any, {}, never>;
+export declare const InputSpace: import("styled-components").StyledComponent<import("react").FC<import("antd").SpaceProps> & {
+    Compact: import("react").FC<import("antd/lib/space/Compact").SpaceCompactProps>;
+}, any, {}, never>;
+export declare const UserInput: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react-textarea-autosize").TextareaAutosizeProps & {
+    asChild?: boolean | undefined;
+    submitOnEnter?: boolean | undefined;
+    cancelOnEscape?: boolean | undefined;
+    unstable_focusOnRunStart?: boolean | undefined;
+    unstable_focusOnScrollToBottom?: boolean | undefined;
+    unstable_focusOnThreadSwitched?: boolean | undefined;
+} & import("react").RefAttributes<HTMLTextAreaElement>>, any, {}, never>;

package/lib/components/Thread/index.style.js

@@ -0,0 +1,18 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.UserInput = exports.InputSpace = exports.ButtomSpace = exports.MessageContainer = void 0;
+var react_1 = require("@assistant-ui/react");
+var antd_1 = require("antd");
+var styled_components_1 = __importDefault(require("styled-components"));
+exports.MessageContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  box-sizing: border-box;\n  white-space: pre-wrap;\n  word-break: break-word;\n  background-color: #eff6ff;\n  border-radius: 14px;\n  padding: 8px 20px;\n\n  & > p {\n    margin-bottom: 0;\n  }\n"], ["\n  box-sizing: border-box;\n  white-space: pre-wrap;\n  word-break: break-word;\n  background-color: #eff6ff;\n  border-radius: 14px;\n  padding: 8px 20px;\n\n  & > p {\n    margin-bottom: 0;\n  }\n"])));
+exports.ButtomSpace = (0, styled_components_1.default)(antd_1.Space)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: sticky;\n  bottom: 0;\n  padding-top: 16px;\n  background-color: #fff;\n  padding: 0 24px;\n  & > div:nth-child(2) {\n    flex-grow: 1;\n  }\n"], ["\n  position: sticky;\n  bottom: 0;\n  padding-top: 16px;\n  background-color: #fff;\n  padding: 0 24px;\n  & > div:nth-child(2) {\n    flex-grow: 1;\n  }\n"])));
+exports.InputSpace = (0, styled_components_1.default)(antd_1.Space)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  width: 100%;\n  & > div:nth-child(1) {\n    flex-grow: 1;\n  }\n"], ["\n  width: 100%;\n  & > div:nth-child(1) {\n    flex-grow: 1;\n  }\n"])));
+exports.UserInput = (0, styled_components_1.default)(react_1.ComposerPrimitive.Input)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  flex-grow: 1;\n  padding: 10px;\n  background-color: #f7f7f8; /* \u7C7B\u4F3C ChatGPT \u7684\u6D45\u80CC\u666F */\n  border-radius: 12px;\n  border: 1px solid #d1d5db; /* \u8FB9\u6846\u989C\u8272 */\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); /* \u5FAE\u5999\u7684\u9634\u5F71\u6548\u679C */\n  transition: border-color 0.3s ease; /* \u52A8\u753B\u6548\u679C */\n  outline: none;\n  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n  font-size: 16px;\n  color: #333;\n  min-height: 40px;\n  max-height: 200px;\n  resize: none;\n  transition: background-color 0.5s ease;\n  overflow-y: auto;\n\n  &:focus {\n    background-color: #fff;\n    border-color: #40a9ff;\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  flex-grow: 1;\n  padding: 10px;\n  background-color: #f7f7f8; /* \u7C7B\u4F3C ChatGPT \u7684\u6D45\u80CC\u666F */\n  border-radius: 12px;\n  border: 1px solid #d1d5db; /* \u8FB9\u6846\u989C\u8272 */\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); /* \u5FAE\u5999\u7684\u9634\u5F71\u6548\u679C */\n  transition: border-color 0.3s ease; /* \u52A8\u753B\u6548\u679C */\n  outline: none;\n  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n  font-size: 16px;\n  color: #333;\n  min-height: 40px;\n  max-height: 200px;\n  resize: none;\n  transition: background-color 0.5s ease;\n  overflow-y: auto;\n\n  &:focus {\n    background-color: #fff;\n    border-color: #40a9ff;\n  }\n"])));
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

package/lib/components/ThreadList/index.d.ts

@@ -0,0 +1,4 @@
+import type { FC } from 'react';
+export declare const ThreadList: FC<{
+    onItemClick?: () => void;
+}>;

package/lib/components/ThreadList/index.js

@@ -0,0 +1,131 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ThreadList = void 0;
+var antd_1 = require("antd");
+var react_1 = __importStar(require("react"));
+var icons_1 = require("@ant-design/icons");
+var react_2 = require("@assistant-ui/react");
+var event_1 = require("@/utils/event");
+var constants_1 = require("@/constants");
+var antd_2 = require("antd");
+var useI18n_1 = require("../../hooks/useI18n");
+// 聊天列表
+var ThreadList = function (_a) {
+    var onItemClick = _a.onItemClick;
+    return (react_1.default.createElement(react_2.ThreadListPrimitive.Root, { style: {
+            display: 'flex',
+            flexDirection: 'column',
+        } },
+        react_1.default.createElement(ThreadListItems, { onItemClick: onItemClick })));
+};
+exports.ThreadList = ThreadList;
+// 点击创建新聊天
+var ThreadListNew = function () {
+    var t = (0, useI18n_1.useI18n)().t;
+    return (react_1.default.createElement(react_2.ThreadListPrimitive.New, { asChild: true },
+        react_1.default.createElement(antd_1.Button, { type: "primary", icon: react_1.default.createElement(icons_1.PlusOutlined, null), style: { width: '100%', marginBottom: 16 } }, t('newChat'))));
+};
+// 聊天列表
+var ThreadListItems = function (_a) {
+    var onItemClick = _a.onItemClick;
+    var runtime = (0, react_2.useAssistantRuntime)();
+    var threads = runtime.threads.getState().threads;
+    var t = (0, useI18n_1.useI18n)().t;
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(react_2.ThreadListPrimitive.Items, { components: {
+                ThreadListItem: function (props) { return (react_1.default.createElement(ThreadListItem, __assign({}, props, { onClick: onItemClick }))); },
+            } }),
+        threads.length === 0 && (react_1.default.createElement(antd_2.Empty, { description: t('noHistory'), style: { marginTop: 48 } }))));
+};
+var ThreadListItem = function (_a) {
+    var onClick = _a.onClick;
+    return (react_1.default.createElement(react_2.ThreadListItemPrimitive.Root, { className: "ant-btn", style: {
+            marginTop: '8px',
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'space-between',
+            width: '100%',
+            padding: '8px 12px',
+            height: 'auto'
+        } },
+        react_1.default.createElement(react_2.ThreadListItemPrimitive.Trigger, { onClick: onClick, style: {
+                border: 'none',
+                padding: 0,
+                background: 'transparent',
+                flex: 1,
+                overflow: 'hidden',
+                textOverflow: 'ellipsis',
+                display: 'block',
+                textAlign: 'left',
+                cursor: 'pointer'
+            } },
+            react_1.default.createElement(ThreadListItemTitle, null)),
+        react_1.default.createElement(ThreadListItemDelete, null)));
+};
+// 点击切换聊天
+var ThreadListItemTitle = function () {
+    var runtime = (0, react_2.useThreadListItemRuntime)();
+    var t = (0, useI18n_1.useI18n)().t;
+    (0, react_1.useEffect)(function () {
+        var handle = function (event) {
+            var state = runtime.getState();
+            if (state.isMain) {
+                runtime.rename(event.data);
+            }
+        };
+        event_1.Dispatcher.instance.addEventListener(constants_1.EVENT_THREAD_SET_TITLE, handle);
+        return function () {
+            event_1.Dispatcher.instance.removeEventListener(constants_1.EVENT_THREAD_SET_TITLE, handle);
+        };
+    }, [runtime]);
+    return react_1.default.createElement(react_2.ThreadListItemPrimitive.Title, { fallback: react_1.default.createElement("div", null, t('newChatFallback')) });
+};
+// 归档按钮
+var ThreadListItemDelete = function () {
+    return (react_1.default.createElement(react_2.ThreadListItemPrimitive.Delete, { asChild: true },
+        react_1.default.createElement(icons_1.DeleteOutlined, null)));
+};

package/lib/constants/index.d.ts

@@ -0,0 +1 @@
+export declare const EVENT_THREAD_SET_TITLE = "thread-set-title";

package/lib/constants/index.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EVENT_THREAD_SET_TITLE = void 0;
+exports.EVENT_THREAD_SET_TITLE = 'thread-set-title';