@hsu-react/ui 0.0.1

package/es/components/Chat/ChatList/_components/Assistant/AssistantItem/_components/Copy/index.module.less

@@ -0,0 +1,51 @@
+.Copy {
+  display: flex;
+  align-items: center;
+  column-gap: 5px;
+
+  width: max-content;
+  padding: 2px 4px;
+
+  font-size: 14px;
+  line-height: 18px;
+  color: #5e6772;
+
+  cursor: pointer;
+
+  transition: color 0.3s, background-color 0.3s;
+
+  border-radius: 4px;
+
+  .icon {
+    font-size: 18px;
+    color: #5e6772;
+
+    transition: color 0.3s;
+  }
+
+  &:hover {
+    color: #060607;
+
+    background-color: #f3f5fc;
+
+    .icon {
+      color: #060607;
+    }
+  }
+}
+
+.Copyed {
+  display: flex;
+  align-items: center;
+  column-gap: 5px;
+
+  font-size: 14px;
+  line-height: 18px;
+  color: var(--text-color);
+
+  cursor: default;
+
+  .icon {
+    font-size: 18px;
+  }
+}

package/es/components/Chat/ChatList/_components/Assistant/AssistantItem/_components/LikeDislike/index.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+interface LikeDislikeProps {
+    messageId?: string;
+    initialLike?: boolean | null;
+    onLikeChange?: (messageId: string, like: boolean | null, content: string) => void;
+}
+declare const LikeDislike: React.FC<LikeDislikeProps>;
+export default LikeDislike;

package/es/components/Chat/ChatList/_components/Assistant/AssistantItem/_components/LikeDislike/index.js

@@ -0,0 +1,92 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import React, { useEffect, useState } from "react";
+import Icon from "../../../../../../../Icon";
+import Form from "../../../../../../../Form";
+import styles from "./index.module.less";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+var LikeDislike = function LikeDislike(_ref) {
+  var messageId = _ref.messageId,
+    initialLike = _ref.initialLike,
+    onLikeChange = _ref.onLikeChange;
+  var _useState = useState(null),
+    _useState2 = _slicedToArray(_useState, 2),
+    like = _useState2[0],
+    setLike = _useState2[1];
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    feedback = _useState4[0],
+    setFeedback = _useState4[1];
+  useEffect(function () {
+    setLike(initialLike !== null && initialLike !== void 0 ? initialLike : null);
+  }, [initialLike]);
+  if (!onLikeChange) {
+    return null;
+  }
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsxs("div", {
+      className: styles.like,
+      children: [/*#__PURE__*/_jsx("div", {
+        className: styles.likeItem,
+        onClick: function onClick() {
+          setLike(like === true ? null : true);
+          if (messageId) {
+            onLikeChange === null || onLikeChange === void 0 || onLikeChange(messageId, like === true ? null : true, "");
+          }
+        },
+        children: /*#__PURE__*/_jsx(Icon, {
+          icon: "iconamoon:like-".concat(like === true ? "fill" : "light"),
+          className: styles.likeIcon
+        })
+      }), /*#__PURE__*/_jsx("div", {
+        className: styles.likeItem,
+        onClick: function onClick() {
+          if (like === false) {
+            setLike(null);
+            if (messageId) {
+              onLikeChange === null || onLikeChange === void 0 || onLikeChange(messageId, null, "");
+            }
+          } else {
+            setFeedback(true);
+          }
+        },
+        children: /*#__PURE__*/_jsx(Icon, {
+          icon: "iconamoon:dislike-".concat(like === false ? "fill" : "light"),
+          className: styles.likeIcon
+        })
+      })]
+    }), /*#__PURE__*/_jsx(Form.Modal, {
+      title: "\u53CD\u9988",
+      open: feedback,
+      centered: true,
+      className: styles.formModal,
+      onCancel: function onCancel() {
+        return setFeedback(false);
+      },
+      onOk: function onOk(data, form) {
+        setFeedback(false);
+        setLike(false);
+        if (messageId) {
+          onLikeChange === null || onLikeChange === void 0 || onLikeChange(messageId, false, data.content || "");
+        }
+        form.resetFields();
+      },
+      width: "40%",
+      maskClosable: false,
+      formItems: [{
+        type: "TEXTAREA",
+        name: "content",
+        componentProps: {
+          rows: 10
+        }
+      }]
+    })]
+  });
+};
+export default LikeDislike;

