paul-ai-assistant 0.1.16

package/es/components/LlmTraceV3/components/TraceContentComponents/CodeBlock/index.js

@@ -0,0 +1,82 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+/**
+ * CodeBlock 通用代码块组件
+ * 支持语法高亮（可选）和折叠功能
+ */
+
+import React, { useState } from 'react';
+import classNames from 'classnames';
+import { CSECustomIcon } from "../../../../../utils/CSEIconTool";
+import "./index.scss";
+var CodeBlock = function CodeBlock(props) {
+  var code = props.code,
+    language = props.language,
+    _props$collapsed = props.collapsed,
+    defaultCollapsed = _props$collapsed === void 0 ? false : _props$collapsed,
+    _props$collapsible = props.collapsible,
+    collapsible = _props$collapsible === void 0 ? true : _props$collapsible,
+    _props$showLineNumber = props.showLineNumbers,
+    showLineNumbers = _props$showLineNumber === void 0 ? false : _props$showLineNumber,
+    maxHeight = props.maxHeight;
+  var _useState = useState(defaultCollapsed),
+    _useState2 = _slicedToArray(_useState, 2),
+    collapsed = _useState2[0],
+    setCollapsed = _useState2[1];
+  if (!code) return null;
+  var handleToggle = function handleToggle() {
+    if (collapsible) {
+      setCollapsed(!collapsed);
+    }
+  };
+
+  // 将代码分割成行
+  var lines = code.split('\n');
+
+  // 渲染代码内容
+  var renderCode = function renderCode() {
+    if (collapsed) {
+      // 折叠时只显示第一行的前50个字符
+      var preview = code.split('\n')[0].slice(0, 50);
+      return /*#__PURE__*/React.createElement("div", {
+        className: "code-preview"
+      }, preview, code.length > 50 ? '...' : '');
+    }
+    if (showLineNumbers) {
+      return /*#__PURE__*/React.createElement("div", {
+        className: "code-with-line-numbers"
+      }, lines.map(function (line, index) {
+        return /*#__PURE__*/React.createElement("div", {
+          key: index,
+          className: "code-line"
+        }, /*#__PURE__*/React.createElement("span", {
+          className: "line-number"
+        }, index + 1), /*#__PURE__*/React.createElement("span", {
+          className: "line-content"
+        }, line || ' '));
+      }));
+    }
+    return /*#__PURE__*/React.createElement("pre", {
+      className: "code-content"
+    }, code);
+  };
+  var containerStyle = {};
+  if (maxHeight && !collapsed) {
+    containerStyle.maxHeight = "".concat(maxHeight, "px");
+    containerStyle.overflowY = 'auto';
+  }
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames('code-block', {
+      collapsible: collapsible,
+      collapsed: collapsed,
+      'with-line-numbers': showLineNumbers
+    }),
+    onClick: collapsible ? handleToggle : undefined,
+    style: containerStyle
+  }, language && !collapsed && /*#__PURE__*/React.createElement("div", {
+    className: "code-language-label"
+  }, language), renderCode(), collapsible && /*#__PURE__*/React.createElement(CSECustomIcon, {
+    type: "iconchakangengduo",
+    className: classNames('collapse-icon', collapsed ? '' : 'collapse-icon-transform')
+  }));
+};
+export default /*#__PURE__*/React.memo(CodeBlock);

package/es/components/LlmTraceV3/components/TraceContentComponents/CodeBlock/index.scss

@@ -0,0 +1,36 @@
+/**
+ * CodeBlock 代码块组件样式
+ */
+
+// ==================== 样式变量 ====================
+$trace-gap: 4px;
+$trace-small-radius: 2px;
+$trace-font-size: 12px;
+$trace-code-border-color: #e0e0e0;
+
+// ==================== CodeBlock 代码块 ====================
+.code-block {
+  background-color: #f5f5f5;
+  border: 1px solid $trace-code-border-color;
+  border-radius: $trace-small-radius;
+  padding: 8px 12px;
+  font-family: Monaco, Menlo, Consolas, monospace;
+  font-size: $trace-font-size;
+  color: #666;
+  margin: $trace-gap 0;
+  overflow-x: auto;
+  line-height: 1.5;
+
+  &.collapsible {
+    cursor: pointer;
+    position: relative;
+
+    .collapse-icon {
+      position: absolute;
+      right: 8px;
+      top: 8px;
+      width: 12px;
+      height: 12px;
+    }
+  }
+}

