@agentscope-ai/chat 1.1.4 → 1.1.7

package/{dist/provider → lib/Provider}/GlobalProvider.js

@@ -1,9 +1,11 @@
 import React, { createContext } from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
 export var GlobalContext = /*#__PURE__*/createContext(undefined);
 export var GlobalProvider = function GlobalProvider(props) {
-  return /*#__PURE__*/React.createElement(GlobalContext.Provider, {
-    value: props
-  }, props.children);
+  return /*#__PURE__*/_jsx(GlobalContext.Provider, {
+    value: props,
+    children: props.children
+  });
 };
 export var useGlobalContext = function useGlobalContext() {
   var context = React.useContext(GlobalContext);

package/{dist/provider → lib/Provider}/index.d.ts

@@ -1,8 +1,7 @@
-import React from "react";
 import { CustomCardsProvider, CustomCardsContext, useCustomCardsContext } from './CustomCardsProvider';
 import { GlobalProvider, GlobalContext, useGlobalContext } from './GlobalProvider';
 import type { ProviderProps } from './types';
-declare const SparkChatProvider: (props: ProviderProps) => React.JSX.Element;
+declare const SparkChatProvider: (props: ProviderProps) => import("react/jsx-runtime").JSX.Element;
 export declare function useProviderContext(): import("antd/es/config-provider").ConfigConsumerProps;
 export default SparkChatProvider;
 export { useCustomCardsContext, CustomCardsProvider, useGlobalContext, CustomCardsContext, GlobalProvider, GlobalContext, ProviderProps };

package/{dist/provider → lib/Provider}/index.js

@@ -1,16 +1,19 @@
-import { ConfigProvider } from "antd";
+import { ConfigProvider } from "@ali/agentscope-ai-design";
 import React from "react";
 import { CustomCardsProvider, CustomCardsContext, useCustomCardsContext } from "./CustomCardsProvider";
 import { GlobalProvider, GlobalContext, useGlobalContext } from "./GlobalProvider";
+import { jsx as _jsx } from "react/jsx-runtime";
 var SparkChatProvider = function SparkChatProvider(props) {
   var children = props.children,
     cardConfig = props.cardConfig,
     markdown = props.markdown;
-  return /*#__PURE__*/React.createElement(GlobalProvider, {
-    markdown: markdown
-  }, /*#__PURE__*/React.createElement(CustomCardsProvider, {
-    cardConfig: cardConfig
-  }, children));
+  return /*#__PURE__*/_jsx(GlobalProvider, {
+    markdown: markdown,
+    children: /*#__PURE__*/_jsx(CustomCardsProvider, {
+      cardConfig: cardConfig,
+      children: children
+    })
+  });
 };
 export function useProviderContext() {
   var context = React.useContext(ConfigProvider.ConfigContext);

package/lib/Provider/types.d.ts

@@ -0,0 +1,24 @@
+/// <reference types="react" />
+export interface ProviderProps {
+    /**
+     * @description 提供者组件的子元素，用于包装应用内容
+     * @descriptionEn Child elements of the provider component for wrapping application content
+     */
+    children: React.ReactNode;
+    /**
+     * @description 卡片配置对象，用于自定义不同类型卡片的渲染
+     * @descriptionEn Card configuration object for customizing rendering of different card types
+     */
+    cardConfig: Record<string, any>;
+    /**
+     * @description Markdown渲染配置，用于控制文本显示效果
+     * @descriptionEn Markdown rendering configuration for controlling text display effects
+     */
+    markdown?: {
+        /**
+         * @description 基础字体大小，影响所有Markdown内容的字体大小
+         * @descriptionEn Base font size that affects font size of all Markdown content
+         */
+        baseFontSize?: number;
+    };
+}

package/lib/Provider/types.js

@@ -0,0 +1 @@
+export {};

package/lib/Sender/ModeSelect/index.d.ts

@@ -0,0 +1,17 @@
+import React from "react";
+interface IItem {
+    icon: string | React.ReactNode;
+    label: string | React.ReactNode;
+    tooltip?: string | React.ReactNode;
+    value: string;
+}
+interface IProps {
+    options: IItem[];
+    value: string;
+    desc?: React.ReactNode | string;
+    onChange: (value: string) => void;
+    style?: React.CSSProperties;
+    closeTip?: React.ReactNode | string;
+}
+export default function (props: IProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/Sender/ModeSelect/index.js

@@ -0,0 +1,109 @@
+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); }
+var _templateObject;
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+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 _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+import React, { useMemo } from "react";
+import { createGlobalStyle, useProviderContext } from "../..";
+import { SparkFalseLine } from "@agentscope-ai/icons";
+import { Tooltip } from "@ali/agentscope-ai-design";
+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 useStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-sender-mode-select {\n  position: relative;\n  height: 40px;\n\n  &-options {\n    position: absolute;\n    top: 4px;\n    left: 0;\n    right: 0;\n    display: flex;\n    gap: 8px;\n    transition: all 0.3s;\n  }\n\n  &-option {\n    height: 28px;\n    display: flex;\n    align-items: center;\n    fonts: 14px;\n    padding: 0 8px;\n    border-radius: ", "px;\n    gap: 4px;\n    border: 1px solid ", ";\n    cursor: pointer;\n    color: ", ";\n    transition: all 0.3s;\n\n    &:hover {\n      border-color: ", ";\n      color: ", ";\n    }\n  }\n\n  &-display {\n    position: absolute;\n    top: 8px;\n    left: 0;\n    right: 0;\n    height: 40px;\n    border: 1px solid ", ";\n    border-radius: ", "px ", "px 0 0;\n    background: ", ";\n    transition: all 0.3s;\n\n    &-flex {\n      display: flex;\n      justify-content: space-between; \n      align-items: center;\n      height: 32px;\n      padding: 0 12px;\n    }\n\n    &-label {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n      fontsize: 14px;\n      color: ", ";\n    }\n\n    &-desc {\n      display: flex;\n      align-items: center;\n      margin: 0 12px 0 auto;\n    }\n  }\n\n  &-hide {\n    top: 45px;\n  }\n}\n\n"])), function (p) {
+  return p.prefix;
+}, function (p) {
+  return p.theme.borderRadius;
+}, function (p) {
+  return p.theme.colorBorderSecondary;
+}, function (p) {
+  return p.theme.colorTextSecondary;
+}, function (p) {
+  return p.theme.colorPrimary;
+}, function (p) {
+  return p.theme.colorPrimary;
+}, function (p) {
+  return p.theme.colorBorderSecondary;
+}, function (p) {
+  return p.theme.borderRadiusLG;
+}, function (p) {
+  return p.theme.borderRadiusLG;
+}, function (p) {
+  return p.theme.colorFillTertiary;
+}, function (p) {
+  return p.theme.colorTextSecondary;
+});
+export default function (props) {
+  var Style = useStyle();
+  var _useProviderContext = useProviderContext(),
+    getPrefixCls = _useProviderContext.getPrefixCls;
+  var prefixCls = getPrefixCls('sender-mode-select');
+  var value = props.value,
+    onChange = props.onChange;
+  var valueObject = useMemo(function () {
+    var item = props.options.find(function (item) {
+      return item.value === value;
+    });
+    return item;
+  }, [props.value]);
+  var close = /*#__PURE__*/_jsx(SparkFalseLine, {
+    onClick: function onClick() {
+      return onChange(undefined);
+    },
+    style: {
+      cursor: 'pointer',
+      fontSize: 20
+    }
+  });
+  console.log(props.options);
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(Style, {}), /*#__PURE__*/_jsxs("div", {
+      className: prefixCls,
+      style: props.style,
+      children: [/*#__PURE__*/_jsx("div", {
+        className: "".concat(prefixCls, "-options ").concat(value ? "".concat(prefixCls, "-hide") : ''),
+        children: props.options.map(function (item) {
+          var node = /*#__PURE__*/_jsx(Display, _objectSpread({
+            onClick: function onClick() {
+              return onChange(item.value);
+            },
+            className: "".concat(prefixCls, "-option")
+          }, item), item.value);
+          return node;
+        })
+      }), /*#__PURE__*/_jsx("div", {
+        className: "".concat(prefixCls, "-display ").concat(value ? '' : "".concat(prefixCls, "-hide")),
+        children: /*#__PURE__*/_jsxs("div", {
+          className: "".concat(prefixCls, "-display-flex"),
+          children: [/*#__PURE__*/_jsx(Display, _objectSpread(_objectSpread({}, valueObject), {}, {
+            className: "".concat(prefixCls, "-display-label")
+          })), props.desc && /*#__PURE__*/_jsx("div", {
+            className: "".concat(prefixCls, "-display-desc"),
+            children: props.desc
+          }), props.closeTip ? /*#__PURE__*/_jsx(Tooltip, {
+            title: props.closeTip,
+            children: close
+          }) : close]
+        })
+      })]
+    })]
+  });
+}
+function Display(props) {
+  var node = /*#__PURE__*/_jsxs("div", {
+    className: props.className,
+    onClick: props.onClick,
+    children: [props.icon, props.label]
+  });
+  if (props.tooltip) {
+    return /*#__PURE__*/_jsx(Tooltip, {
+      title: props.tooltip,
+      children: node
+    });
+  } else {
+    return node;
+  }
+}

