@lobehub/ui 1.58.0 → 1.60.0

package/es/ChatItem/index.d.ts

@@ -3,14 +3,11 @@ import { ReactNode } from 'react';
 import { type EditableMessageProps } from "../EditableMessage";
 import { MetaData } from "../types/meta";
 export interface ChatItemProps {
+    ErrorMessage?: ReactNode;
     /**
      * @description Actions to be displayed in the chat item
      */
     actions?: ReactNode;
-    /**
-     * @description Props for Alert component
-     */
-    alert?: AlertProps;
     /**
      * @description Metadata for the avatar
      */
@@ -27,6 +24,10 @@ export interface ChatItemProps {
      * @description Whether the chat item is in editing mode
      */
     editing?: boolean;
+    /**
+     * @description Props for Error render
+     */
+    error?: AlertProps;
     /**
      * @description Whether the chat item is in loading state
      */

package/es/ChatItem/index.js

@@ -1,6 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["actions", "className", "primary", "borderSpacing", "loading", "message", "placement", "type", "avatar", "alert", "showTitle", "time", "editing", "onChange", "onEditingChange", "messageExtra", "renderMessage", "text"];
+var _excluded = ["actions", "className", "primary", "borderSpacing", "loading", "message", "placement", "type", "avatar", "error", "showTitle", "time", "editing", "onChange", "onEditingChange", "messageExtra", "renderMessage", "text", "ErrorMessage"];
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import { Alert } from 'antd';
@@ -27,7 +27,7 @@ var ChatItem = /*#__PURE__*/memo(function (_ref) {
     _ref$type = _ref.type,
     type = _ref$type === void 0 ? 'block' : _ref$type,
     avatar = _ref.avatar,
-    alert = _ref.alert,
+    error = _ref.error,
     showTitle = _ref.showTitle,
     time = _ref.time,
     editing = _ref.editing,
@@ -36,6 +36,7 @@ var ChatItem = /*#__PURE__*/memo(function (_ref) {
     messageExtra = _ref.messageExtra,
     renderMessage = _ref.renderMessage,
     text = _ref.text,
+    ErrorMessage = _ref.ErrorMessage,
     properties = _objectWithoutProperties(_ref, _excluded);
   var _useStyles = useStyles({
       avatarSize: AVATAR_SIZE,
@@ -90,10 +91,14 @@ var ChatItem = /*#__PURE__*/memo(function (_ref) {
         })]
       }), /*#__PURE__*/_jsxs("div", {
         className: styles.messageContent,
-        children: [alert ? /*#__PURE__*/_jsx(Alert, _objectSpread({
-          className: styles.alert,
-          showIcon: true
-        }, alert)) : /*#__PURE__*/_jsxs(Flexbox, {
+        children: [error ? /*#__PURE__*/_jsxs(Flexbox, {
+          gap: 8,
+          children: [/*#__PURE__*/_jsx(Alert, _objectSpread({
+            className: styles.alert,
+            showIcon: true,
+            type: 'error'
+          }, error)), ErrorMessage]
+        }) : /*#__PURE__*/_jsxs(Flexbox, {
           className: cx(styles.message, editing && styles.editingContainer),
           children: [messageContent, messageExtra && !editing ? /*#__PURE__*/_jsx("div", {
             className: styles.messageExtra,

package/es/ChatList/Item.d.ts

@@ -0,0 +1,50 @@
+import { ReactNode } from 'react';
+import { type ChatItemProps } from "../ChatItem";
+import { ChatMessage, ChatMessageError } from "../types/chatMessage";
+import { type ActionsBarProps } from './ActionsBar';
+export type OnMessageChange = (id: string, content: string) => void;
+export type MessageExtra = (props: ChatMessage) => ReactNode;
+export type OnActionClick = (actionKey: string, messageId: string) => void;
+export type RenderMessage = (content: ReactNode, message: ChatMessage) => ReactNode;
+export type RenderErrorMessage = (error: ChatMessageError, message: ChatMessage) => ReactNode;
+export interface ListItemProps {
+    loading?: boolean;
+    /**
+     * @description 点击操作按钮的回调函数
+     */
+    onActionClick?: OnActionClick;
+    /**
+     * @description 消息变化的回调函数
+     */
+    onMessageChange?: OnMessageChange;
+    /**
+     * @description 渲染错误消息的函数
+     */
+    renderErrorMessage?: RenderErrorMessage;
+    /**
+     * @description 渲染消息的函数
+     */
+    renderMessage?: RenderMessage;
+    /**
+     * @description 渲染消息额外内容的函数
+     */
+    renderMessageExtra?: MessageExtra;
+    /**
+     * @description 是否显示聊天项的名称
+     * @default false
+     */
+    showTitle?: boolean;
+    /**
+     * @description 文本内容
+     */
+    text?: ChatItemProps['text'] & ActionsBarProps['text'] & {
+        copySuccess?: string;
+    };
+    /**
+     * @description 聊天列表的类型
+     * @default 'chat'
+     */
+    type?: 'docs' | 'chat';
+}
+declare const Item: import("react").NamedExoticComponent<ChatMessage & ListItemProps>;
+export default Item;

package/es/ChatList/Item.js

@@ -0,0 +1,78 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["renderMessageExtra", "showTitle", "onActionClick", "onMessageChange", "type", "text", "renderMessage", "renderErrorMessage", "loading"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import { App } from 'antd';
+import copy from 'copy-to-clipboard';
+import { memo, useCallback, useState } from 'react';
+import ChatItem from "../ChatItem";
+import ActionsBar from "./ActionsBar";
+import { jsx as _jsx } from "react/jsx-runtime";
+var Item = /*#__PURE__*/memo(function (_ref) {
+  var _item$error;
+  var MessageExtra = _ref.renderMessageExtra,
+    showTitle = _ref.showTitle,
+    _onActionClick = _ref.onActionClick,
+    onMessageChange = _ref.onMessageChange,
+    type = _ref.type,
+    text = _ref.text,
+    renderMessage = _ref.renderMessage,
+    renderErrorMessage = _ref.renderErrorMessage,
+    loading = _ref.loading,
+    item = _objectWithoutProperties(_ref, _excluded);
+  var renderMessageExtra = MessageExtra ? /*#__PURE__*/_jsx(MessageExtra, _objectSpread({}, item)) : undefined;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    editing = _useState2[0],
+    setEditing = _useState2[1];
+  var _App$useApp = App.useApp(),
+    message = _App$useApp.message;
+  var innerRenderMessage = useCallback(function (content) {
+    return renderMessage === null || renderMessage === void 0 ? void 0 : renderMessage(content, item);
+  }, [renderMessage]);
+  return /*#__PURE__*/_jsx(ChatItem, {
+    ErrorMessage: item.error ? renderErrorMessage === null || renderErrorMessage === void 0 ? void 0 : renderErrorMessage(item.error, item) : undefined,
+    actions: /*#__PURE__*/_jsx(ActionsBar, {
+      onActionClick: function onActionClick(actionKey) {
+        switch (actionKey) {
+          case 'copy':
+            {
+              copy(item.content);
+              message.success((text === null || text === void 0 ? void 0 : text.copySuccess) || 'Copy Success');
+              break;
+            }
+          case 'edit':
+            {
+              setEditing(true);
+              break;
+            }
+        }
+        _onActionClick === null || _onActionClick === void 0 ? void 0 : _onActionClick(actionKey, item.id);
+      },
+      primary: item.role === 'user',
+      text: text
+    }),
+    avatar: item.meta,
+    editing: editing,
+    error: item.error ? {
+      message: (_item$error = item.error) === null || _item$error === void 0 ? void 0 : _item$error.message
+    } : undefined,
+    loading: loading,
+    message: item.content,
+    messageExtra: renderMessageExtra,
+    onChange: function onChange(value) {
+      onMessageChange === null || onMessageChange === void 0 ? void 0 : onMessageChange(item.id, value);
+    },
+    onEditingChange: setEditing,
+    placement: type === 'chat' ? item.role === 'user' ? 'right' : 'left' : 'left',
+    primary: item.role === 'user',
+    renderMessage: renderMessage ? innerRenderMessage : undefined,
+    showTitle: showTitle,
+    text: text,
+    time: item.updateAt || item.createAt,
+    type: type === 'chat' ? 'block' : 'pure'
+  });
+});
+export default Item;

package/es/ChatList/index.d.ts

@@ -1,46 +1,13 @@
-import { ReactNode } from 'react';
-import { type ChatItemProps } from "../ChatItem";
-import type { DivProps } from "../types";
-import { ChatMessage } from "../types/chatMessage";
-import { type ActionsBarProps } from './ActionsBar';
-export type MessageExtra = (props: ChatMessage) => ReactNode;
-export type RenderMessage = (content: ReactNode, message: ChatMessage) => ReactNode;
-export interface ItemProps extends ChatMessage {
-    MessageExtra?: MessageExtra;
-    onActionClick?: (actionKey: string, messageId: string) => void;
-    onMessageChange?: (id: string, content: string) => void;
-    renderMessage?: RenderMessage;
-    showTitle?: boolean;
-    text?: ChatItemProps['text'] & ActionsBarProps['text'] & {
-        copySuccess?: string;
-    };
-    type: 'docs' | 'chat';
-}
-export interface ChatListProps extends DivProps {
+/// <reference types="react" />
+import type { ChatMessage, DivProps } from "../types";
+import { ListItemProps } from './Item';
+export interface ChatListProps extends DivProps, ListItemProps {
     /**
      * @description Data of chat messages to be displayed
      */
     data: ChatMessage[];
-    /**
-     * @description Callback function triggered when an action is clicked
-     * @param {string} actionKey - The key of the action
-     * @param {string} messageId - The id of the message
-     */
-    onActionClick?: (actionKey: string, messageId: string) => void;
-    onMessageChange?: (id: string, content: string) => void;
-    renderMessage?: RenderMessage;
-    renderMessageExtra?: MessageExtra;
-    /**
-     * @description Whether to show name of the chat item
-     * @default false
-     */
-    showTitle?: ChatItemProps['showTitle'];
-    text?: ItemProps['text'];
-    /**
-     * @description Type of chat list
-     * @default 'chat'
-     */
-    type?: 'docs' | 'chat';
+    loadingId?: string;
 }
+export type { OnActionClick, OnMessageChange, RenderErrorMessage, RenderMessage } from './Item';
 declare const ChatList: import("react").NamedExoticComponent<ChatListProps>;
 export default ChatList;

package/es/ChatList/index.js

@@ -1,86 +1,26 @@
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["MessageExtra", "showTitle", "onActionClick", "onMessageChange", "type", "text", "renderMessage"],
-  _excluded2 = ["onActionClick", "renderMessageExtra", "className", "data", "type", "text", "showTitle", "onMessageChange", "renderMessage"];
+var _excluded = ["onActionClick", "renderMessageExtra", "className", "data", "type", "text", "showTitle", "onMessageChange", "renderMessage", "renderErrorMessage", "loadingId"];
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-import { App } from 'antd';
-import copy from 'copy-to-clipboard';
-import { memo, useCallback, useState } from 'react';
-import ChatItem from "../ChatItem";
-import ActionsBar from "./ActionsBar";
+import { memo } from 'react';
+import Item from "./Item";
 import { useStyles } from "./style";
 import { jsx as _jsx } from "react/jsx-runtime";
-var Item = function Item(_ref) {
-  var MessageExtra = _ref.MessageExtra,
+var ChatList = /*#__PURE__*/memo(function (_ref) {
+  var onActionClick = _ref.onActionClick,
+    MessageExtra = _ref.renderMessageExtra,
+    className = _ref.className,
+    data = _ref.data,
+    _ref$type = _ref.type,
+    type = _ref$type === void 0 ? 'chat' : _ref$type,
+    text = _ref.text,
     showTitle = _ref.showTitle,
-    _onActionClick = _ref.onActionClick,
     onMessageChange = _ref.onMessageChange,
-    type = _ref.type,
-    text = _ref.text,
     renderMessage = _ref.renderMessage,
-    item = _objectWithoutProperties(_ref, _excluded);
-  var renderMessageExtra = MessageExtra ? /*#__PURE__*/_jsx(MessageExtra, _objectSpread({}, item)) : undefined;
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    editing = _useState2[0],
-    setEditing = _useState2[1];
-  var _App$useApp = App.useApp(),
-    message = _App$useApp.message;
-  var innerRenderMessage = useCallback(function (content) {
-    return renderMessage === null || renderMessage === void 0 ? void 0 : renderMessage(content, item);
-  }, [renderMessage]);
-  return /*#__PURE__*/_jsx(ChatItem, {
-    actions: /*#__PURE__*/_jsx(ActionsBar, {
-      onActionClick: function onActionClick(actionKey) {
-        switch (actionKey) {
-          case 'copy':
-            {
-              copy(item.content);
-              message.success((text === null || text === void 0 ? void 0 : text.copySuccess) || 'Copy Success');
-              break;
-            }
-          case 'edit':
-            {
-              setEditing(true);
-              break;
-            }
-        }
-        _onActionClick === null || _onActionClick === void 0 ? void 0 : _onActionClick(actionKey, item.id);
-      },
-      primary: item.role === 'user',
-      text: text
-    }),
-    avatar: item.meta,
-    editing: editing,
-    message: item.content,
-    messageExtra: renderMessageExtra,
-    onChange: function onChange(value) {
-      onMessageChange === null || onMessageChange === void 0 ? void 0 : onMessageChange(item.id, value);
-    },
-    onEditingChange: setEditing,
-    placement: type === 'chat' ? item.role === 'user' ? 'right' : 'left' : 'left',
-    primary: item.role === 'user',
-    renderMessage: renderMessage ? innerRenderMessage : undefined,
-    showTitle: showTitle,
-    text: text,
-    time: item.updateAt || item.createAt,
-    type: type === 'chat' ? 'block' : 'pure'
-  });
-};
-var ChatList = /*#__PURE__*/memo(function (_ref2) {
-  var onActionClick = _ref2.onActionClick,
-    MessageExtra = _ref2.renderMessageExtra,
-    className = _ref2.className,
-    data = _ref2.data,
-    _ref2$type = _ref2.type,
-    type = _ref2$type === void 0 ? 'chat' : _ref2$type,
-    text = _ref2.text,
-    showTitle = _ref2.showTitle,
-    onMessageChange = _ref2.onMessageChange,
-    renderMessage = _ref2.renderMessage,
-    props = _objectWithoutProperties(_ref2, _excluded2);
+    renderErrorMessage = _ref.renderErrorMessage,
+    loadingId = _ref.loadingId,
+    props = _objectWithoutProperties(_ref, _excluded);
   var _useStyles = useStyles(),
     cx = _useStyles.cx,
     styles = _useStyles.styles;
@@ -89,10 +29,12 @@ var ChatList = /*#__PURE__*/memo(function (_ref2) {
   }, props), {}, {
     children: data.map(function (item) {
       return /*#__PURE__*/_jsx(Item, _objectSpread({
-        MessageExtra: MessageExtra,
+        loading: loadingId === item.id,
         onActionClick: onActionClick,
         onMessageChange: onMessageChange,
+        renderErrorMessage: renderErrorMessage,
         renderMessage: renderMessage,
+        renderMessageExtra: MessageExtra,
         showTitle: showTitle,
         text: text,
         type: type

package/es/EditableMessageList/index.d.ts

@@ -1,10 +1,10 @@
 /// <reference types="react" />
-import { ChatMessage } from "../Chat";
+import { LLMMessage } from "../types/llm";
 export interface EditableMessageListProps {
     /**
      * @description The data sources to be rendered
      */
-    dataSources: ChatMessage[];
+    dataSources: LLMMessage[];
     /**
      * @description Whether the component is disabled or not
      * @default false
@@ -14,7 +14,7 @@ export interface EditableMessageListProps {
      * @description Callback function triggered when the data sources are changed
      * @param chatMessages - the updated data sources
      */
-    onChange?: (chatMessages: ChatMessage[]) => void;
+    onChange?: (chatMessages: LLMMessage[]) => void;
 }
 export declare const EditableMessageList: import("react").NamedExoticComponent<EditableMessageListProps>;
 export default EditableMessageList;

package/es/EditableMessageList/index.js

@@ -5,9 +5,9 @@ import { Plus, Trash } from 'lucide-react';
 import { memo, useEffect, useReducer } from 'react';
 import { Flexbox } from 'react-layout-kit';
 import ActionIcon from "../ActionIcon";
-import { messagesReducer } from "../Chat";
 import Icon from "../Icon";
 import { ControlInput } from "../components/ControlInput";
+import { messagesReducer } from "./messageReducer";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var EditableMessageList = /*#__PURE__*/memo(function (_ref) {

package/es/{Chat/store → EditableMessageList}/messageReducer.d.ts

@@ -1,10 +1,11 @@
-import { ChatMessage, ChatMessageError, MessageRoleType } from '../types';
+import { ChatMessageError, MessageRoleType } from "../types";
+import { LLMMessage } from "../types/llm";
 export type MessageDispatch = {
-    message: ChatMessage;
+    message: LLMMessage;
     type: 'addMessage';
 } | {
     index: number;
-    message: ChatMessage;
+    message: LLMMessage;
     type: 'insertMessage';
 } | {
     index: number;
@@ -34,4 +35,4 @@ export type MessageDispatch = {
     index: number;
     type: 'setErrorMessage';
 };
-export declare const messagesReducer: (state: ChatMessage[], payload: MessageDispatch) => ChatMessage[];
+export declare const messagesReducer: (state: LLMMessage[], payload: MessageDispatch) => LLMMessage[];

package/es/{Chat/store → EditableMessageList}/messageReducer.js

@@ -66,21 +66,6 @@ export var messagesReducer = function messagesReducer(state, payload) {
           draftState[index].error = error;
         });
       }
-    case 'updateMessageChoice':
-      {
-        return produce(state, function (draftState) {
-          var index = payload.index,
-            message = payload.message;
-          var botMessage = draftState[index];
-          var previousMessage = botMessage.content;
-          botMessage.content = message;
-          if (botMessage.choices) {
-            botMessage.choices.push(previousMessage);
-          } else {
-            botMessage.choices = [previousMessage];
-          }
-        });
-      }
     default:
       {
         throw new Error('暂未实现的 type，请检查 reducer');

package/es/Icon/index.js

@@ -68,7 +68,7 @@ var Icon = /*#__PURE__*/memo(function (_ref) {
   }, props), {}, {
     children: /*#__PURE__*/_jsx(SvgIcon, {
       color: color,
-      fill: fill,
+      fill: fill !== null && fill !== void 0 ? fill : 'transparent',
       focusable: false,
       height: fontSize,
       size: fontSize,

package/es/List/ListItem/index.js

@@ -33,14 +33,8 @@ var ListItem = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (_ref, refere
   var _useStyles = useStyles(),
     styles = _useStyles.styles,
     cx = _useStyles.cx;
-  return /*#__PURE__*/_jsxs(Flexbox, _objectSpread(_objectSpread({
-    align: 'flex-start',
+  return /*#__PURE__*/_jsx(Flexbox, _objectSpread(_objectSpread({
     className: cx(styles.container, active && styles.active, className),
-    distribution: 'space-between',
-    gap: 8,
-    horizontal: true,
-    paddingBlock: 12,
-    paddingInline: 16,
     ref: reference,
     style: style
   }, props), {}, {
@@ -50,41 +44,48 @@ var ListItem = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (_ref, refere
     onMouseLeave: function onMouseLeave() {
       onHoverChange === null || onHoverChange === void 0 ? void 0 : onHoverChange(false);
     },
-    children: [avatar !== null && avatar !== void 0 ? avatar : /*#__PURE__*/_jsx(MessageOutlined, {
-      style: {
-        marginTop: 4
-      }
-    }), /*#__PURE__*/_jsxs(Flexbox, {
-      className: styles.content,
-      children: [/*#__PURE__*/_jsx(Flexbox, {
-        distribution: 'space-between',
-        horizontal: true,
-        children: /*#__PURE__*/_jsx("div", {
-          className: styles.title,
-          children: title
-        })
-      }), description && /*#__PURE__*/_jsx("div", {
-        className: styles.desc,
-        children: description
-      }), /*#__PURE__*/_jsx("div", {
-        className: styles.textOverlay
-      })]
-    }), loading ? /*#__PURE__*/_jsx(LoadingOutlined, {
-      spin: true
-    }) : showAction ? /*#__PURE__*/_jsx(Flexbox, {
-      gap: 4,
+    children: /*#__PURE__*/_jsxs(Flexbox, {
+      align: 'flex-start',
+      className: styles.inner,
+      distribution: 'space-between',
+      gap: 8,
       horizontal: true,
-      onClick: function onClick(e) {
-        e.stopPropagation();
-      },
-      style: {
-        display: showAction ? undefined : 'none'
-      },
-      children: renderActions
-    }) : date && /*#__PURE__*/_jsx("div", {
-      className: cx(styles.time, classNames.time),
-      children: getChatItemTime(date)
-    }), children]
+      paddingBlock: 12,
+      paddingInline: 16,
+      children: [avatar !== null && avatar !== void 0 ? avatar : /*#__PURE__*/_jsx(MessageOutlined, {
+        style: {
+          marginTop: 4
+        }
+      }), /*#__PURE__*/_jsxs(Flexbox, {
+        className: styles.content,
+        children: [/*#__PURE__*/_jsx(Flexbox, {
+          distribution: 'space-between',
+          horizontal: true,
+          children: /*#__PURE__*/_jsx("div", {
+            className: styles.title,
+            children: title
+          })
+        }), description && /*#__PURE__*/_jsx("div", {
+          className: styles.desc,
+          children: description
+        })]
+      }), loading ? /*#__PURE__*/_jsx(LoadingOutlined, {
+        spin: true
+      }) : showAction ? /*#__PURE__*/_jsx(Flexbox, {
+        gap: 4,
+        horizontal: true,
+        onClick: function onClick(e) {
+          e.stopPropagation();
+        },
+        style: {
+          display: showAction ? undefined : 'none'
+        },
+        children: renderActions
+      }) : date && /*#__PURE__*/_jsx("div", {
+        className: cx(styles.time, classNames.time),
+        children: getChatItemTime(date)
+      }), children]
+    })
   }));
 }));
 export default ListItem;

package/es/List/ListItem/style.d.ts

@@ -3,7 +3,7 @@ export declare const useStyles: (props?: unknown) => import("antd-style").Return
     container: import("antd-style").SerializedStyles;
     content: import("antd-style").SerializedStyles;
     desc: import("antd-style").SerializedStyles;
-    textOverlay: import("antd-style").SerializedStyles;
+    inner: import("antd-style").SerializedStyles;
     time: import("antd-style").SerializedStyles;
     title: import("antd-style").SerializedStyles;
 }>;

package/es/List/ListItem/style.js

@@ -1,21 +1,16 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
 import { createStyles } from 'antd-style';
-import { convertAlphaToSolid } from "../../utils/colorUtils";
 export var useStyles = createStyles(function (_ref) {
   var css = _ref.css,
-    cx = _ref.cx,
     token = _ref.token;
-  var textOverlay = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    --overlay-background: ", ";\n\n    position: absolute;\n    z-index: 10;\n    top: 0;\n    right: 0;\n\n    width: 32px;\n    height: 44px;\n\n    background: linear-gradient(to right, transparent, var(--overlay-background));\n  "])), token.colorBgContainer);
-  var overlayColor = convertAlphaToSolid(token.colorFillContent, token.colorBgContainer);
-  var hoverOverlay = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    .", " {\n      --overlay-background: ", ";\n    }\n  "])), cx(textOverlay), overlayColor);
   return {
-    active: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n      color: ", ";\n      background: ", ";\n\n      ", "\n    "])), token.colorText, token.colorFillContent, hoverOverlay),
-    container: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n      cursor: pointer;\n      color: ", ";\n\n      &:hover {\n        background: ", ";\n        ", "\n      }\n    "])), token.colorTextTertiary, token.colorFillContent, hoverOverlay),
-    content: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n      position: relative;\n      overflow: hidden;\n      flex: 1;\n    "]))),
-    desc: css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n      overflow: hidden;\n\n      width: 100%;\n      margin-top: 2px;\n\n      font-size: 12px;\n      color: ", ";\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    "])), token.colorTextDescription),
-    textOverlay: textOverlay,
-    time: css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n      font-size: 12px;\n      color: ", ";\n    "])), token.colorTextPlaceholder),
-    title: css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n      overflow: hidden;\n\n      width: 100%;\n\n      font-size: 16px;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    "])))
+    active: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      color: ", ";\n      background-color: ", ";\n\n      &:hover {\n        background-color: ", ";\n      }\n    "])), token.colorText, token.colorFillTertiary, token.colorFill),
+    container: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      cursor: pointer;\n      color: ", ";\n      transition: background-color 200ms ", ";\n\n      &:active {\n        background-color: ", " !important;\n      }\n\n      &:hover {\n        background-color: ", ";\n      }\n    "])), token.colorTextTertiary, token.motionEaseOut, token.colorFill, token.colorFillSecondary),
+    content: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n      position: relative;\n      overflow: hidden;\n      flex: 1;\n    "]))),
+    desc: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n      overflow: hidden;\n\n      width: 100%;\n      margin-top: 2px;\n\n      font-size: 12px;\n      color: ", ";\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    "])), token.colorTextDescription),
+    inner: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n      transition: scale 400ms ", ";\n\n      &:active {\n        scale: 0.95;\n      }\n    "])), token.motionEaseOut),
+    time: css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n      font-size: 12px;\n      color: ", ";\n    "])), token.colorTextPlaceholder),
+    title: css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n      overflow: hidden;\n\n      width: 100%;\n\n      font-size: 16px;\n      color: ", ";\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    "])), token.colorText)
   };
 });

package/es/index.d.ts

@@ -2,11 +2,11 @@ export { default as ActionIcon, type ActionIconProps, type ActionIconSize } from
 export { default as ActionIconGroup, type ActionIconGroupProps } from './ActionIconGroup';
 export { default as Avatar, type AvatarProps } from './Avatar';
 export { default as Burger, type BurgerProps } from './Burger';
-export type { ChatMessage, MessageRoleType } from './Chat';
 export { default as ChatHeader, type ChatHeaderProps } from './ChatHeader';
 export { default as ChatInputArea, type ChatInputAreaProps } from './ChatInputArea';
 export { default as ChatItem, type ChatItemProps } from './ChatItem';
-export { default as ChatList, type ChatListProps } from './ChatList';
+export type { ChatListProps, OnActionClick, OnMessageChange, RenderErrorMessage, RenderMessage, } from './ChatList';
+export { default as ChatList } from './ChatList';
 export { default as CodeEditor, type CodeEditorProps } from './CodeEditor';
 export { default as ColorScales, type ColorScalesProps } from './ColorScales';
 export { default as ContextMenu, type ContextMenuProps } from './ContextMenu';

package/es/types/chatMessage.d.ts

@@ -1,5 +1,5 @@
-import { LLMRoleType } from './llm';
 import { BaseDataModel } from './meta';
+export type MessageRoleType = 'user' | 'system' | 'assistant' | 'function';
 /**
  * 聊天消息错误对象
  */
@@ -8,8 +8,7 @@ export interface ChatMessageError {
      * 错误信息
      */
     message: string;
-    status: number;
-    type: 'general' | 'llm';
+    type?: string;
 }
 export interface ChatMessage extends BaseDataModel {
     /**
@@ -17,6 +16,7 @@ export interface ChatMessage extends BaseDataModel {
      * @description 消息内容
      */
     content: string;
+    error?: ChatMessageError;
     extra?: {
         translate?: {
             target: string;
@@ -29,5 +29,5 @@ export interface ChatMessage extends BaseDataModel {
      * 角色
      * @description 消息发送者的角色
      */
-    role: LLMRoleType;
+    role: MessageRoleType;
 }