package/es/components/LlmTraceV3/components/TraceContentComponents/DeepThinking/index.d.ts

@@ -0,0 +1,13 @@
+/**
+ * DeepThinking 深度思考组件
+ * 展示 AI 的深度思考过程和推理结果
+ */
+import React from 'react';
+import type { IDeepThinkingResult } from '../../../types';
+import './index.scss';
+export interface IDeepThinkingProps extends IDeepThinkingResult {
+    dialogId?: string;
+    ctx?: any;
+}
+declare const _default: React.NamedExoticComponent<IDeepThinkingProps>;
+export default _default;

package/es/components/LlmTraceV3/components/TraceContentComponents/DeepThinking/index.js

@@ -0,0 +1,26 @@
+/**
+ * DeepThinking 深度思考组件
+ * 展示 AI 的深度思考过程和推理结果
+ */
+
+import React from 'react';
+import "./index.scss";
+var DeepThinking = function DeepThinking(props) {
+  var content = props.content,
+    conclusion = props.conclusion,
+    references = props.references;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "trace-v3-deep-thinking"
+  }, content && /*#__PURE__*/React.createElement("div", {
+    className: "thinking-content"
+  }, content), conclusion && /*#__PURE__*/React.createElement("div", {
+    className: "thinking-conclusion"
+  }, /*#__PURE__*/React.createElement("strong", null, "\u7ED3\u8BBA\uFF1A"), conclusion), references && references.length > 0 && /*#__PURE__*/React.createElement("div", {
+    className: "thinking-references"
+  }, /*#__PURE__*/React.createElement("strong", null, "\u53C2\u8003\uFF1A"), /*#__PURE__*/React.createElement("ul", null, references.map(function (ref, index) {
+    return /*#__PURE__*/React.createElement("li", {
+      key: index
+    }, ref);
+  }))));
+};
+export default /*#__PURE__*/React.memo(DeepThinking);

package/es/components/LlmTraceV3/components/TraceContentComponents/DeepThinking/index.scss

@@ -0,0 +1,54 @@
+/**
+ * DeepThinking 深度思考组件样式
+ */
+
+// ==================== 样式变量 ====================
+$trace-gap: 4px;
+$trace-margin-bottom: 8px;
+$trace-title-color: #171a1d;
+$trace-subtitle-color: #717579;
+$trace-content-color: #81848f;
+$trace-border-color: #dcdee0;
+
+// ==================== DeepThinking 深度思考 ====================
+.trace-v3-deep-thinking {
+  .thinking-content {
+    color: $trace-content-color;
+    line-height: 20px;
+    margin-bottom: $trace-margin-bottom;
+    white-space: pre-wrap;
+    word-break: break-word;
+  }
+
+  .thinking-conclusion {
+    margin-top: $trace-margin-bottom;
+    padding-top: $trace-margin-bottom;
+    border-top: 1px solid $trace-border-color;
+
+    strong {
+      color: $trace-title-color;
+      margin-right: 4px;
+    }
+  }
+
+  .thinking-references {
+    margin-top: $trace-margin-bottom;
+
+    strong {
+      color: $trace-title-color;
+      display: block;
+      margin-bottom: $trace-gap;
+    }
+
+    ul {
+      padding-left: 20px;
+      margin: 0;
+
+      li {
+        margin-bottom: $trace-gap;
+        color: $trace-subtitle-color;
+        line-height: 20px;
+      }
+    }
+  }
+}

package/es/components/LlmTraceV3/components/TraceContentComponents/InfoMissing/index.d.ts

@@ -0,0 +1,13 @@
+/**
+ * InfoMissing 信息缺失组件
+ * 提示缺少必要信息，需要用户补充
+ */
+import React from 'react';
+import type { IInfoMissingResult } from '../../../types';
+import './index.scss';
+export interface IInfoMissingProps extends IInfoMissingResult {
+    dialogId?: string;
+    ctx?: any;
+}
+declare const _default: React.NamedExoticComponent<IInfoMissingProps>;
+export default _default;

package/es/components/LlmTraceV3/components/TraceContentComponents/InfoMissing/index.js