package/es/components/Chat/ChatList/_components/Assistant/AssistantItem/_components/LikeDislike/index.module.less

@@ -0,0 +1,41 @@
+.like {
+  display: flex;
+  align-items: center;
+  column-gap: 5px;
+
+  .likeItem {
+    display: flex;
+    align-items: center;
+    column-gap: 2px;
+
+    width: max-content;
+    padding: 2px 4px;
+
+    font-size: 14px;
+    line-height: 18px;
+    color: #5e6772;
+
+    cursor: pointer;
+
+    transition: color 0.3s, background-color 0.3s;
+
+    .likeIcon {
+      font-size: 20px;
+      color: #5e6772;
+
+      transition: color 0.3s;
+    }
+
+    &:hover {
+      color: #060607;
+
+      background-color: #f3f5fc;
+
+      border-radius: 4px;
+
+      .likeIcon {
+        color: #060607;
+      }
+    }
+  }
+}

package/es/components/Chat/ChatList/_components/Assistant/AssistantItem/_components/QuoteList/index.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { Quote } from "../../../../../_hooks";
+interface QuoteListProps {
+    retrieverResources?: Quote[];
+}
+declare const QuoteList: React.FC<QuoteListProps>;
+export default QuoteList;

package/es/components/Chat/ChatList/_components/Assistant/AssistantItem/_components/QuoteList/index.js

@@ -0,0 +1,102 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import React, { useEffect, useRef, useState } from "react";
+import classNames from "classnames";
+import Icon from "../../../../../../../Icon";
+import { useCalculateRowIndex } from "../../../../../_hooks";
+import FilePreview from "../../../../../../../FilePreview";
+import { deepCopy, Equal } from "hsu-utils";
+import styles from "./index.module.less";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+var QuoteList = function QuoteList(_ref) {
+  var retrieverResources = _ref.retrieverResources;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    showMore = _useState2[0],
+    setShowMore = _useState2[1];
+  var _useState3 = useState(""),
+    _useState4 = _slicedToArray(_useState3, 2),
+    text = _useState4[0],
+    setText = _useState4[1];
+  var _useState5 = useState(""),
+    _useState6 = _slicedToArray(_useState5, 2),
+    fileType = _useState6[0],
+    setFileType = _useState6[1];
+  var containerRef = useRef(null);
+  var _useCalculateRowIndex = useCalculateRowIndex(containerRef, deepCopy(retrieverResources !== null && retrieverResources !== void 0 ? retrieverResources : [])),
+    _useCalculateRowIndex2 = _slicedToArray(_useCalculateRowIndex, 2),
+    quoteList = _useCalculateRowIndex2[0],
+    setQuoteList = _useCalculateRowIndex2[1];
+  var _useState7 = useState([]),
+    _useState8 = _slicedToArray(_useState7, 2),
+    lastQuoteList = _useState8[0],
+    setLastQuoteList = _useState8[1];
+  useEffect(function () {
+    if (!Equal.ObjEqual(lastQuoteList, retrieverResources !== null && retrieverResources !== void 0 ? retrieverResources : [])) {
+      setQuoteList(deepCopy(retrieverResources !== null && retrieverResources !== void 0 ? retrieverResources : []));
+      setLastQuoteList(deepCopy(retrieverResources !== null && retrieverResources !== void 0 ? retrieverResources : []));
+    }
+  }, [retrieverResources, lastQuoteList, setQuoteList]);
+  if (!(quoteList !== null && quoteList !== void 0 && quoteList.length)) {
+    return null;
+  }
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsxs("div", {
+      className: styles.quoteList,
+      ref: containerRef,
+      children: [/*#__PURE__*/_jsxs("div", {
+        className: styles.quoteListTitle,
+        children: [/*#__PURE__*/_jsx(Icon, {
+          icon: "gridicons:quote",
+          className: styles.quoteIcon
+        }), /*#__PURE__*/_jsx("span", {
+          children: "\u5F15\u7528"
+        }), /*#__PURE__*/_jsx("hr", {}), !!quoteList.filter(function (i) {
+          return i.row !== 1;
+        }).length && /*#__PURE__*/_jsx("div", {
+          className: classNames(styles.quoteListTitleIcon),
+          onClick: function onClick() {
+            setShowMore(!showMore);
+          },
+          children: /*#__PURE__*/_jsx(Icon, {
+            icon: showMore ? "cuida:caret-up-outline" : "cuida:caret-down-outline"
+          })
+        })]
+      }), /*#__PURE__*/_jsx("div", {
+        className: classNames(styles.quoteListContent, _defineProperty({}, styles.hide, !!quoteList.filter(function (i) {
+          return i.row !== 1;
+        }).length && !showMore)),
+        children: quoteList === null || quoteList === void 0 ? void 0 : quoteList.map(function (quoteItem, quoteIdx) {
+          return /*#__PURE__*/_jsx("div", {
+            onClick: function onClick() {
+              var fileType = quoteItem.documentName.split(".")[1] === "txt" ? "txt" : "md";
+              setFileType(fileType);
+              setText(quoteItem.content);
+            },
+            className: classNames(styles.quoteListItem, _defineProperty(_defineProperty({}, styles.lastRow, quoteItem.lastRow), styles.lastRowIndex, quoteItem.lastRowIndex)),
+            children: quoteItem.documentName
+          }, quoteIdx);
+        })
+      })]
+    }), /*#__PURE__*/_jsx(FilePreview, {
+      open: !!text,
+      onClose: function onClose() {
+        return setText("");
+      },
+      text: text,
+      fileType: fileType,
+      className: styles.filePreview
+    })]
+  });
+};
+export default QuoteList;

