paul-ai-assistant 0.1.16

package/es/components/LlmTraceV3/components/TraceItem/index.js

@@ -0,0 +1,126 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _typeof from "@babel/runtime/helpers/esm/typeof";
+/**
+ * TraceItem 组件
+ * 展示单个 Trace 项，管理自身折叠状态
+ */
+import React from 'react';
+import classNames from 'classnames';
+import ErrorBoundary from "../../../../ErrorBoundary";
+import { CSECustomIcon } from "../../../../utils/CSEIconTool";
+import { shouldShowCollapseIcon } from "../../utils/collapseLogic";
+import { TRACE_V3_COMPONENT_MAP, TRACE_V3_TYPE_COMPONENT_ENUM } from "../TraceContentComponents/const";
+import TraceStatusIcon from "../TraceStatusIcon";
+
+// V3 新增组件类型集合（这些组件期望直接接收展开的 props）
+var V3_COMPONENT_TYPES = new Set([TRACE_V3_TYPE_COMPONENT_ENUM.deepThinking, TRACE_V3_TYPE_COMPONENT_ENUM.taskPlanning, TRACE_V3_TYPE_COMPONENT_ENUM.searchResults, TRACE_V3_TYPE_COMPONENT_ENUM.toolCall, TRACE_V3_TYPE_COMPONENT_ENUM.toolResult, TRACE_V3_TYPE_COMPONENT_ENUM.businessFlow, TRACE_V3_TYPE_COMPONENT_ENUM.infoMissing, TRACE_V3_TYPE_COMPONENT_ENUM.codeBlock, TRACE_V3_TYPE_COMPONENT_ENUM.linkList]);
+var TraceItem = function TraceItem(props) {
+  var showTitle = props.showTitle,
+    type = props.type,
+    result = props.result,
+    status = props.status,
+    itemKey = props.itemKey,
+    collapsed = props.collapsed,
+    onToggle = props.onToggle,
+    dialogId = props.dialogId,
+    originData = props.originData,
+    traceExternalRenderType = props.traceExternalRenderType,
+    _props$traceFinished = props.traceFinished,
+    traceFinished = _props$traceFinished === void 0 ? false : _props$traceFinished;
+
+  // 移除 showTitle 中的箭头符号（如 ➔、→、▶、► 等）
+  var cleanTitle = showTitle === null || showTitle === void 0 ? void 0 : showTitle.replace(/^[➔→▶►]\s*/, '').trim();
+  var hasContent = shouldShowCollapseIcon(result);
+
+  // 渲染组件内容
+  var renderContent = function renderContent() {
+    if (!result) return null;
+
+    // 如果有类型，尝试渲染对应组件
+    if (type) {
+      // 优先使用外部注入的组件
+      var ExternalComponent = traceExternalRenderType === null || traceExternalRenderType === void 0 ? void 0 : traceExternalRenderType[type];
+      if (ExternalComponent) {
+        return /*#__PURE__*/React.createElement(ErrorBoundary, {
+          errorMessage: "\u5916\u90E8\u7EC4\u4EF6\u6E32\u67D3\u5F02\u5E38"
+        }, /*#__PURE__*/React.createElement(ExternalComponent, _extends({}, _typeof(result) === 'object' ? result : {
+          result: result
+        }, {
+          dialogId: dialogId,
+          ctx: originData
+        })));
+      }
+
+      // 使用 TraceV3 组件映射（包含 V2 + V3 组件）
+      var InternalComponent = TRACE_V3_COMPONENT_MAP[type];
+      if (InternalComponent) {
+        // 判断是否是 V3 新增组件
+        var isV3Component = V3_COMPONENT_TYPES.has(type);
+
+        // V3 组件：直接展开 result 传递
+        // V2 组件：保持原有的 data 包装格式
+        var componentProps = isV3Component ? _objectSpread(_objectSpread({}, _typeof(result) === 'object' ? result : {
+          result: result
+        }), {}, {
+          dialogId: dialogId,
+          ctx: originData
+        }) : {
+          data: {
+            type: type,
+            result: result,
+            showTitle: showTitle,
+            status: status
+          },
+          originData: originData,
+          dialogId: dialogId
+        };
+        return /*#__PURE__*/React.createElement(ErrorBoundary, {
+          errorMessage: "\u5185\u7F6E\u7EC4\u4EF6\u6E32\u67D3\u5F02\u5E38"
+        }, /*#__PURE__*/React.createElement(InternalComponent, componentProps));
+      }
+    }
+
+    // 默认展示文本内容
+    if (typeof result === 'string') {
+      return /*#__PURE__*/React.createElement("div", {
+        className: "trace-v3-default-content"
+      }, result);
+    }
+    if (_typeof(result) === 'object') {
+      return /*#__PURE__*/React.createElement("pre", {
+        className: "trace-v3-default-content"
+      }, JSON.stringify(result, null, 2));
+    }
+    return null;
+  };
+  var handleToggle = function handleToggle(e) {
+    e.stopPropagation();
+    if (hasContent) {
+      onToggle(itemKey);
+    }
+  };
+
+  // 当没有 showTitle 时,直接展示内容,不需要折叠控制
+  var shouldRenderContent = showTitle ? !collapsed && hasContent : hasContent;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "trace-v3-item"
+  }, showTitle && /*#__PURE__*/React.createElement("div", {
+    className: "trace-v3-item-title",
+    onClick: handleToggle
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "trace-v3-item-title-left"
+  }, status && /*#__PURE__*/React.createElement(TraceStatusIcon, {
+    status: status,
+    size: "medium",
+    traceFinished: traceFinished
+  }), /*#__PURE__*/React.createElement("span", null, cleanTitle)), hasContent && /*#__PURE__*/React.createElement(CSECustomIcon, {
+    type: "iconchakangengduo",
+    className: classNames('trace-v3-item-collapse-icon', collapsed ? '' : 'trace-item-collapse-icon-transform')
+  })), shouldRenderContent && /*#__PURE__*/React.createElement("div", {
+    className: "trace-v3-item-content"
+  }, renderContent()));
+};
+export default /*#__PURE__*/React.memo(TraceItem, function (prevProps, nextProps) {
+  return prevProps.showTitle === nextProps.showTitle && prevProps.type === nextProps.type && prevProps.result === nextProps.result && prevProps.status === nextProps.status && prevProps.collapsed === nextProps.collapsed && prevProps.traceFinished === nextProps.traceFinished;
+});