@@ -0,0 +1,25 @@
+/**
+ * InfoMissing 信息缺失组件
+ * 提示缺少必要信息，需要用户补充
+ */
+import React from 'react';
+import "./index.scss";
+var InfoMissing = function InfoMissing(props) {
+  var message = props.message,
+    fields = props.fields;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "info-missing"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "missing-content"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "missing-message"
+  }, message), fields && fields.length > 0 && /*#__PURE__*/React.createElement("div", {
+    className: "missing-fields"
+  }, fields.map(function (field, index) {
+    return /*#__PURE__*/React.createElement("div", {
+      key: index,
+      className: "field-item"
+    }, "\u2022 ", field.name, ": ", field.description);
+  }))));
+};
+export default /*#__PURE__*/React.memo(InfoMissing);

package/es/components/LlmTraceV3/components/TraceContentComponents/InfoMissing/index.scss

@@ -0,0 +1,38 @@
+/**
+ * InfoMissing 信息缺失提示组件样式
+ */
+
+// ==================== 样式变量 ====================
+$trace-gap: 4px;
+$trace-small-radius: 2px;
+
+// ==================== InfoMissing 信息缺失提示 ====================
+.info-missing {
+  display: flex;
+  align-items: flex-start;
+  border-radius: $trace-small-radius;
+
+  .warning-icon {
+    width: 14px;
+    height: 14px;
+    color: #fa0;
+    flex-shrink: 0;
+  }
+
+  .missing-content {
+    flex: 1;
+
+    .missing-message {
+      margin-bottom: $trace-gap;
+    }
+
+    .missing-fields {
+      padding-left: 16px;
+
+      .field-item {
+        margin-bottom: 2px;
+        font-size: 11px;
+      }
+    }
+  }
+}

package/es/components/LlmTraceV3/components/TraceContentComponents/LinkList/index.d.ts

@@ -0,0 +1,20 @@
+/**
+ * LinkList 链接列表组件
+ * 支持有序编号和点击跳转
+ */
+import React from 'react';
+import './index.scss';
+export interface ILinkListProps {
+    links: Array<{
+        id: string;
+        title: string;
+        url: string;
+        description?: string;
+    }>;
+    ordered?: boolean;
+    openInNewTab?: boolean;
+    dialogId?: string;
+    ctx?: any;
+}
+declare const _default: React.NamedExoticComponent<ILinkListProps>;
+export default _default;

package/es/components/LlmTraceV3/components/TraceContentComponents/LinkList/index.js

@@ -0,0 +1,49 @@
+/**
+ * LinkList 链接列表组件
+ * 支持有序编号和点击跳转
+ */
+
+import React from 'react';
+import "./index.scss";
+var LinkList = function LinkList(props) {
+  var links = props.links,
+    _props$ordered = props.ordered,
+    ordered = _props$ordered === void 0 ? true : _props$ordered,
+    _props$openInNewTab = props.openInNewTab,
+    openInNewTab = _props$openInNewTab === void 0 ? true : _props$openInNewTab;
+  if (!links || links.length === 0) {
+    return null;
+  }
+  var handleLinkClick = function handleLinkClick(e, url) {
+    e.preventDefault();
+    if (openInNewTab) {
+      window.open(url, '_blank', 'noopener,noreferrer');
+    } else {
+      window.location.href = url;
+    }
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: "link-list"
+  }, links.map(function (link, index) {
+    return /*#__PURE__*/React.createElement("div", {
+      key: link.id,
+      className: "link-item",
+      onClick: function onClick(e) {
+        return handleLinkClick(e, link.url);
+      }
+    }, ordered && /*#__PURE__*/React.createElement("span", {
+      className: "link-number"
+    }, index + 1, "."), /*#__PURE__*/React.createElement("div", {
+      className: "link-content"
+    }, /*#__PURE__*/React.createElement("a", {
+      href: link.url,
+      className: "link-text",
+      onClick: function onClick(e) {
+        return e.preventDefault();
+      }
+    }, link.title), link.description && /*#__PURE__*/React.createElement("div", {
+      className: "link-description"
+    }, link.description)));
+  }));
+};
+export default /*#__PURE__*/React.memo(LinkList);

package/es/components/LlmTraceV3/components/TraceContentComponents/LinkList/index.scss