package/es/components/Chat/ChatList/_components/Assistant/AssistantItem/_components/QuoteList/index.module.less

@@ -0,0 +1,129 @@
+.quoteList {
+  display: flex;
+  flex-direction: column;
+  row-gap: 8px;
+
+  .quoteListTitle {
+    display: flex;
+    align-items: center;
+    column-gap: 5px;
+
+    width: 100%;
+    margin-bottom: 8px;
+
+    font-size: 14px;
+    line-height: 14px;
+    color: #667085;
+    white-space: nowrap;
+
+    cursor: default;
+
+    user-select: none;
+
+    > hr {
+      flex: 1;
+
+      min-width: 0px;
+      height: 1px;
+
+      background-color: #e8ebf0;
+    }
+
+    .quoteIcon {
+      font-size: 14px;
+    }
+
+    .quoteListTitleIcon {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+
+      width: 24px;
+      height: 24px;
+
+      font-size: 18px;
+
+      cursor: pointer;
+
+      transition: color 0.3s;
+
+      &:hover {
+        color: #3976dd;
+      }
+    }
+  }
+
+  .quoteListContent {
+    position: relative;
+
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px;
+
+    width: 100%;
+
+    &.hide {
+      max-height: 58px;
+
+      overflow: hidden;
+
+      &::after {
+        content: "";
+        position: absolute;
+        bottom: 0;
+        left: 0;
+        z-index: 100;
+
+        width: 100%;
+        height: 50%;
+
+        background: linear-gradient(
+          rgba(255, 255, 255, 0),
+          rgba(255, 255, 255, 0.91)
+        );
+      }
+    }
+
+    .quoteListItem {
+      display: flex;
+      align-items: center;
+
+      width: max-content;
+      max-width: 100%;
+      height: max-content;
+      padding: 4px 8px;
+
+      overflow: hidden;
+
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      font-size: 12px;
+
+      cursor: pointer;
+
+      border-radius: 4px;
+
+      background-color: #f3f5fc;
+
+      transition: background-color 0.3s, color 0.3s;
+
+      &:hover {
+        color: #fff;
+
+        background-color: #3976dd;
+      }
+
+      &.lastRowIndex {
+        margin-right: 0px;
+      }
+
+      &.lastRow {
+        margin-bottom: 0px;
+      }
+    }
+  }
+}
+
+.filePreview {
+  font-size: 14px;
+}