package/es/components/LlmTraceV3/components/TraceSlide/index.d.ts

@@ -0,0 +1,30 @@
+/**
+ * TraceSlide 滑动展示组件
+ * 横向布局展示 AI 解读状态
+ */
+import React from 'react';
+import type { TRACE_STATUS_ENUM } from '../../../../constants/traceDataStatus';
+import type { TraceSlideContentItem } from '../../types';
+import './index.scss';
+export interface ITraceSlideProps {
+    /** 思考状态 */
+    status?: TRACE_STATUS_ENUM;
+    /** 思考名称/标题 */
+    traceName?: string;
+    /** 状态文本 */
+    statusText?: string;
+    /** 思考过程的详细内容数组（支持 markdown 字符串或复杂组件对象） */
+    content?: TraceSlideContentItem[];
+    /** 对话 ID */
+    dialogId?: string;
+    /** 原始数据 */
+    originData?: any;
+    /** 外部组件注入 */
+    traceExternalRenderType?: {
+        [key: string]: React.ComponentType<any>;
+    };
+    /** 是否包含 InspectionCard */
+    hasInspectionCard?: boolean;
+}
+declare const _default: React.NamedExoticComponent<ITraceSlideProps>;
+export default _default;

package/es/components/LlmTraceV3/components/TraceSlide/index.js