@@ -0,0 +1,37 @@
+/**
+ * LinkList 链接列表组件样式
+ */
+
+// ==================== 样式变量 ====================
+$trace-gap: 4px;
+$trace-font-size: 12px;
+$trace-running-color: #0070d2;
+
+// ==================== LinkList 链接列表 ====================
+.link-list {
+  .link-item {
+    display: flex;
+    align-items: flex-start;
+    margin-bottom: $trace-gap;
+    cursor: pointer;
+
+    .link-number {
+      min-width: 20px;
+      color: $trace-running-color;
+      font-size: $trace-font-size;
+      line-height: 20px;
+    }
+
+    .link-text {
+      color: $trace-running-color;
+      text-decoration: none;
+      flex: 1;
+      font-size: $trace-font-size;
+      line-height: 20px;
+
+      &:hover {
+        text-decoration: underline;
+      }
+    }
+  }
+}

package/es/components/LlmTraceV3/components/TraceContentComponents/SearchResults/index.d.ts

@@ -0,0 +1,13 @@
+/**
+ * SearchResults 搜索结果组件
+ * 展示联网搜索的结果列表
+ */
+import React from 'react';
+import type { ISearchResultsResult } from '../../../types';
+import './index.scss';
+export interface ISearchResultsProps extends ISearchResultsResult {
+    dialogId?: string;
+    ctx?: any;
+}
+declare const _default: React.NamedExoticComponent<ISearchResultsProps>;
+export default _default;

package/es/components/LlmTraceV3/components/TraceContentComponents/SearchResults/index.js

@@ -0,0 +1,93 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+/**
+ * SearchResults 搜索结果组件
+ * 展示联网搜索的结果列表
+ */
+import React, { useState } from 'react';
+import classNames from 'classnames';
+import { CSECustomIcon } from "../../../../../utils/CSEIconTool";
+import "./index.scss";
+var SearchResults = function SearchResults(props) {
+  var title = props.title,
+    query = props.query,
+    results = props.results,
+    _props$collapsed = props.collapsed,
+    defaultCollapsed = _props$collapsed === void 0 ? false : _props$collapsed;
+  var _useState = useState(defaultCollapsed),
+    _useState2 = _slicedToArray(_useState, 2),
+    collapsed = _useState2[0],
+    setCollapsed = _useState2[1];
+  if (!results || results.length === 0) {
+    return null;
+  }
+  var handleToggle = function handleToggle() {
+    setCollapsed(!collapsed);
+  };
+  var handleLinkClick = function handleLinkClick(url) {
+    if (url) {
+      window.open(url, '_blank', 'noopener,noreferrer');
+    }
+  };
+
+  // 渲染来源 icon
+  var renderSourceIcon = function renderSourceIcon(result) {
+    if (result.source === 'kb') {
+      // 知识库 icon
+      return /*#__PURE__*/React.createElement(CSECustomIcon, {
+        type: "iconzhishiku",
+        className: "source-icon"
+      });
+    }
+    // 网页来源，优先使用 logo
+    if (result.logo) {
+      return /*#__PURE__*/React.createElement("img", {
+        src: result.logo,
+        alt: "source logo",
+        className: "source-icon source-logo"
+      });
+    }
+    // logo 为空时使用默认 icon
+    return /*#__PURE__*/React.createElement(CSECustomIcon, {
+      type: "icondiqiu",
+      className: "source-icon"
+    });
+  };
+
+  // 构建标题文本
+  var titleText = title || "\u641C\u7D22".concat(query, " \u627E\u5230").concat(results.length, "\u7BC7\u8D44\u6599");
+  return /*#__PURE__*/React.createElement("div", {
+    className: "trace-v3-search-results"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "search-header",
+    onClick: handleToggle
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "search-header-left"
+  }, /*#__PURE__*/React.createElement(CSECustomIcon, {
+    type: "icondiqiu",
+    className: "search-icon"
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "search-title"
+  }, titleText)), /*#__PURE__*/React.createElement(CSECustomIcon, {
+    type: "iconchakangengduo",
+    className: classNames('collapse-icon', collapsed ? '' : 'collapse-icon-transform')
+  })), !collapsed && /*#__PURE__*/React.createElement("div", {
+    className: "search-results-list link-list"
+  }, results.map(function (result, index) {
+    return /*#__PURE__*/React.createElement("div", {
+      key: result.id,
+      className: classNames('link-item', !result.url && 'link-item-no-url'),
+      onClick: function onClick() {
+        return handleLinkClick(result.url);
+      }
+    }, /*#__PURE__*/React.createElement("span", {
+      className: "link-number"
+    }, index + 1, "."), renderSourceIcon(result), /*#__PURE__*/React.createElement("div", {
+      className: "link-content"
+    }, /*#__PURE__*/React.createElement("span", {
+      className: "link-text"
+    }, result.title), result.snippet && /*#__PURE__*/React.createElement("div", {
+      className: "link-snippet"
+    }, result.snippet)));
+  })));
+};
+export default /*#__PURE__*/React.memo(SearchResults);