package/es/components/Chat/ChatList/_components/Assistant/AssistantItem/index.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+import { AnswerMessage } from "../../..";
+interface AssistantItemProps {
+    item: AnswerMessage;
+    assistanting?: boolean;
+    onAgain?: () => void;
+    hideTool?: boolean;
+    onLikeChange?: (messageId: string, like: boolean | null, content: string) => void;
+    isLast?: boolean;
+    className?: string;
+    noAnswerTip?: string;
+}
+declare const AssistantItem: React.FC<AssistantItemProps>;
+export default AssistantItem;

package/es/components/Chat/ChatList/_components/Assistant/AssistantItem/index.js

@@ -0,0 +1,111 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import React, { useState, useEffect, useRef } from "react";
+import styles from "./index.module.less";
+import classNames from "classnames";
+import Markdown from "../../../../../Markdown";
+import { cleanRedactedReasoning } from "../../../_utils";
+import { Bubble, Think } from "@ant-design/x";
+import Copy from "./_components/Copy";
+import QuoteList from "./_components/QuoteList";
+import LikeDislike from "./_components/LikeDislike";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var AssistantItem = function AssistantItem(props) {
+  var _item$think, _item$think2;
+  var item = props.item,
+    assistanting = props.assistanting,
+    hideTool = props.hideTool,
+    onLikeChange = props.onLikeChange,
+    className = props.className,
+    noAnswerTip = props.noAnswerTip;
+  var cleanedThink = item !== null && item !== void 0 && item.think ? cleanRedactedReasoning(item.think) : "";
+  var cleanedAnswer = item !== null && item !== void 0 && item.answer ? cleanRedactedReasoning(item.answer) : "";
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    expanded = _useState2[0],
+    setExpanded = _useState2[1];
+  var prevThinkingRef = useRef(false);
+
+  // 判断是否正在思考中
+  var isThinking = !(item !== null && item !== void 0 && (_item$think = item.think) !== null && _item$think !== void 0 && _item$think.endsWith("</think>")) && !!assistanting;
+
+  // 判断是否有思考内容（排除空标签和标签本身）
+  var hasThink = cleanedThink && cleanedThink.trim().length > 0;
+
+  // 当开始思考时，自动展开；思考结束时，自动收起
+  useEffect(function () {
+    if (isThinking && !prevThinkingRef.current) {
+      // 从非思考状态变为思考状态：展开
+      setExpanded(true);
+    } else if (!isThinking && prevThinkingRef.current) {
+      // 从思考状态变为非思考状态：收起
+      setExpanded(false);
+    }
+    prevThinkingRef.current = isThinking;
+  }, [isThinking]);
+  return /*#__PURE__*/_jsx(_Fragment, {
+    children: /*#__PURE__*/_jsxs("div", {
+      className: classNames(styles.AssistantItem, className),
+      children: [!!cleanedThink && /*#__PURE__*/_jsx(Think, {
+        title: isThinking ? "思考中..." : "已深度思考",
+        loading: !(item !== null && item !== void 0 && (_item$think2 = item.think) !== null && _item$think2 !== void 0 && _item$think2.endsWith("</think>")),
+        classNames: {
+          content: styles.thinkContent
+        },
+        expanded: expanded,
+        onExpand: function onExpand(v) {
+          return setExpanded(v);
+        },
+        children: /*#__PURE__*/_jsx(Markdown.Views, {
+          className: styles.thinkContentMarkdown,
+          children: cleanedThink
+        })
+      }), !item.error && /*#__PURE__*/_jsx(Bubble, {
+        loading: !cleanedThink && !cleanedAnswer && assistanting,
+        classNames: {
+          root: styles.answerBubble,
+          content: styles.answerContent
+        },
+        content: cleanedAnswer,
+        streaming: !!cleanedAnswer && assistanting,
+        contentRender: function contentRender(content) {
+          return /*#__PURE__*/_jsx("div", {
+            id: "".concat(item.messageId, "-answer"),
+            children: /*#__PURE__*/_jsx(Markdown.Views, {
+              children: content
+            })
+          });
+        }
+      }), item.error && /*#__PURE__*/_jsx("div", {
+        className: styles.error,
+        children: item.error
+      }), !hasThink && !cleanedAnswer && !assistanting && !item.error && !!noAnswerTip && /*#__PURE__*/_jsx("div", {
+        id: "".concat(item.messageId, "-answer"),
+        className: styles.noAnswerTip,
+        children: /*#__PURE__*/_jsx(Markdown.Views, {
+          children: noAnswerTip
+        })
+      }), /*#__PURE__*/_jsx(QuoteList, {
+        retrieverResources: item === null || item === void 0 ? void 0 : item.retrieverResources
+      }), !assistanting && !hideTool && /*#__PURE__*/_jsx("div", {
+        className: styles.assistantTool,
+        children: cleanedAnswer && /*#__PURE__*/_jsxs(_Fragment, {
+          children: [/*#__PURE__*/_jsx(Copy, {
+            content: cleanedAnswer
+          }), /*#__PURE__*/_jsx(LikeDislike, {
+            messageId: item.messageId,
+            initialLike: item.like,
+            onLikeChange: onLikeChange
+          })]
+        })
+      })]
+    })
+  });
+};
+export default AssistantItem;