package/lib/Sender/SenderHeader.d.ts

@@ -0,0 +1,63 @@
+import * as React from 'react';
+export interface SendHeaderContextProps {
+    /**
+     * @description 自定义CSS类名前缀，用于样式隔离和主题定制
+     * @descriptionEn Custom CSS class name prefix for style isolation and theme customization
+     */
+    prefixCls: string;
+}
+export declare const SendHeaderContext: React.Context<SendHeaderContextProps>;
+export type SemanticType = 'header' | 'content';
+export interface SenderHeaderProps {
+    /**
+     * @description 是否强制渲染组件，即使不可见也保持DOM结构
+     * @descriptionEn Whether to force render the component, maintaining DOM structure even when invisible
+     */
+    forceRender?: boolean;
+    /**
+     * @description 是否展开头部区域，控制显示状态
+     * @descriptionEn Whether to expand the header area, controls display state
+     */
+    open?: boolean;
+    /**
+     * @description 展开状态变化时的回调函数
+     * @descriptionEn Callback function when expand state changes
+     */
+    onOpenChange?: (open: boolean) => void;
+    /**
+     * @description 头部标题内容，支持文本或React元素
+     * @descriptionEn Header title content, supports text or React elements
+     */
+    title?: React.ReactNode;
+    /**
+     * @description 头部内容区域，用于显示额外的信息或控件
+     * @descriptionEn Header content area for displaying additional information or controls
+     */
+    children?: React.ReactNode;
+    /**
+     * @description 组件的CSS类名
+     * @descriptionEn CSS class name for the component
+     */
+    className?: string;
+    /**
+     * @description 组件的内联样式对象
+     * @descriptionEn Inline style object for the component
+     */
+    style?: React.CSSProperties;
+    /**
+     * @description 语义化CSS类名，用于为不同区域添加自定义类名
+     * @descriptionEn Semantic CSS class names for adding custom classes to different areas
+     */
+    classNames?: Partial<Record<SemanticType, string>>;
+    /**
+     * @description 语义化样式对象，用于精确控制不同区域的样式
+     * @descriptionEn Semantic style object for precise control of different area styles
+     */
+    styles?: Partial<Record<SemanticType, React.CSSProperties>>;
+    /**
+     * @description 是否显示关闭按钮，用于控制头部区域的展开/收起
+     * @descriptionEn Whether to show close button for controlling header area expand/collapse
+     */
+    closable?: boolean;
+}
+export default function SenderHeader(props: SenderHeaderProps): import("react/jsx-runtime").JSX.Element;