package/es/components/LlmTraceV3/components/TraceContentComponents/SearchResults/index.scss

@@ -0,0 +1,151 @@
+/**
+ * SearchResults 搜索结果组件样式
+ * 展示联网搜索的结果列表
+ */
+
+// ==================== 样式变量 ====================
+$trace-gap: 4px;
+$trace-small-radius: 2px;
+$trace-margin-bottom: 8px;
+$trace-collapse-duration: 0.2s;
+$trace-collapse-timing: ease-in-out;
+$trace-subtitle-color: #717579;
+$trace-content-color: #474a52;
+
+// ==================== SearchResults 搜索结果 ====================
+.trace-v3-search-results {
+  background-color: #fff;
+  font-size: 12px;
+
+  .search-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: $trace-gap;
+    cursor: pointer;
+    user-select: none;
+
+    &:hover {
+      background-color: rgba(0, 0, 0, 2%);
+      border-radius: $trace-small-radius;
+    }
+
+    .search-header-left {
+      display: flex;
+      align-items: center;
+      gap: 6px;
+      flex: 1;
+
+      .search-icon {
+        width: 12px;
+        height: 12px;
+        font-size: 12px;
+        color: $trace-content-color;
+        flex-shrink: 0;
+      }
+
+      .search-title {
+        color: $trace-content-color;
+        font-size: 12px;
+        font-weight: 400;
+      }
+    }
+
+    .collapse-icon {
+      transition: transform $trace-collapse-duration $trace-collapse-timing;
+      width: 12px;
+      height: 12px;
+      color: $trace-subtitle-color;
+    }
+
+    .collapse-icon-transform {
+      transform: rotate(180deg);
+    }
+  }
+
+  .search-results-list {
+    margin-top: $trace-gap;
+    padding-left: 12px;
+    padding-bottom: 4px;
+
+    .link-item {
+      margin-bottom: $trace-margin-bottom;
+
+      .link-number {
+        font-size: 12px;
+        color: #1b58f4;
+      }
+
+      .source-icon {
+        width: 14px;
+        height: 14px;
+        font-size: 14px;
+        color: $trace-content-color;
+        flex-shrink: 0;
+        margin-right: 4px;
+        align-self: flex-start;
+        margin-top: 3px; // 与 link-text 的行高(20px)对齐，(20px - 14px) / 2 = 3px
+        display: flex;
+        align-items: center;
+
+        &.source-logo {
+          object-fit: contain;
+          border-radius: 2px;
+        }
+      }
+
+      .link-content {
+        flex: 1;
+        padding-right: 10px;
+
+        .link-text {
+          font-size: 12px !important;
+          line-height: 20px;
+          color: #1b58f4;
+        }
+
+        .link-snippet {
+          font-size: 12px;
+          color: #999;
+          margin-top: 4px;
+          line-height: 18px;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          display: box;
+          -webkit-line-clamp: 2;
+          line-clamp: 2;
+          -webkit-box-orient: vertical;
+        }
+      }
+
+      // 没有 URL 时的样式
+      &.link-item-no-url {
+        cursor: default;
+
+        .link-number {
+          color: $trace-content-color;
+        }
+
+        .link-content .link-text {
+          color: $trace-content-color !important;
+          cursor: default;
+
+          &:hover {
+            text-decoration: none;
+          }
+        }
+      }
+    }
+
+    // 覆盖通用 .link-list 样式，提高优先级
+    &.link-list .link-item {
+      .link-number {
+        font-size: 12px !important;
+      }
+
+      .link-text {
+        font-size: 12px !important;
+      }
+    }
+  }
+}

package/es/components/LlmTraceV3/components/TraceContentComponents/TaskPlanning/index.d.ts

@@ -0,0 +1,12 @@
+/**
+ * TaskPlanning 任务规划组件
+ * 展示有序的任务计划列表
+ */
+import React from 'react';
+import type { ITaskPlanningResult } from '../../../types';
+export interface ITaskPlanningProps extends ITaskPlanningResult {
+    dialogId?: string;
+    ctx?: any;
+}
+declare const _default: React.NamedExoticComponent<ITaskPlanningProps>;
+export default _default;