@blueking/ai-ui-sdk 0.0.14 → 0.0.15-beta.2

package/dist/hooks/use-reference-doc.d.ts

@@ -1,4 +1,4 @@
-import type { Document } from '../types/type';
+import type { Document } from '../types/session';
 /**
  * 获取引用资料的 HTML 内容
  * @param documents

package/dist/hooks/use-reference-doc.js

@@ -0,0 +1,185 @@
+import { onBeforeMount, onBeforeUnmount } from 'vue';
+/**
+ * 获取引用资料的 HTML 内容
+ * @param documents
+ * @returns
+ */ export const getHtmlContentFromDocuments = (documents)=>{
+    let htmlContent = `<section class="knowledge-head click-close"><svg class="ai-ui-sdk-wenzhang"><use href="#ai-ui-sdk-wenzhang"></use></svg>找到 ${documents.length} 篇资料参考<i class="ai-ui-sdk-icon ai-ui-sdk-angle-up"></i></section><ul class="knowledge-body">`;
+    documents.forEach((document1)=>{
+        const { path, file_path: filePath, display_name: displayName, preview_path: previewPath } = document1.metadata;
+        const title = displayName || filePath.split('/').pop();
+        htmlContent += `<li
+      class="knowledge-item"
+    >
+      <i class="ai-ui-sdk-icon ai-ui-sdk-zhishiku"></i>
+      <a href="${previewPath}" title="${title} (${previewPath})" target="_blank" class="knowledge-link g-flex-truncate">
+        ${title}
+      </a>
+      <a href="${path}" title="预览原文" target="_blank" class="knowledge-link hover-show">
+        <i class="ai-ui-sdk-icon ai-ui-sdk-yanjing-kejian"></i>
+      </a>
+    </li>`;
+    });
+    htmlContent += '</ul>';
+    return htmlContent;
+};
+/**
+ * 移除引用资料的 HTML 内容
+ * @param content
+ * @returns
+ */ export const removeReferenceDoc = (content)=>{
+    return content.replace(/<section class="knowledge-head click-close">[\s\S]*?<\/section>/, '').replace(/<ul class="knowledge-body">[\s\S]*?<\/ul>/, '').replace(/<section class="knowledge-tips">[\s\S]*?<\/section>/, '');
+};
+export const useReferenceDoc = ()=>{
+    let styleEle = null;
+    const addReferenceDocStyle = ()=>{
+        // 旧版知识样式
+        const oldStyle = `.knowledge-tips {
+      position: relative;
+      padding: 6px 8px;
+      margin-bottom: 14px;
+      line-height: 22px;
+      background: #f5f7fa;
+      border-radius: 4px;
+
+      &.closed {
+        .bkaidev-angle-up {
+          transform: rotate(180deg);
+        }
+
+        .knowledge-summary {
+          margin-bottom: 0;
+        }
+
+        .knowledge-link {
+          display: none;
+        }
+      }
+
+      .bkaidev-angle-up {
+        position: absolute;
+        top: 4px;
+        right: 0px;
+        font-size: 22px;
+        color: #979ba5;
+        cursor: pointer;
+      }
+
+      .bkaidev-help-document {
+        margin-right: 4px;
+        font-size: 19px;
+        color: #3a84ff;
+      }
+
+      .knowledge-summary {
+        display: block;
+        margin-bottom: 4px;
+        color: #313238;
+      }
+
+      .knowledge-link {
+        display: block;
+        color: #3a84ff;
+        text-decoration: none;
+        cursor: pointer;
+
+        .bkaidev-cc-jump-link {
+          font-size: 14px;
+        }
+
+        &:last-child {
+          margin-bottom: 2px;
+        }
+      }
+    }`;
+        // 新版知识样式
+        const newStyle = `.knowledge-head {
+      display: flex;
+      align-items: center;
+      padding: 0 8px 0 6px;
+      margin-bottom: 8px;
+      line-height: 28px;
+      background: #F0F1F5;
+      border-radius: 4px;
+      font-size: 12px;
+      color: #313238;
+      cursor: pointer;
+      width: fit-content;
+
+      .ai-ui-sdk-wenzhang {
+        width: 14px;
+        height: 14px;
+        margin-right: 6px;
+      }
+
+      .ai-ui-sdk-angle-up {
+        font-size: 22px;
+        color: #4D4F56;
+        margin-left: 4px;
+      }
+
+      &.closed {
+        margin-bottom: 16px;
+
+        .ai-ui-sdk-angle-up {
+          transform: rotate(180deg);
+        }
+
+        &~ .knowledge-body {
+          display: none;
+        }
+      }
+
+      &:hover {
+        background: #EAEBF0;
+      }
+    }
+    .knowledge-body {
+      background: #F5F7FA;
+      padding: 16px 0 !important;
+      .knowledge-item {
+        padding-left: 10px;
+        display: flex;
+        align-items: center;
+        line-height: 28px;
+        .hover-show {
+          display: none;
+        }
+        a {
+          margin-right: 10px;
+          &:has(i) {
+            padding: 0 10px;
+            margin-right: 0;
+            text-decoration: none !important;
+          }
+        }
+        .ai-ui-sdk-zhishiku {
+          color: #D66F6B;
+          font-size: 14px;
+          margin-right: 6px;
+        }
+        &:hover {
+          background: #EAEBF0;
+          .hover-show {
+            display: inline;
+          }
+        }
+      }
+    }`;
+        styleEle = document.createElement('style');
+        styleEle.textContent = oldStyle + newStyle;
+        document.head.appendChild(styleEle);
+    };
+    const removeReferenceDocStyle = ()=>{
+        if (styleEle) {
+            styleEle.remove();
+            styleEle = null;
+        }
+    };
+    onBeforeMount(()=>{
+        addReferenceDocStyle();
+    });
+    onBeforeUnmount(()=>{
+        removeReferenceDocStyle();
+    });
+};

