plain-design 1.0.0-beta.157 → 1.0.0-beta.159

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "plain-design",
-  "version": "1.0.0-beta.157",
+  "version": "1.0.0-beta.159",
   "description": "",
   "main": "dist/plain-design.min.js",
   "module": "dist/plain-design.commonjs.min.js",

package/src/packages/components/$ai/index.tsx

@@ -70,7 +70,7 @@ export const $ai = (() => {
    * @date    2025/5/20 19:26
    */
   const chatSystem = async (userContent: string, systemContent?: string, _aiConfig?: iAiConfiguration) => {
-    const messages = [{ "role": "user", "content": userContent }];
+    const messages: iAiHistory[] = [{ "role": "user", "content": userContent }];
     if (!!systemContent) {
       messages.unshift({ "role": "system", "content": systemContent });
     }
@@ -100,15 +100,7 @@ export const $ai = (() => {
       onThinking,
       onThinkEnd,
       onThinkStart,
-    }: {
-      aiConfig?: iAiConfiguration,
-      messages: iAiHistory[],
-      onReceiving: (data: { fullText: string, chunkText: string }) => void,
-      onFinish?: (fullText: string) => void,
-      onThinking?: (thinkText: string) => void,
-      onThinkStart?: () => void,
-      onThinkEnd?: () => void,
-    }
+    }: iAiChatStreamParameter
   ) => {
     const aiConfig = _aiConfig ?? getConfig();
     // 发送请求
@@ -279,8 +271,8 @@ export interface iAiConfiguration {
 }
 
 export interface iAiHistory {
-  content: string,
-  role: string,
+  role: 'user' | 'assistant' | 'system';
+  content?: string;
 }
 
 export interface iAiChoice {
@@ -352,3 +344,13 @@ export interface iAiChatResponse {
     total_tokens: number,
   }
 }
+
+export interface iAiChatStreamParameter {
+  aiConfig?: iAiConfiguration,
+  messages: iAiHistory[],
+  onReceiving: (data: { fullText: string, chunkText: string }) => void,
+  onFinish?: (fullText: string) => void,
+  onThinking?: (thinkText: string) => void,
+  onThinkStart?: () => void,
+  onThinkEnd?: () => void,
+}

package/src/packages/components/AiChatBox/index.tsx

@@ -7,7 +7,7 @@ import Button from "../Button";
 import './ai-chat-box.scss';
 import $message from "../$message";
 import {uuid} from "@peryl/utils/uuid";
-import {$ai, iAiChatResponse, iAiConfiguration, iAiHistory} from "../$ai";
+import {$ai, iAiChatResponse, iAiChatStreamParameter, iAiConfiguration, iAiHistory} from "../$ai";
 import $configuration from "../$configuration";
 import Scroll from "../Scroll";
 import {delay} from "@peryl/utils/delay";
@@ -28,6 +28,9 @@ export const AiChatBox = designComponent({
     systemContent: { type: String },
     /*手动处理大模型返回的message*/
     handleMessage: { type: Function as PropType<(param: { message: string, userContent: string, chatData?: iAiChatResponse, addHistory: (history: iChatBoxHistory) => void }) => void | iChatBoxHistory | iChatBoxHistory[] | Promise<void | iChatBoxHistory | iChatBoxHistory[]>> },
+    handleReceive: { type: Function as PropType<(data: { fullText?: string, chunkText?: string }) => void> },
+    beforeSendUserContent: { type: Function as PropType<(data: { userContent: string, messages: iAiHistory[] }) => Promise<void>> },
+    handleChatStream: { type: Function as PropType<(parameter: iAiChatStreamParameter & { userContent: string }) => Promise<any>> },
     inputMinHeight: { type: String, default: '80px' },
     inputMaxHeight: { type: String, default: '225px' },
   },
@@ -62,27 +65,29 @@ export const AiChatBox = designComponent({
           refs.scroll.methods.scrollEnd();
         }
       },
-      addHistory: async (history: iChatBoxHistory) => {
-        state.histories.push(history);
+      addHistory: async (...history: iChatBoxHistory[]) => {
+        state.histories.push(...history);
         await methods.scrollEnd();
       },
       send: async (userContent: string) => {
         await delay(23);
         state.userContent = '';
-        state.histories.push({ role: 'user', content: userContent, id: uuid() });
-        await methods.scrollEnd();
+        await methods.addHistory({ role: 'user', content: userContent, id: uuid() });
 
         /*const { message, chatData } = await $ai.chatSystem(userContent, props.systemContent, aiConfig);*/
         const messages: iAiHistory[] = [{ role: 'user', content: userContent }];
+        await props.beforeSendUserContent?.({ userContent, messages });
         if (!!props.systemContent?.trim().length) {messages.unshift({ role: 'system', content: props.systemContent });}
         let chatBoxHistory: iChatBoxHistory | undefined = undefined;
         let message: string | undefined = undefined;
-        // console.log('start chat stream');
-        await $ai.chatStream({
+
+        const aiChatStreamParameter: iAiChatStreamParameter & { userContent: string } = {
           aiConfig,
           messages,
-          onReceiving: ({ fullText }) => {
+          userContent,
+          onReceiving: ({ fullText, chunkText }) => {
             // console.log('receiving', fullText);
+            props.handleReceive?.({ fullText, chunkText });
             if (!chatBoxHistory) {
               state.histories.push({ role: 'assistant', content: '', id: uuid() });
               chatBoxHistory = lastItem(state.histories);
@@ -94,7 +99,14 @@ export const AiChatBox = designComponent({
             chatBoxHistory!.content = fullText;
             message = fullText;
           },
-        });
+        };
+
+        if (!!props.handleChatStream) {
+          await props.handleChatStream(aiChatStreamParameter);
+        } else {
+          await $ai.chatStream(aiChatStreamParameter);
+        }
+
         if (!message) {
           throw new Error('message is empty!');
         }
@@ -108,9 +120,8 @@ export const AiChatBox = designComponent({
         });
 
         if (newHistory != null) {
-          state.histories.push(...toArray(newHistory));
+          await methods.addHistory(...toArray(newHistory));
         }
-        await methods.scrollEnd();
 
         return { message, /*chatData*/ };
       },
@@ -133,7 +144,12 @@ export const AiChatBox = designComponent({
     };
 
     return {
-      refer: {},
+      refer: {
+        refs,
+        aiConfig,
+        state,
+        methods,
+      },
       render: () => (
         <div className={classes.value}>
           {slots.prepend.isExist() && (
@@ -177,10 +193,8 @@ export const AiChatBox = designComponent({
   },
 });
 
-export interface iChatBoxHistory {
+export interface iChatBoxHistory extends iAiHistory {
   id: string,
-  role: 'user' | 'assistant';
-  content?: string,
   render?: () => any,
 }