package/es/components/Chat/ChatList/_components/Assistant/AssistantItem/index.module.less

@@ -0,0 +1,64 @@
+.AssistantItem {
+  display: flex;
+  flex-direction: column;
+  row-gap: 10px;
+
+  width: max-content;
+  max-width: 100%;
+  height: max-content;
+  font-size: 16px;
+
+  .thinkContent {
+    font-size: 14px;
+
+    .thinkContentMarkdown {
+      > p:first-of-type,
+      > p:last-of-type {
+        margin: 0px;
+      }
+    }
+  }
+
+  .answerBubble {
+    .ant-bubble-dot {
+      column-gap: var(--ant-margin-xxs);
+    }
+
+    .answerContent {
+      min-height: 0px;
+      padding: 0px;
+
+      background-color: transparent;
+    }
+  }
+
+  .assistantTool {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    column-gap: 5px;
+
+    > * {
+      white-space: nowrap;
+    }
+  }
+
+  .error {
+    font-size: 14px;
+    color: #f5222d;
+
+    border-radius: 4px;
+    border: 1px solid #f5222d;
+    padding: 4px 15px;
+  }
+
+  .noAnswerTip {
+    font-size: 14px;
+    color: #8c8c8c;
+
+    border-radius: 4px;
+    border: 1px solid #d9d9d9;
+    padding: 4px 15px;
+    background-color: #fafafa;
+  }
+}

package/es/components/Chat/ChatList/_components/Assistant/index.d.ts

@@ -0,0 +1,18 @@
+import React, { ReactNode } from "react";
+import { AnswerMessage } from "../..";
+interface AssistantProps {
+    item: AnswerMessage[];
+    assistanting?: boolean;
+    onAgain?: () => void;
+    hideTool?: boolean;
+    onLikeChange?: (messageId: string, like: boolean | null, content: string) => void;
+    isLast?: boolean;
+    className?: string;
+    itemClassName?: string;
+    assistantName?: string;
+    assistantAvatar?: ReactNode;
+    headerClassName?: string;
+    noAnswerTip?: string;
+}
+declare const Assistant: React.FC<AssistantProps>;
+export default Assistant;