package/dist/hooks/use-style.js

@@ -0,0 +1,11 @@
+import { useReferenceDoc } from './use-reference-doc.js';
+import { useThink } from './use-think.js';
+import '../css/style.css';
+import '../css/iconcool.js';
+// ai 样式。注意：全局引入一次即可
+export const useStyle = ()=>{
+    // 引用资料
+    useReferenceDoc();
+    // 思考
+    useThink();
+};

package/dist/hooks/use-summary.d.ts

@@ -1,4 +1,4 @@
-import type { SummaryCallbacks } from '../types/type.ts';
+import type { SummaryCallbacks } from '../types/session';
 export declare const useSummary: ({ handleStart, handleEnd, handleError, }?: SummaryCallbacks) => {
     summary: ({ content, url, headers, model, }: {
         content: string;

package/dist/hooks/use-summary.js

@@ -0,0 +1,55 @@
+import { SessionPromptRole } from '../types/enum.js';
+import { removeReferenceDoc } from './use-reference-doc.js';
+import { removeThink } from './use-think.js';
+import { ChatHelper } from '../common/chart-helper.js';
+// ai 总结
+export const useSummary = ({ handleStart, handleEnd, handleError } = {})=>{
+    let summaryText = '';
+    const handleStartChat = ()=>{
+        summaryText = '';
+        return handleStart === null || handleStart === void 0 ? void 0 : handleStart();
+    };
+    const handleTextChat = (sessionCode, message, cover)=>{
+        if (cover || summaryText === '正在思考...') {
+            summaryText = message;
+        } else {
+            summaryText += message;
+        }
+    };
+    const handleEndChat = ()=>{
+        if (summaryText === '无话可说') {
+            summaryText = '';
+        }
+        return handleEnd === null || handleEnd === void 0 ? void 0 : handleEnd(summaryText);
+    };
+    const handleErrorChat = (sessionCode, message, code)=>{
+        return handleError === null || handleError === void 0 ? void 0 : handleError(message, code);
+    };
+    const chatHelper = new ChatHelper({
+        handleStart: handleStartChat,
+        handleText: handleTextChat,
+        handleEnd: handleEndChat,
+        handleError: handleErrorChat
+    });
+    const summary = ({ content, url, headers, model })=>{
+        const filterContent = removeThink(removeReferenceDoc(content));
+        const prompts = [
+            {
+                role: SessionPromptRole.User,
+                content: `你是一个总结大师，请帮助我对下面这段话进行总结。要求总结精炼，不超过 15 个字！且末尾没有标点符号！请注意：如果你无法总结，请回复“无话可说”！\n文字如下：\n${filterContent}`
+            }
+        ];
+        chatHelper.stream({
+            sessionCode: 'summary',
+            url,
+            data: {
+                prompts,
+                model
+            },
+            headers
+        });
+    };
+    return {
+        summary
+    };
+};

package/dist/hooks/use-think.js

@@ -0,0 +1,135 @@
+import { onBeforeMount, onBeforeUnmount } from 'vue';
+import { durationFormatter } from '../common/util.js';
+/**
+ * 获取思考的 HTML 内容
+ * @param chatContent 聊天内容
+ * @param content 思考内容
+ * @param elapsedTime 思考时间
+ * @returns 完整的 chatContent
+ */ export const getHtmlContentFromThink = (chatContent, content, cover, elapsedTime)=>{
+    let htmlContent = chatContent === '内容正在生成中...' || cover ? '' : chatContent;
+    // 思考开始
+    if (!htmlContent.includes('<section class="think-head click-close">')) {
+        htmlContent += `<section class="think-head click-close">
+      <i class="ai-ui-sdk-icon ai-ui-sdk-sikao"></i>思考中...<i class="ai-ui-sdk-icon ai-ui-sdk-angle-up"></i>
+    </section>
+    <section class="think-body">
+      ${content}
+</section>`;
+    } else {
+        // 补充思考内容
+        const thinkBodyMatch = htmlContent.match(/<section class="think-body">([\s\S]*?)<\/section>/);
+        if (thinkBodyMatch) {
+            // 原有思考内容
+            const thinkContent = thinkBodyMatch[1];
+            // 在最后的换行符前面添加新的思考内容
+            const newThinkContent = thinkContent.replace(/\n$/g, `${content}\n`);
+            htmlContent = htmlContent.replace(thinkContent, newThinkContent);
+        }
+    }
+    // 思考结束
+    if (elapsedTime) {
+        htmlContent = htmlContent.replace('思考中...', `已完成思考 (耗时：${durationFormatter(elapsedTime)})`);
+    }
+    return htmlContent;
+};
+/**
+ * 移除思考的 HTML 内容
+ * @param content
+ * @returns
+ */ export const removeThink = (content)=>{
+    // 移除思考头部
+    const afterRemoveThinkHead = content.replace(/<section class="think-head click-close">[\s\S]*<\/section>/, '');
+    // 移除思考内容
+    let afterRemoveThinkBody = afterRemoveThinkHead.replace(/<section class="think-body">[\s\S]*<\/section>/, '');
+    // 如果内容只有思考，那就给ai传递思考内容
+    if (afterRemoveThinkBody.trim() === '') {
+        const thinkBodyMatch = content.match(/<section class="think-body">([\s\S]*?)<\/section>/);
+        if (thinkBodyMatch) {
+            [, afterRemoveThinkBody] = thinkBodyMatch;
+        }
+    }
+    return afterRemoveThinkBody;
+};
+/**
+ * 判断是否是思考中
+ * @param content
+ * @returns
+ */ export const isThinking = (content)=>{
+    // 是否开始思考
+    const isStartThinking = content === '正在思考...';
+    // 判断是否空思考
+    const thinkBodyMatch = content.match(/<section class="think-body">([\s\S]*?)<\/section>$/);
+    const isEmptyThinking = thinkBodyMatch && thinkBodyMatch[1].trim() === '';
+    return isStartThinking || isEmptyThinking;
+};
+// 思考
+export const useThink = ()=>{
+    let styleEle = null;
+    const addThinkStyle = ()=>{
+        const style = `.think-head {
+      display: flex;
+      align-items: center;
+      padding: 0 8px 0 6px;
+      margin-bottom: 8px;
+      line-height: 28px;
+      background: #F0F1F5;
+      border-radius: 4px;
+      font-size: 12px;
+      color: #313238;
+      cursor: pointer;
+      width: fit-content;
+      .ai-ui-sdk-sikao {
+        font-size: 14px;
+        color: #979ba5;
+        margin-right: 4px;
+      }
+
+      .ai-ui-sdk-angle-up {
+        font-size: 22px;
+        color: #4D4F56;
+        margin-left: 4px;
+      }
+
+      &.closed {
+        margin-bottom: 16px;
+
+        .ai-ui-sdk-angle-up {
+          transform: rotate(180deg);
+        }
+
+        &~ .think-body {
+          display: none;
+        }
+      }
+
+      &:hover {
+        background: #EAEBF0;
+      }
+    }
+    .think-body {
+      background: #F5F7FA;
+      color: #979BA5;
+      padding: 16px;
+      margin-bottom: 16px;
+      &~ .knowledge-head {
+        margin-bottom: 8px;
+      }
+    }`;
+        styleEle = document.createElement('style');
+        styleEle.textContent = style;
+        document.head.appendChild(styleEle);
+    };
+    const removeThinkStyle = ()=>{
+        if (styleEle) {
+            styleEle.remove();
+            styleEle = null;
+        }
+    };
+    onBeforeMount(()=>{
+        addThinkStyle();
+    });
+    onBeforeUnmount(()=>{
+        removeThinkStyle();
+    });
+};

package/dist/http/fetch/error-interceptor.d.ts

@@ -0,0 +1,3 @@
+import type { IFetchConfig } from './index';
+declare const _default: (error: any, config: IFetchConfig) => Promise<never>;
+export default _default;

package/dist/http/fetch/error-interceptor.js

@@ -0,0 +1,7 @@
+import { emitEvent } from '../../event/index.js';
+import { EventType } from '../../types/enum.js';
+// 请求执行失败拦截器
+export default ((error, config)=>{
+    emitEvent(EventType.Error, error, config);
+    return Promise.reject(error);
+});

package/dist/http/fetch/index.d.ts

@@ -0,0 +1,25 @@
+export interface IFetchConfig extends RequestInit {
+    requestType?: 'json' | 'formData';
+    responseType?: 'json' | 'text' | 'formData' | 'file' | 'blob';
+    globalError?: Boolean;
+    signal?: AbortSignal;
+    withoutSpace?: boolean;
+    noCheckPermission?: boolean;
+}
+type HttpMethod = <T>(url: string, payload?: any, config?: IFetchConfig) => Promise<T>;
+interface IHttp {
+    get: HttpMethod;
+    post: HttpMethod;
+    put: HttpMethod;
+    delete: HttpMethod;
+    head: HttpMethod;
+    options: HttpMethod;
+    patch: HttpMethod;
+}
+declare const http: IHttp;
+declare const withAbort: <R, T extends any[]>(fn: (signal: AbortSignal, ...args: T) => Promise<R>) => {
+    (...args: T): Promise<R>;
+    abort(): void | undefined;
+};
+export default http;
+export { withAbort };

package/dist/http/fetch/index.js

@@ -0,0 +1,182 @@
+/* eslint-disable no-param-reassign */ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
+    try {
+        var info = gen[key](arg);
+        var value = info.value;
+    } catch (error) {
+        reject(error);
+        return;
+    }
+    if (info.done) {
+        resolve(value);
+    } else {
+        Promise.resolve(value).then(_next, _throw);
+    }
+}
+function _async_to_generator(fn) {
+    return function() {
+        var self = this, args = arguments;
+        return new Promise(function(resolve, reject) {
+            var gen = fn.apply(self, args);
+            function _next(value) {
+                asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
+            }
+            function _throw(err) {
+                asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
+            }
+            _next(undefined);
+        });
+    };
+}
+import errorInterceptor from './error-interceptor.js';
+import RequestError from './request-error.js';
+import successInterceptor from './success-interceptor.js';
+import { deepMerge } from '../../common/util.js';
+// Content-Type
+const contentTypeMap = {
+    json: 'application/json',
+    text: 'text/plain',
+    formData: 'multipart/form-data'
+};
+const methodsWithoutData = [
+    'delete',
+    'get',
+    'head',
+    'options'
+];
+const methodsWithData = [
+    'post',
+    'put',
+    'patch'
+];
+const allMethods = [
+    ...methodsWithoutData,
+    ...methodsWithData
+];
+// 拼装发送请求配置
+const getFetchConfig = (method, payload, config)=>{
+    const headers = {
+        'X-Requested-With': 'fetch'
+    };
+    if (config.requestType !== 'formData') {
+        headers['Content-Type'] = contentTypeMap[config.requestType] || 'application/json';
+    }
+    if (!config.withoutSpace) {
+        headers['X-SPACE-ID'] = localStorage.getItem('spaceId') || '';
+    }
+    // 合并配置
+    let fetchConfig = deepMerge({
+        method: method.toLocaleUpperCase(),
+        mode: 'cors',
+        cache: 'default',
+        credentials: 'include',
+        headers,
+        redirect: 'follow',
+        referrerPolicy: 'no-referrer-when-downgrade',
+        responseType: 'json',
+        globalError: true
+    }, config);
+    // merge payload
+    if (methodsWithData.includes(method)) {
+        fetchConfig = deepMerge(fetchConfig, {
+            body: config.requestType === 'formData' ? payload : JSON.stringify(payload)
+        });
+    } else {
+        fetchConfig = deepMerge(fetchConfig, payload);
+    }
+    return fetchConfig;
+};
+// 拼装发送请求 url
+const getFetchUrl = (url, method, payload = {})=>{
+    try {
+        // 基础 url
+        const baseUrl = location.origin;
+        // 构造 url 对象
+        const urlObject = new URL(url, baseUrl);
+        // add path
+        const configPath = window.SITE_URL;
+        const subPath = configPath.endsWith('/') ? configPath.slice(0, -1) : configPath;
+        urlObject.pathname = subPath + urlObject.pathname;
+        // get 请求需要将参数拼接到url上
+        // if (methodsWithoutData.includes(method)) {
+        //   urlObject.search = qs.stringify(payload);
+        // }
+        // if (methodsWithoutData.includes(method)) {
+        //   Object.keys(payload).forEach((key) => {
+        //     const value = payload[key];
+        //     if (!['', undefined, null].includes(value)) {
+        //       urlObject.searchParams.append(key, value);
+        //     }
+        //   });
+        // }
+        if (methodsWithoutData.includes(method)) {
+            const appendSearchParams = (key, value)=>{
+                if (![
+                    '',
+                    undefined,
+                    null
+                ].includes(value)) {
+                    urlObject.searchParams.append(key, value);
+                }
+            };
+            // /api/cr/bkaidev/intelligence/code_review/mine_list/ 接口 status 参数需要 status=xx&&status=yy 此种方式接收
+            // 这里单独对此做处理，需要在参数中加上 noEncodeURI 标识，这种处理的缺陷是如果参数本身就有 noEncodeURI 就会出现问题，待处理
+            const isNoEncodURI = !!payload.noEncodeURI;
+            delete payload.noEncodeURI;
+            Object.keys(payload).forEach((key)=>{
+                const value = payload[key];
+                if (isNoEncodURI) {
+                    if (Object.prototype.toString.call(value) === '[object Array]') {
+                        value.forEach((item)=>{
+                            appendSearchParams(key, item);
+                        });
+                    } else {
+                        appendSearchParams(key, value);
+                    }
+                } else {
+                    appendSearchParams(key, value);
+                }
+            });
+        }
+        return urlObject.href;
+    } catch (error) {
+        throw new RequestError(-1, error.message);
+    }
+};
+// 在自定义对象 http 上添加各请求方法
+const http = {};
+allMethods.forEach((method)=>{
+    Object.defineProperty(http, method, {
+        get () {
+            return function() {
+                var _ref = _async_to_generator(function*(url, payload, config = {}) {
+                    const fetchConfig = getFetchConfig(method, payload, config);
+                    try {
+                        const fetchUrl = getFetchUrl(url, method, payload);
+                        const response = yield fetch(fetchUrl, fetchConfig);
+                        return yield successInterceptor(response, fetchConfig);
+                    } catch (err) {
+                        return errorInterceptor(err, fetchConfig);
+                    }
+                });
+                return function(url, payload) {
+                    return _ref.apply(this, arguments);
+                };
+            }();
+        }
+    });
+});
+// 通过 withAbort 包装 http 方法，使其支持 abort
+const withAbort = (fn)=>{
+    let controller = null;
+    const fnWithsignal = (...args)=>{
+        controller = new AbortController();
+        return fn(controller.signal, ...args);
+    };
+    fnWithsignal.abort = ()=>{
+        var _controller_abort;
+        return controller === null || controller === void 0 ? void 0 : (_controller_abort = controller.abort) === null || _controller_abort === void 0 ? void 0 : _controller_abort.call(controller);
+    };
+    return fnWithsignal;
+};
+export default http;
+export { withAbort };

package/dist/http/fetch/request-error.d.ts

@@ -0,0 +1,6 @@
+export default class RequestError extends Error {
+    code: number;
+    message: string;
+    response: any;
+    constructor(code: number, message: string, response?: any);
+}

package/dist/http/fetch/request-error.js

@@ -0,0 +1,25 @@
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+class RequestError extends Error {
+    constructor(code, message, response){
+        super();
+        _define_property(this, "code", void 0);
+        _define_property(this, "message", void 0);
+        _define_property(this, "response", void 0);
+        this.code = code;
+        this.message = message;
+        this.response = response;
+    }
+}
+export { RequestError as default };

package/dist/http/fetch/success-interceptor.d.ts

@@ -0,0 +1,3 @@
+import type { IFetchConfig } from './index';
+declare const _default: (response: any, config: IFetchConfig) => Promise<any>;
+export default _default;