@@ -0,0 +1,278 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _typeof from "@babel/runtime/helpers/esm/typeof";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+/**
+ * TraceSlide 滑动展示组件
+ * 横向布局展示 AI 解读状态
+ */
+import React, { useEffect, useRef, useState } from 'react';
+import classNames from 'classnames';
+import ErrorBoundary from "../../../../ErrorBoundary";
+import MarkDown from "../../../MarkDown";
+import { TRACE_V3_COMPONENT_MAP, TRACE_V3_TYPE_COMPONENT_ENUM } from "../TraceContentComponents/const";
+import { CSECustomIcon } from "../../../../utils/CSEIconTool";
+import "./index.scss";
+
+/** 动画状态接口 */
+
+// V3 新增组件类型集合（这些组件期望直接接收展开的 props）
+var V3_COMPONENT_TYPES = new Set([TRACE_V3_TYPE_COMPONENT_ENUM.deepThinking, TRACE_V3_TYPE_COMPONENT_ENUM.taskPlanning, TRACE_V3_TYPE_COMPONENT_ENUM.searchResults, TRACE_V3_TYPE_COMPONENT_ENUM.toolCall, TRACE_V3_TYPE_COMPONENT_ENUM.toolResult, TRACE_V3_TYPE_COMPONENT_ENUM.businessFlow, TRACE_V3_TYPE_COMPONENT_ENUM.infoMissing, TRACE_V3_TYPE_COMPONENT_ENUM.codeBlock, TRACE_V3_TYPE_COMPONENT_ENUM.linkList]);
+var TraceSlide = function TraceSlide(props) {
+  var status = props.status,
+    traceName = props.traceName,
+    statusText = props.statusText,
+    content = props.content,
+    dialogId = props.dialogId,
+    originData = props.originData,
+    traceExternalRenderType = props.traceExternalRenderType,
+    hasInspectionCard = props.hasInspectionCard;
+
+  // 动画状态
+  var _useState = useState({
+      currentStatusText: statusText,
+      nextStatusText: null,
+      animatingStatusText: false,
+      currentStatusTextKey: 0,
+      nextStatusTextKey: 1,
+      currentContent: content || [],
+      nextContent: null,
+      animatingContent: false,
+      currentContentKey: 0,
+      nextContentKey: 1
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    animationState = _useState2[0],
+    setAnimationState = _useState2[1];
+
+  // 缓存前一次的值
+  var prevStatusTextRef = useRef(statusText);
+  var prevContentRef = useRef(content);
+
+  // 是否首次渲染
+  var isFirstRenderRef = useRef(true);
+
+  // 动画定时器引用
+  var statusTextTimerRef = useRef(null);
+  var contentTimerRef = useRef(null);
+
+  // 监听 statusText 变化
+  useEffect(function () {
+    // 首次渲染不触发动画
+    if (isFirstRenderRef.current) {
+      isFirstRenderRef.current = false;
+      return;
+    }
+
+    // 检查是否真正变化
+    if (prevStatusTextRef.current !== statusText) {
+      // 清除之前的定时器
+      if (statusTextTimerRef.current) {
+        clearTimeout(statusTextTimerRef.current);
+      }
+
+      // 开始动画：设置新内容并触发动画
+      setAnimationState(function (prev) {
+        return _objectSpread(_objectSpread({}, prev), {}, {
+          nextStatusText: statusText,
+          animatingStatusText: true,
+          nextStatusTextKey: prev.currentStatusTextKey + 1
+        });
+      });
+
+      // 350ms 后完成动画
+      statusTextTimerRef.current = window.setTimeout(function () {
+        setAnimationState(function (prev) {
+          return _objectSpread(_objectSpread({}, prev), {}, {
+            currentStatusText: statusText,
+            nextStatusText: null,
+            animatingStatusText: false,
+            currentStatusTextKey: prev.nextStatusTextKey
+          });
+        });
+      }, 350); // 动画时长 + buffer
+
+      prevStatusTextRef.current = statusText;
+    }
+  }, [statusText]);
+
+  // 监听 content 变化
+  useEffect(function () {
+    // 首次渲染不触发动画
+    if (isFirstRenderRef.current) {
+      return;
+    }
+
+    // 深度比较 content 数组
+    var contentChanged = JSON.stringify(prevContentRef.current) !== JSON.stringify(content);
+    if (contentChanged) {
+      // 清除之前的定时器
+      if (contentTimerRef.current) {
+        clearTimeout(contentTimerRef.current);
+      }
+
+      // 开始动画
+      setAnimationState(function (prev) {
+        return _objectSpread(_objectSpread({}, prev), {}, {
+          nextContent: content || [],
+          animatingContent: true,
+          nextContentKey: prev.currentContentKey + 1
+        });
+      });
+
+      // 350ms 后完成动画
+      contentTimerRef.current = window.setTimeout(function () {
+        setAnimationState(function (prev) {
+          return _objectSpread(_objectSpread({}, prev), {}, {
+            currentContent: content || [],
+            nextContent: null,
+            animatingContent: false,
+            currentContentKey: prev.nextContentKey
+          });
+        });
+      }, 350);
+      prevContentRef.current = content;
+    }
+  }, [content]);
+
+  // 清理定时器
+  useEffect(function () {
+    return function () {
+      if (statusTextTimerRef.current) {
+        clearTimeout(statusTextTimerRef.current);
+      }
+      if (contentTimerRef.current) {
+        clearTimeout(contentTimerRef.current);
+      }
+    };
+  }, []);
+
+  // 渲染状态图标
+  var renderStatusIcon = function renderStatusIcon() {
+    return /*#__PURE__*/React.createElement("img", {
+      src: "https://img.alicdn.com/imgextra/i3/O1CN013RmVnC1Zbbfa3vYLH_!!6000000003213-1-tps-64-64.gif",
+      alt: "\u601D\u8003\u4E2D",
+      className: "trace-slide-status-icon"
+    });
+  };
+
+  // 渲染单个内容项
+  var renderContentItem = function renderContentItem(item, index) {
+    // 如果是字符串，使用 MarkDown 渲染
+    if (typeof item === 'string') {
+      return /*#__PURE__*/React.createElement("div", {
+        key: index,
+        className: "trace-slide-content-item"
+      }, /*#__PURE__*/React.createElement(MarkDown, {
+        data: item
+      }));
+    }
+
+    // 如果是对象，根据 type 渲染对应组件
+    if (_typeof(item) === 'object' && item.type) {
+      var type = item.type,
+        result = item.result,
+        showTitle = item.showTitle,
+        itemStatus = item.status;
+
+      // 优先使用外部注入的组件
+      var ExternalComponent = traceExternalRenderType === null || traceExternalRenderType === void 0 ? void 0 : traceExternalRenderType[type];
+      if (ExternalComponent) {
+        return /*#__PURE__*/React.createElement("div", {
+          key: index,
+          className: "trace-slide-content-item"
+        }, /*#__PURE__*/React.createElement(ErrorBoundary, {
+          errorMessage: "\u5916\u90E8\u7EC4\u4EF6\u6E32\u67D3\u5F02\u5E38"
+        }, /*#__PURE__*/React.createElement(ExternalComponent, _extends({}, _typeof(result) === 'object' ? result : {
+          result: result
+        }, {
+          dialogId: dialogId,
+          ctx: originData
+        }))));
+      }
+
+      // 使用 TraceV3 组件映射
+      var InternalComponent = TRACE_V3_COMPONENT_MAP[type];
+      if (InternalComponent) {
+        // 判断是否是 V3 新增组件
+        var isV3Component = V3_COMPONENT_TYPES.has(type);
+
+        // V3 组件：直接展开 result 传递
+        // V2 组件：保持原有的 data 包装格式
+        var componentProps = isV3Component ? _objectSpread(_objectSpread({}, _typeof(result) === 'object' ? result : {
+          result: result
+        }), {}, {
+          dialogId: dialogId,
+          ctx: originData
+        }) : {
+          data: {
+            type: type,
+            result: result,
+            showTitle: showTitle,
+            status: itemStatus
+          },
+          originData: originData,
+          dialogId: dialogId
+        };
+        return /*#__PURE__*/React.createElement("div", {
+          key: index,
+          className: "trace-slide-content-item"
+        }, /*#__PURE__*/React.createElement(ErrorBoundary, {
+          errorMessage: "\u5185\u7F6E\u7EC4\u4EF6\u6E32\u67D3\u5F02\u5E38"
+        }, /*#__PURE__*/React.createElement(InternalComponent, componentProps)));
+      }
+    }
+
+    // 默认展示文本内容
+    if (_typeof(item) === 'object') {
+      return /*#__PURE__*/React.createElement("div", {
+        key: index,
+        className: "trace-slide-content-item"
+      }, /*#__PURE__*/React.createElement("pre", {
+        className: "trace-slide-default-content"
+      }, JSON.stringify(item, null, 2)));
+    }
+    return null;
+  };
+
+  // 是否显示 content
+  var shouldShowContent = animationState.currentContent.length > 0 || animationState.animatingContent;
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames('llm-trace-slide-container', {
+      'has-inspection-card': hasInspectionCard
+    })
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "trace-slide-status-bar"
+  }, renderStatusIcon(), /*#__PURE__*/React.createElement("span", {
+    className: "trace-slide-title"
+  }, /*#__PURE__*/React.createElement(CSECustomIcon, {
+    type: "iconstar-o",
+    size: "small"
+  }), " ", traceName), /*#__PURE__*/React.createElement("div", {
+    className: "trace-slide-status-text-wrapper"
+  }, /*#__PURE__*/React.createElement("span", {
+    className: classNames('trace-slide-status-text', animationState.animatingStatusText && 'slide-exit'),
+    key: animationState.currentStatusTextKey
+  }, animationState.currentStatusText), animationState.animatingStatusText && animationState.nextStatusText && /*#__PURE__*/React.createElement("span", {
+    className: "trace-slide-status-text slide-enter",
+    key: animationState.nextStatusTextKey
+  }, animationState.nextStatusText))), shouldShowContent && /*#__PURE__*/React.createElement("div", {
+    className: "trace-slide-content-wrapper"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classNames('trace-slide-content', animationState.animatingContent && 'slide-exit'),
+    key: animationState.currentContentKey
+  }, animationState.currentContent.map(function (item, index) {
+    return renderContentItem(item, index);
+  })), animationState.animatingContent && animationState.nextContent && animationState.nextContent.length > 0 && /*#__PURE__*/React.createElement("div", {
+    className: "trace-slide-content slide-enter",
+    key: animationState.nextContentKey
+  }, animationState.nextContent.map(function (item, index) {
+    return renderContentItem(item, index);
+  }))));
+};
+
+// 自定义 memo 比较函数
+export default /*#__PURE__*/React.memo(TraceSlide, function (prevProps, nextProps) {
+  // 返回 true 表示不重新渲染，false 表示重新渲染
+  return prevProps.status === nextProps.status && prevProps.traceName === nextProps.traceName && prevProps.statusText === nextProps.statusText && JSON.stringify(prevProps.content) === JSON.stringify(nextProps.content) && prevProps.dialogId === nextProps.dialogId && prevProps.traceExternalRenderType === nextProps.traceExternalRenderType;
+});