package/{dist/sender → lib/Sender}/SenderHeader.js

@@ -4,11 +4,13 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 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); }
-import { CloseOutlined } from '@ant-design/icons';
+import { CloseOutlined } from "@agentscope-ai/icons-override-antd";
 import { Button } from 'antd';
 import classNames from 'classnames';
 import CSSMotion from 'rc-motion';
 import * as React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 export var SendHeaderContext = /*#__PURE__*/React.createContext({});
 var collapseHeight = function collapseHeight() {
   return {
@@ -24,7 +26,7 @@ export default function SenderHeader(props) {
   var title = props.title,
     onOpenChange = props.onOpenChange,
     open = props.open,
-    children = props.children,
+    _children = props.children,
     className = props.className,
     style = props.style,
     _props$classNames = props.classNames,
@@ -36,7 +38,7 @@ export default function SenderHeader(props) {
   var _React$useContext = React.useContext(SendHeaderContext),
     prefixCls = _React$useContext.prefixCls;
   var headerCls = "".concat(prefixCls, "-header");
-  return /*#__PURE__*/React.createElement(CSSMotion, {
+  return /*#__PURE__*/_jsx(CSSMotion, {
     motionEnter: true,
     motionLeave: true,
     motionName: "".concat(headerCls, "-motion"),
@@ -46,34 +48,40 @@ export default function SenderHeader(props) {
     onLeaveStart: expandedHeight,
     onLeaveActive: collapseHeight,
     visible: open,
-    forceRender: forceRender
-  }, function (_ref) {
-    var motionClassName = _ref.className,
-      motionStyle = _ref.style;
-    return /*#__PURE__*/React.createElement("div", {
-      className: classNames(headerCls, motionClassName, className),
-      style: _objectSpread(_objectSpread({}, motionStyle), style)
-    }, (closable !== false || title) && /*#__PURE__*/React.createElement("div", {
-      className:
-      // We follow antd naming standard here.
-      // So the header part is use `-header` suffix.
-      // Though its little bit weird for double `-header`.
-      classNames("".concat(headerCls, "-header"), classes.header),
-      style: _objectSpread({}, styles.header)
-    }, /*#__PURE__*/React.createElement("div", {
-      className: "".concat(headerCls, "-title")
-    }, title), closable !== false && /*#__PURE__*/React.createElement("div", {
-      className: "".concat(headerCls, "-close")
-    }, /*#__PURE__*/React.createElement(Button, {
-      type: "text",
-      icon: /*#__PURE__*/React.createElement(CloseOutlined, null),
-      size: "small",
-      onClick: function onClick() {
-        onOpenChange === null || onOpenChange === void 0 || onOpenChange(!open);
-      }
-    }))), children && /*#__PURE__*/React.createElement("div", {
-      className: classNames("".concat(headerCls, "-content"), classes.content),
-      style: _objectSpread({}, styles.content)
-    }, children));
+    forceRender: forceRender,
+    children: function children(_ref) {
+      var motionClassName = _ref.className,
+        motionStyle = _ref.style;
+      return /*#__PURE__*/_jsxs("div", {
+        className: classNames(headerCls, motionClassName, className),
+        style: _objectSpread(_objectSpread({}, motionStyle), style),
+        children: [(closable !== false || title) && /*#__PURE__*/_jsxs("div", {
+          className:
+          // We follow antd naming standard here.
+          // So the header part is use `-header` suffix.
+          // Though its little bit weird for double `-header`.
+          classNames("".concat(headerCls, "-header"), classes.header),
+          style: _objectSpread({}, styles.header),
+          children: [/*#__PURE__*/_jsx("div", {
+            className: "".concat(headerCls, "-title"),
+            children: title
+          }), closable !== false && /*#__PURE__*/_jsx("div", {
+            className: "".concat(headerCls, "-close"),
+            children: /*#__PURE__*/_jsx(Button, {
+              type: "text",
+              icon: /*#__PURE__*/_jsx(CloseOutlined, {}),
+              size: "small",
+              onClick: function onClick() {
+                onOpenChange === null || onOpenChange === void 0 || onOpenChange(!open);
+              }
+            })
+          })]
+        }), _children && /*#__PURE__*/_jsx("div", {
+          className: classNames("".concat(headerCls, "-content"), classes.content),
+          style: _objectSpread({}, styles.content),
+          children: _children
+        })]
+      });
+    }
   });
 }

package/{dist/sender → lib/Sender}/StopLoading.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 declare const StopLoadingIcon: React.MemoExoticComponent<(props: {
     className?: string;
-}) => React.JSX.Element>;
+}) => import("react/jsx-runtime").JSX.Element>;
 export default StopLoadingIcon;

package/lib/Sender/StopLoading.js

@@ -0,0 +1,25 @@
+import React, { memo } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var StopLoadingIcon = /*#__PURE__*/memo(function (props) {
+  var className = props.className;
+  return /*#__PURE__*/_jsxs("svg", {
+    color: "currentColor",
+    viewBox: "0 0 1000 1000",
+    xmlns: "http://www.w3.org/2000/svg",
+    xmlnsXlink: "http://www.w3.org/1999/xlink",
+    className: className,
+    children: [/*#__PURE__*/_jsx("title", {
+      children: "Stop Loading"
+    }), /*#__PURE__*/_jsx("rect", {
+      fill: "currentColor",
+      height: "250",
+      rx: "24",
+      ry: "24",
+      width: "250",
+      x: "375",
+      y: "375"
+    })]
+  });
+});
+export default StopLoadingIcon;

package/lib/Sender/components/ActionButton.d.ts

@@ -0,0 +1,72 @@
+import * as React from 'react';
+export interface ActionButtonContextProps {
+    /**
+     * @description 自定义CSS类名前缀，用于样式隔离和主题定制
+     * @descriptionEn Custom CSS class name prefix for style isolation and theme customization
+     */
+    prefixCls: string;
+    /**
+     * @description 发送消息的回调函数
+     * @descriptionEn Callback function for sending messages
+     */
+    onSend?: VoidFunction;
+    /**
+     * @description 是否禁用发送按钮
+     * @descriptionEn Whether to disable the send button
+     */
+    onSendDisabled?: boolean;
+    /**
+     * @description 清空输入的回调函数
+     * @descriptionEn Callback function for clearing input
+     */
+    onClear?: VoidFunction;
+    /**
+     * @description 是否禁用清空按钮
+     * @descriptionEn Whether to disable the clear button
+     */
+    onClearDisabled?: boolean;
+    /**
+     * @description 取消操作的回调函数
+     * @descriptionEn Callback function for canceling operations
+     */
+    onCancel?: VoidFunction;
+    /**
+     * @description 是否禁用取消按钮
+     * @descriptionEn Whether to disable the cancel button
+     */
+    onCancelDisabled?: boolean;
+    /**
+     * @description 语音输入的回调函数
+     * @descriptionEn Callback function for voice input
+     */
+    onSpeech?: VoidFunction;
+    /**
+     * @description 是否禁用语音按钮
+     * @descriptionEn Whether to disable the speech button
+     */
+    onSpeechDisabled?: boolean;
+    /**
+     * @description 是否正在录音，影响语音按钮的显示状态
+     * @descriptionEn Whether currently recording, affects the display state of the speech button
+     */
+    speechRecording?: boolean;
+    /**
+     * @description 是否禁用所有操作按钮
+     * @descriptionEn Whether to disable all action buttons
+     */
+    disabled?: boolean;
+}
+export declare const ActionButtonContext: React.Context<ActionButtonContextProps>;
+export interface ActionButtonProps {
+    /**
+     * @description 按钮的操作类型，决定按钮的行为和样式
+     * @descriptionEn Action type of the button, determines button behavior and style
+     */
+    action: 'onSend' | 'onClear' | 'onCancel' | 'onSpeech';
+    onClick?: (e: any) => void;
+    className?: string;
+    disabled?: boolean;
+}
+export declare function ActionButton(props: ActionButtonProps): import("react/jsx-runtime").JSX.Element;
+declare const _default: React.ForwardRefExoticComponent<ActionButtonProps & React.RefAttributes<unknown>>;
+export default _default;

package/{dist/sender → lib/Sender}/components/ActionButton.js

@@ -1,16 +1,18 @@
 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); }
 var _excluded = ["className", "action", "onClick"];
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 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 _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-import { Button } from 'antd';
+import { IconButton } from "@ali/agentscope-ai-design";
 import classNames from 'classnames';
 import * as React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 export var ActionButtonContext = /*#__PURE__*/React.createContext(null);
-export function ActionButton(props, ref) {
+export function ActionButton(props) {
   var _ref;
   var className = props.className,
     action = props.action,
@@ -21,8 +23,10 @@ export function ActionButton(props, ref) {
     rootDisabled = context.disabled;
   var _onClick = context[action];
   var mergedDisabled = (_ref = rootDisabled !== null && rootDisabled !== void 0 ? rootDisabled : restProps.disabled) !== null && _ref !== void 0 ? _ref : context["".concat(action, "Disabled")];
-  return /*#__PURE__*/React.createElement(Button, _extends({}, restProps, {
-    ref: ref,
+  return /*#__PURE__*/_jsx(IconButton, _objectSpread(_objectSpread({
+    bordered: false,
+    disabled: mergedDisabled
+  }, restProps), {}, {
     onClick: function onClick(e) {
       if (!mergedDisabled) {
         if (_onClick) {

package/lib/Sender/components/ClearButton.js

@@ -0,0 +1,19 @@
+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 ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+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); }
+import { ClearOutlined } from "@agentscope-ai/icons-override-antd";
+import * as React from 'react';
+import ActionButton from "./ActionButton";
+import { jsx as _jsx } from "react/jsx-runtime";
+function ClearButton(props, ref) {
+  return /*#__PURE__*/_jsx(ActionButton, _objectSpread(_objectSpread({
+    icon: /*#__PURE__*/_jsx(ClearOutlined, {})
+  }, props), {}, {
+    action: "onClear",
+    ref: ref
+  }));
+}
+export default /*#__PURE__*/React.forwardRef(ClearButton);

package/lib/Sender/components/LoadingButton.js

@@ -0,0 +1,28 @@
+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 ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+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); }
+import classNames from 'classnames';
+import * as React from 'react';
+import StopLoadingIcon from "../StopLoading";
+import ActionButton, { ActionButtonContext } from "./ActionButton";
+import { jsx as _jsx } from "react/jsx-runtime";
+function LoadingButton(props, ref) {
+  var _React$useContext = React.useContext(ActionButtonContext),
+    prefixCls = _React$useContext.prefixCls;
+  var className = props.className;
+  return /*#__PURE__*/_jsx(ActionButton, _objectSpread(_objectSpread({
+    icon: /*#__PURE__*/_jsx(StopLoadingIcon, {
+      className: "".concat(prefixCls, "-loading-icon")
+    }),
+    type: "primary",
+    variant: "text"
+  }, props), {}, {
+    className: classNames(className, "".concat(prefixCls, "-loading-button")),
+    action: "onCancel",
+    ref: ref
+  }));
+}
+export default /*#__PURE__*/React.forwardRef(LoadingButton);

package/lib/Sender/components/SendButton.js

@@ -0,0 +1,20 @@
+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 ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+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); }
+import { ArrowUpOutlined } from "@agentscope-ai/icons-override-antd";
+import * as React from 'react';
+import ActionButton from "./ActionButton";
+import { jsx as _jsx } from "react/jsx-runtime";
+function SendButton(props, ref) {
+  return /*#__PURE__*/_jsx(ActionButton, _objectSpread(_objectSpread({
+    icon: /*#__PURE__*/_jsx(ArrowUpOutlined, {}),
+    type: "primary"
+  }, props), {}, {
+    action: "onSend",
+    ref: ref
+  }));
+}
+export default /*#__PURE__*/React.forwardRef(SendButton);

package/lib/Sender/components/SpeechButton/RecordingIcon.d.ts

@@ -0,0 +1,8 @@
+export interface RecordingIconProps {
+    /**
+     * @description 录音图标的CSS类名，用于自定义样式
+     * @descriptionEn CSS class name for the recording icon for custom styling
+     */
+    className?: string;
+}
+export default function RecordingIcon({ className }: RecordingIconProps): import("react/jsx-runtime").JSX.Element;