package/es/components/LlmTraceV3/components/TraceSlide/index.scss

@@ -0,0 +1,204 @@
+/**
+ * TraceSlide 滑动展示组件样式
+ * 横向布局的简洁样式
+ */
+
+// ==================== 样式变量 ====================
+
+$trace-slide-bg-color: transparent;
+$trace-slide-title-color: #171a1d;
+$trace-slide-status-color: #81848f;
+$trace-slide-content-color: #474a52;
+
+// 间距
+$trace-slide-gap: 8px;
+$trace-slide-padding: 0;
+
+// 字体大小
+$trace-slide-font-size: 12px;
+
+// 动画配置
+$slide-animation-duration: 0.35s;
+$slide-animation-easing: cubic-bezier(0.4, 0, 0.2, 1); // Material Design 标准缓动
+$slide-distance: 20px; // 滚动距离
+
+// ==================== Keyframes 动画定义 ====================
+
+// 退出动画：向上滚动并淡出
+@keyframes slideExit {
+  0% {
+    transform: translateY(0);
+    opacity: 1;
+  }
+
+  100% {
+    transform: translateY(-#{$slide-distance});
+    opacity: 0;
+  }
+}
+
+// 进入动画：从下方向上滚动并淡入
+@keyframes slideEnter {
+  0% {
+    transform: translateY($slide-distance);
+    opacity: 0;
+  }
+
+  100% {
+    transform: translateY(0);
+    opacity: 1;
+  }
+}
+
+// ==================== TraceSlide 容器 ====================
+
+.llm-trace-slide-container {
+  flex: 1;
+  min-width: 0;
+  background-color: $trace-slide-bg-color;
+  padding: $trace-slide-padding;
+  font-size: $trace-slide-font-size;
+  line-height: 20px;
+  margin-bottom: 8px;
+
+  // ==================== 状态栏 ====================
+
+  .trace-slide-status-bar {
+    display: flex;
+    align-items: center;
+    gap: $trace-slide-gap;
+
+    .trace-slide-status-icon {
+      width: 24px;
+      height: 24px;
+      flex-shrink: 0;
+    }
+
+    .trace-slide-title {
+      display: flex;
+      align-items: center;
+      gap: 4px;
+      font-size: 12px;
+      font-weight: 400;
+      line-height: 16px;
+      color: #81848f;
+      background-color: #edeef0;
+      border-radius: 10px;
+      padding: 4px 8px;
+      flex-shrink: 0;
+    }
+
+    // statusText 动画容器
+    .trace-slide-status-text-wrapper {
+      position: relative;
+      display: flex;
+      align-items: center;
+      flex: 1;
+      min-width: 0; // 防止 flex 子元素溢出
+      overflow: hidden; // 隐藏动画过程中的溢出内容
+      height: 24px; // 固定高度，防止抖动
+    }
+
+    .trace-slide-status-text {
+      display: inline-block;
+      font-size: $trace-slide-font-size;
+      font-weight: 400;
+      color: $trace-slide-status-color;
+
+      // 退出动画
+      &.slide-exit {
+        animation: slideExit $slide-animation-duration $slide-animation-easing forwards;
+      }
+
+      // 进入动画
+      &.slide-enter {
+        position: absolute;
+        top: 0;
+        left: 0;
+        right: 0;
+        animation: slideEnter $slide-animation-duration $slide-animation-easing forwards;
+      }
+    }
+  }
+
+  // ==================== 详细内容 ====================
+
+  // content 动画容器
+  .trace-slide-content-wrapper {
+    position: relative;
+    overflow: hidden; // 隐藏动画过程中的溢出内容
+    margin-top: $trace-slide-gap;
+    padding-left: 32px; // 对齐图标右侧
+    // max-height: 72px; // 固定高度，大约显示 3 行内容（22px * 3 + 间距）
+  }
+
+  .trace-slide-content {
+    max-height: 200px;
+    overflow-y: auto;
+
+    // 退出动画
+    &.slide-exit {
+      animation: slideExit $slide-animation-duration $slide-animation-easing forwards;
+    }
+
+    // 进入动画
+    &.slide-enter {
+      position: absolute;
+      top: 0;
+      left: 0;
+      right: 0;
+      padding-left: 32px; // 对齐图标右侧
+      animation: slideEnter $slide-animation-duration $slide-animation-easing forwards;
+    }
+
+    .trace-slide-content-item {
+      margin-bottom: 0;
+
+      // Markdown 内容样式
+      font-size: $trace-slide-font-size;
+      color: $trace-slide-content-color;
+      line-height: 22px;
+
+      // 覆盖 MarkDown 组件的默认样式
+      p {
+        margin: 0;
+        line-height: 22px;
+      }
+
+      ul,
+      ol {
+        margin: 4px 0;
+        padding-left: 20px;
+      }
+
+      code {
+        background-color: rgba(0, 0, 0, 5%);
+        padding: 2px 4px;
+        border-radius: 2px;
+        font-size: 13px;
+      }
+    }
+  }
+
+  // 当包含 InspectionCard 时，不限制高度
+  &.has-inspection-card {
+    .trace-slide-content {
+      max-height: none;
+      overflow-y: visible;
+    }
+  }
+}
+
+// ==================== 响应式处理 ====================
+
+@media (width <= 768px) {
+  .llm-trace-slide-container {
+    .trace-slide-content-wrapper {
+      padding-left: 0;
+    }
+
+    .trace-slide-content.slide-enter {
+      padding-left: 0;
+    }
+  }
+}

package/es/components/LlmTraceV3/components/TraceStatusIcon/index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * TraceStatusIcon 组件
+ * 根据状态渲染对应图标
+ */
+import React from 'react';
+import type { ITraceStatusIconProps } from '../../types';
+declare const _default: React.NamedExoticComponent<ITraceStatusIconProps>;
+export default _default;

package/es/components/LlmTraceV3/components/TraceStatusIcon/index.js

@@ -0,0 +1,41 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+/**
+ * TraceStatusIcon 组件
+ * 根据状态渲染对应图标
+ */
+import React from 'react';
+import classNames from 'classnames';
+import { TRACE_STATUS_ENUM, TRACE_STATUS_MAP } from "../../../../constants/traceDataStatus";
+import { CSECustomIcon } from "../../../../utils/CSEIconTool";
+var TraceStatusIcon = function TraceStatusIcon(props) {
+  var status = props.status,
+    _props$size = props.size,
+    size = _props$size === void 0 ? 'medium' : _props$size,
+    _props$showAnimation = props.showAnimation,
+    showAnimation = _props$showAnimation === void 0 ? true : _props$showAnimation,
+    _props$traceFinished = props.traceFinished,
+    traceFinished = _props$traceFinished === void 0 ? false : _props$traceFinished;
+
+  // 如果整体 trace 已完成，且当前状态是 RUNNING，则转换为 SUCCESS 状态
+  var actualStatus = traceFinished && status === TRACE_STATUS_ENUM.RUNNING ? TRACE_STATUS_ENUM.SUCCESS : status;
+  var statusConfig = TRACE_STATUS_MAP[actualStatus];
+  if (!statusConfig) {
+    return null;
+  }
+  var sizeMap = {
+    small: 12,
+    medium: 14,
+    large: 16
+  };
+  var iconSize = sizeMap[size];
+  var shouldSpin = showAnimation && statusConfig.iconClassName === 'iconfont-spin';
+  return /*#__PURE__*/React.createElement(CSECustomIcon, {
+    type: statusConfig.icon,
+    className: classNames('trace-v3-status-icon', _defineProperty({}, statusConfig.iconClassName || '', shouldSpin)),
+    style: {
+      // color: statusConfig.iconColor,
+      fontSize: "".concat(iconSize, "px")
+    }
+  });
+};
+export default /*#__PURE__*/React.memo(TraceStatusIcon);