@agentscope-ai/chat 1.1.45-beta.1766042199498 → 1.1.45-beta.1766386435551

package/components/AgentScopeRuntimeWebUI/core/AgentScopeRuntime/Response/Actions.tsx

@@ -2,7 +2,7 @@ import { SparkCopyLine, SparkReplaceLine } from "@agentscope-ai/icons";
 import { IAgentScopeRuntimeResponse } from "../types";
 import AgentScopeRuntimeResponseBuilder from "./Builder";
 import { Bubble } from "@agentscope-ai/chat";
-import { copy } from "@agentscope-ai/design";
+import { copy, Tooltip } from "@agentscope-ai/design";
 import compact from 'lodash/compact';
 import { emit } from "../../Context/useChatAnywhereEventEmitter";
 import { useChatAnywhereOptions } from "../../Context/ChatAnywhereOptionsContext";
@@ -47,7 +47,7 @@ export default function Tools(props: {
       }
     }),
     props.isLast ? {
-      icon: <SparkReplaceLine />,
+      icon: <Tooltip title="重新生成"><SparkReplaceLine /></Tooltip>,
       onClick: () => {
         emit({
           type: 'handleReplace',

package/components/ChatAnywhere/Input/index.tsx

@@ -1,5 +1,5 @@
 import React, { forwardRef, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react'
-import { UploadFile } from 'antd';
+import { Flex, Popover, UploadFile } from 'antd';
 import { useProviderContext, ChatInput, uuid, Sender, Attachments } from '@agentscope-ai/chat';
 import cls from 'classnames';
 import { useChatAnywhere } from '../hooks/ChatAnywhereProvider';
@@ -31,7 +31,7 @@ export default forwardRef(function (_, ref) {
   useEffect(() => {
     attachedFilesRef.current = attachedFiles;
   }, [attachedFiles]);
-  
+
   const uiConfig = useChatAnywhere(v => v.uiConfig);
   const { getPrefixCls } = useProviderContext();
   const prefixCls = getPrefixCls('chat-anywhere-sender');
@@ -85,8 +85,11 @@ export default forwardRef(function (_, ref) {
     })
   }
 
-  const prefixNodes = onInput.variant !== 'aigc' && onUpload?.length ?
-    onUpload.map((item, index) => {
+  const uploadPrefixNodes = useMemo(() => {
+    if (onInput.variant === 'aigc' || !onUpload?.length) {
+      return [];
+    }
+    const nodes = onUpload.map((item, index) => {
       return <Upload
         {...item}
         fileList={attachedFiles[index]}
@@ -102,12 +105,26 @@ export default forwardRef(function (_, ref) {
         }}
         showUploadList={false}
       >
-        <IconButton
-          icon={item.icon}
-          bordered={false}
-        />
+        {
+          item.trigger || <IconButton
+            icon={item.icon}
+            bordered={false}
+          />
+        }
       </Upload>
-    }) : [];
+    });
+
+    if (nodes.length === 1) return nodes;
+    return <Popover content={nodes} trigger="click">
+      <Flex vertical>
+        {nodes}
+      </Flex>
+    </Popover>
+
+
+  }, [onInput.variant, onUpload, attachedFiles]);
+
+
 
 
   // aigc 模式下的 header
@@ -162,7 +179,7 @@ export default forwardRef(function (_, ref) {
         if (trimmed.startsWith('.')) {
           return fileName.toLowerCase().endsWith(trimmed.toLowerCase());
         }
-        
+
         // Wildcard: image/*, */*
         if (trimmed.includes('*')) {
           if (trimmed === '*/*') return true;
@@ -170,7 +187,7 @@ export default forwardRef(function (_, ref) {
           const [fileMain] = fileType.split('/');
           return acceptMain === fileMain;
         }
-        
+
         // Exact: image/jpeg
         return fileType === trimmed;
       });
@@ -225,7 +242,7 @@ export default forwardRef(function (_, ref) {
       const getExtension = () => {
         const nameMatch = fileName.match(/\.([^.]+)$/);
         if (nameMatch) return nameMatch[1].toLowerCase();
-        
+
         const typeMatch = fileType.match(/\/([^/+]+)/);
         return typeMatch ? typeMatch[1].toLowerCase() : 'bin';
       };
@@ -257,7 +274,7 @@ export default forwardRef(function (_, ref) {
       setAttachedFiles(prev => {
         const updated = [...prev];
         const currentList = updated[uploadIndex] || [];
-        
+
         // If not multiple, replace existing files
         if (!uploadConfig.multiple) {
           updated[uploadIndex] = [uploadFile];
@@ -296,11 +313,11 @@ export default forwardRef(function (_, ref) {
           updateFile({ percent: event.percent });
         },
       } as any, {
-        defaultRequest: () => {}
+        defaultRequest: () => { }
       });
     }
   };
-  
+
   // 检查是否有必需的上传项没有文件
   const requiredFileMissing = useMemo(() => {
     return onUpload?.some((item, index) => {
@@ -311,7 +328,7 @@ export default forwardRef(function (_, ref) {
       return false;
     }) ?? false;
   }, [onUpload, attachedFiles]);
-  
+
   const sendDisabled = requiredFileMissing;
 
   return <>
@@ -340,7 +357,7 @@ export default forwardRef(function (_, ref) {
         scalable={onInput?.zoomable}
         header={senderHeader}
         prefix={<>
-          {prefixNodes}
+          {uploadPrefixNodes}
           {onInput?.morePrefixActions}
         </>}
         onSubmit={async () => {

package/components/ChatAnywhere/hooks/types.ts

@@ -234,6 +234,7 @@ export interface IChatAnywhereConfigOnUpload {
    * @descriptionEn Description for the upload component
    */
   description?: string | React.ReactElement;
+  trigger?: React.ReactElement;
 }
 
 export interface IChatAnywhereConfig {

package/components/GenerativeUI/Sandbox.tsx

@@ -0,0 +1,7 @@
+export default function Iframe() {
+  return <iframe srcDoc={`<html>
+    <body>
+      <h1>Hello, world!</h1>
+    </body>
+  </html>`} />
+}

package/components/GenerativeUI/index.tsx

@@ -0,0 +1 @@
+export { default as Sandbox } from './Sandbox';

package/components/OperateCard/preset/Rag.tsx

@@ -3,7 +3,7 @@ import { Empty, IconButton, Tag } from '@agentscope-ai/design';
 import { SparkBookLine, SparkDownLine, SparkUpLine, SparkWarningCircleFill } from '@agentscope-ai/icons';
 import { ConfigProvider, Flex, Image } from 'antd';
 import { Locale } from "antd/es/locale";
-import { useState } from 'react';
+import { ReactNode, useState } from 'react';
 
 export interface IRagProps {
   /**
@@ -41,7 +41,7 @@ export interface IRagProps {
    * @default []
    */
   list: {
-    score?: number | string;
+    score?: number | string | ReactNode;
     title: string;
     content: string;
     footer: string;
@@ -94,7 +94,7 @@ function Item({ item }) {
       </span>
       <span style={{ flex: 1 }}></span>
       {
-        item.score && <Tag color="blue">{item.score}</Tag>
+        item.score || null
       }
 
       <IconButton
@@ -106,7 +106,7 @@ function Item({ item }) {
     </div>
     {
       open && <div className={`${prefixCls}-rag-item-content`}>
-        <div>{item.content}</div>
+        <div className={`${prefixCls}-rag-item-content-text`}>{item.content}</div>
 
         {
           item.images &&

package/components/OperateCard/style.ts

@@ -261,6 +261,11 @@ export default createGlobalStyle`
       padding: 8px;
       border-radius: 6px;
       background-color: ${(p) => p.theme.colorFillTertiary};
+
+      &-text {
+        font-size: 12px;
+        line-height: 20px;
+      }
     }
 
     &-images {

package/components/index.ts

@@ -85,4 +85,6 @@ export {
   type MarkdownProps,
 } from './Markdown';
 
-export { default as AIGC } from './AIGC';
+export { default as AIGC } from './AIGC';
+
+export { Sandbox as GenerativeUISandbox } from './GenerativeUI';

package/lib/AgentScopeRuntimeWebUI/core/AgentScopeRuntime/Response/Actions.js

@@ -13,7 +13,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 import { SparkCopyLine, SparkReplaceLine } from "@agentscope-ai/icons";
 import AgentScopeRuntimeResponseBuilder from "./Builder";
 import { Bubble } from "../../../..";
-import { copy } from "@agentscope-ai/design";
+import { copy, Tooltip } from "@agentscope-ai/design";
 import compact from 'lodash/compact';
 import { emit } from "../../Context/useChatAnywhereEventEmitter";
 import { useChatAnywhereOptions } from "../../Context/ChatAnywhereOptionsContext";
@@ -50,7 +50,10 @@ export default function Tools(props) {
       }
     });
   })), [props.isLast ? {
-    icon: /*#__PURE__*/_jsx(SparkReplaceLine, {}),
+    icon: /*#__PURE__*/_jsx(Tooltip, {
+      title: "\u91CD\u65B0\u751F\u6210",
+      children: /*#__PURE__*/_jsx(SparkReplaceLine, {})
+    }),
     onClick: function onClick() {
       emit({
         type: 'handleReplace',

package/lib/ChatAnywhere/Input/index.js

@@ -18,6 +18,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 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, { forwardRef, useEffect, useMemo, useRef, useState } from 'react';
+import { Flex, Popover } from 'antd';
 import { useProviderContext, ChatInput, Sender, Attachments } from "../..";
 import cls from 'classnames';
 import { useChatAnywhere } from "../hooks/ChatAnywhereProvider";
@@ -123,24 +124,38 @@ export default /*#__PURE__*/forwardRef(function (_, ref) {
       return _ref.apply(this, arguments);
     };
   }();
-  var prefixNodes = onInput.variant !== 'aigc' && onUpload !== null && onUpload !== void 0 && onUpload.length ? onUpload.map(function (item, index) {
-    return /*#__PURE__*/_createElement(Upload, _objectSpread(_objectSpread({}, item), {}, {
-      fileList: attachedFiles[index],
-      key: index,
-      onChange: function onChange(info) {
-        if (item.beforeUpload && info.file.status) {
-          handleFileChange(index, info.fileList);
-        }
-        if (!item.beforeUpload) {
-          handleFileChange(index, info.fileList);
-        }
-      },
-      showUploadList: false
-    }), /*#__PURE__*/_jsx(IconButton, {
-      icon: item.icon,
-      bordered: false
-    }));
-  }) : [];
+  var uploadPrefixNodes = useMemo(function () {
+    if (onInput.variant === 'aigc' || !(onUpload !== null && onUpload !== void 0 && onUpload.length)) {
+      return [];
+    }
+    var nodes = onUpload.map(function (item, index) {
+      return /*#__PURE__*/_createElement(Upload, _objectSpread(_objectSpread({}, item), {}, {
+        fileList: attachedFiles[index],
+        key: index,
+        onChange: function onChange(info) {
+          if (item.beforeUpload && info.file.status) {
+            handleFileChange(index, info.fileList);
+          }
+          if (!item.beforeUpload) {
+            handleFileChange(index, info.fileList);
+          }
+        },
+        showUploadList: false
+      }), item.trigger || /*#__PURE__*/_jsx(IconButton, {
+        icon: item.icon,
+        bordered: false
+      }));
+    });
+    if (nodes.length === 1) return nodes;
+    return /*#__PURE__*/_jsx(Popover, {
+      content: nodes,
+      trigger: "click",
+      children: /*#__PURE__*/_jsx(Flex, {
+        vertical: true,
+        children: nodes
+      })
+    });
+  }, [onInput.variant, onUpload, attachedFiles]);
 
   // aigc 模式下的 header
   var aigcSenderHeader = /*#__PURE__*/_jsx(AIGC.SenderHeader, {
@@ -377,7 +392,7 @@ export default /*#__PURE__*/forwardRef(function (_, ref) {
         scalable: onInput === null || onInput === void 0 ? void 0 : onInput.zoomable,
         header: senderHeader,
         prefix: /*#__PURE__*/_jsxs(_Fragment, {
-          children: [prefixNodes, onInput === null || onInput === void 0 ? void 0 : onInput.morePrefixActions]
+          children: [uploadPrefixNodes, onInput === null || onInput === void 0 ? void 0 : onInput.morePrefixActions]
         }),
         onSubmit: /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
           var next;

package/lib/ChatAnywhere/hooks/types.d.ts

@@ -231,6 +231,7 @@ export interface IChatAnywhereConfigOnUpload {
      * @descriptionEn Description for the upload component
      */
     description?: string | React.ReactElement;
+    trigger?: React.ReactElement;
 }
 export interface IChatAnywhereConfig {
     /**

package/lib/GenerativeUI/Sandbox.d.ts

@@ -0,0 +1 @@
+export default function Iframe(): import("react/jsx-runtime").JSX.Element;

package/lib/GenerativeUI/Sandbox.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export default function Iframe() {
+  return /*#__PURE__*/_jsx("iframe", {
+    srcDoc: "<html>\n    <body>\n      <h1>Hello, world!</h1>\n    </body>\n  </html>"
+  });
+}

package/lib/GenerativeUI/index.d.ts

@@ -0,0 +1 @@
+export { default as Sandbox } from './Sandbox';

package/lib/GenerativeUI/index.js

@@ -0,0 +1 @@
+export { default as Sandbox } from "./Sandbox";

package/lib/OperateCard/preset/Rag.d.ts

@@ -1,3 +1,4 @@
+import { ReactNode } from 'react';
 export interface IRagProps {
     /**
      * @description 标题
@@ -34,7 +35,7 @@ export interface IRagProps {
      * @default []
      */
     list: {
-        score?: number | string;
+        score?: number | string | ReactNode;
         title: string;
         content: string;
         footer: string;

package/lib/OperateCard/preset/Rag.js

@@ -5,7 +5,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 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 { OperateCard, useProviderContext } from "../..";
-import { IconButton, Tag } from '@agentscope-ai/design';
+import { IconButton } from '@agentscope-ai/design';
 import { SparkBookLine, SparkDownLine, SparkUpLine, SparkWarningCircleFill } from '@agentscope-ai/icons';
 import { ConfigProvider, Flex, Image } from 'antd';
 import { useState } from 'react';
@@ -56,10 +56,7 @@ function Item(_ref2) {
         style: {
           flex: 1
         }
-      }), item.score && /*#__PURE__*/_jsx(Tag, {
-        color: "blue",
-        children: item.score
-      }), /*#__PURE__*/_jsx(IconButton, {
+      }), item.score || null, /*#__PURE__*/_jsx(IconButton, {
         bordered: false,
         size: "small",
         icon: open ? /*#__PURE__*/_jsx(SparkUpLine, {}) : /*#__PURE__*/_jsx(SparkDownLine, {})
@@ -67,6 +64,7 @@ function Item(_ref2) {
     }), open && /*#__PURE__*/_jsxs("div", {
       className: "".concat(prefixCls, "-rag-item-content"),
       children: [/*#__PURE__*/_jsx("div", {
+        className: "".concat(prefixCls, "-rag-item-content-text"),
         children: item.content
       }), item.images && /*#__PURE__*/_jsx("div", {
         className: "".concat(prefixCls, "-rag-item-images"),

package/lib/OperateCard/style.js

@@ -1,7 +1,7 @@
 var _templateObject;
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import { createGlobalStyle } from 'antd-style';
-export default createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-operate-card {\n  width: 100%;\n  border-radius: ", "px;\n  overflow: hidden;\n  background-color: ", ";\n\n  &-header {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 0 12px;\n    height: 32px;\n\n    &-icon {\n      font-size: 16px;\n    }\n\n    &-title {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      font-size: 13px;\n      font-weight: 500;\n      color: ", ";\n    }\n\n    &-description {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      font-size: 12px;\n      color: ", ";\n    }\n\n    &-arrow {\n      margin: 0 0 0 auto;\n    }\n\n    &-has-body {\n      cursor: pointer;\n    }\n  }\n\n  &-body {\n    opacity: 0;\n    animation: ", "-operate-card-body-open 0.2s ease-in-out forwards;\n    \n    @keyframes ", "-operate-card-body-open {\n      from {\n        opacity: 0;\n      }\n      to {\n        opacity: 1;\n      }\n    }\n  \n  }\n\n\n  &-line-body {\n    margin: 0 12px 12px 20px;\n    border-left: 1px solid ", ";\n  }\n\n  &-thinking {\n    padding-left: 16px;\n    font-size: 12px;\n    line-height: 20px;\n    color: ", ";\n    opacity: 0.85;\n    white-space: pre-wrap;\n  }\n\n\n  &-todo-list {\n\n    &-item {\n      height: 32px;\n      display: flex;\n      align-items: center;\n      padding: 0 12px;\n      gap: 8px;\n      \n      color: ", ";\n\n\n      &-done {\n        color: ", ";\n      }\n\n      &-icon {\n        font-size: 16px;\n      }\n\n      &-title {\n        text-overflow: ellipsis;\n        overflow: hidden;\n        white-space: nowrap;\n        font-size: 12px;\n      }\n\n      &-done {\n        \n      }\n\n    }\n  \n  }\n\n\n  &-web-search-item {\n    display: flex;\n    height: 32px;\n    align-items: center;\n    padding: 0 12px;\n    gap: 8px;\n    color: ", ";\n    cursor: pointer;\n\n    &-icon {\n      display: block;\n      width: 16px;\n      height: 16px;\n      border: 1px solid ", ";\n      border-radius: 99px;\n    }\n\n    &-title {\n      font-size: 12px;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      color: ", ";\n\n      &:hover {\n        color: ", ";\n        \n      }\n\n    }\n\n    &-subTitle {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      border-left: 1px solid ", ";\n      font-size: 12px;\n      line-height: 1;\n      color: ", ";\n      padding-left: 8px;\n      margin-left: 4px;\n    }\n\n  }\n\n\n  &-tool-call-block {\n    margin-left: 16px;\n    margin-top: 8px;\n\n  \n    &-title {\n      font-size: 12px;\n      color: ", ";\n      line-height: 20px;\n      margin-bottom: 4px;\n    }\n\n  }\n\n\n\n  &-device-action {\n    height: auto;\n    align-items: flex-start;\n\n    &-icon {\n      margin-top: 6px;\n    }\n\n    &-time {\n      margin-bottom: 4px;\n      font-size: 12px;\n      line-height: 20px;\n      color: ", ";\n    }\n\n    &-content {\n      \n      width: 100%;\n      display: flex;\n      justify-content: space-between;\n    }\n\n    &-description {\n      width: 0;\n      flex: 1;\n      margin: 8px 0 6px 0;\n    }\n\n    &-image {\n      margin: 4px 0;\n      height: 32px;\n      margin-left: 8px;\n      display: block;\n      border-radius: 6px;\n      overflow: hidden;\n      border: 1px solid ", ";\n    }\n\n\n    \n  }\n\n  &-rag-empty-placeholder {\n    padding: 16px 0;\n    border: 1px solid ", ";\n    border-radius: 6px;\n    background-color: ", ";\n    line-height: 20px;\n    font-size: 12px;\n    color: ", ";\n    margin: 0 12px 12px 12px;\n  }\n\n  &-rag-query {\n    margin: 0 12px 8px 12px;\n    line-height: 20px;\n    font-size: 12px;\n    color: ", ";\n\n    &-title {\n      font-weight: 500;\n    }\n\n    &-images {\n      margin: 0 12px 8px 12px;\n      display: flex;\n      gap: 8px;\n    }\n  }\n\n  &-rag-item {\n    margin-left: 16px;\n\n    &-title {\n      font-size: 12px;\n      color: ", ";\n      line-height: 20px;\n      margin-bottom: 4px;\n      display: flex;\n      align-items: center;\n      cursor: pointer;\n    }\n\n    &-content {\n      padding: 8px;\n      border-radius: 6px;\n      background-color: ", ";\n    }\n\n    &-images {\n      margin-top: 8px;\n      padding: 8px;\n      display: flex;\n      gap: 8px;\n      background-color: ", ";\n      \n    }\n\n    &-footer {\n      display: block;\n      margin-top: 8px;\n      font-size: 12px;\n      line-height: 20px;\n      color: ", ";\n    }\n\n  }\n\n  &-rag-item ~ &-rag-item {\n    margin-top: 8px;\n  }\n}\n"])), function (p) {
+export default createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-operate-card {\n  width: 100%;\n  border-radius: ", "px;\n  overflow: hidden;\n  background-color: ", ";\n\n  &-header {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 0 12px;\n    height: 32px;\n\n    &-icon {\n      font-size: 16px;\n    }\n\n    &-title {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      font-size: 13px;\n      font-weight: 500;\n      color: ", ";\n    }\n\n    &-description {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      font-size: 12px;\n      color: ", ";\n    }\n\n    &-arrow {\n      margin: 0 0 0 auto;\n    }\n\n    &-has-body {\n      cursor: pointer;\n    }\n  }\n\n  &-body {\n    opacity: 0;\n    animation: ", "-operate-card-body-open 0.2s ease-in-out forwards;\n    \n    @keyframes ", "-operate-card-body-open {\n      from {\n        opacity: 0;\n      }\n      to {\n        opacity: 1;\n      }\n    }\n  \n  }\n\n\n  &-line-body {\n    margin: 0 12px 12px 20px;\n    border-left: 1px solid ", ";\n  }\n\n  &-thinking {\n    padding-left: 16px;\n    font-size: 12px;\n    line-height: 20px;\n    color: ", ";\n    opacity: 0.85;\n    white-space: pre-wrap;\n  }\n\n\n  &-todo-list {\n\n    &-item {\n      height: 32px;\n      display: flex;\n      align-items: center;\n      padding: 0 12px;\n      gap: 8px;\n      \n      color: ", ";\n\n\n      &-done {\n        color: ", ";\n      }\n\n      &-icon {\n        font-size: 16px;\n      }\n\n      &-title {\n        text-overflow: ellipsis;\n        overflow: hidden;\n        white-space: nowrap;\n        font-size: 12px;\n      }\n\n      &-done {\n        \n      }\n\n    }\n  \n  }\n\n\n  &-web-search-item {\n    display: flex;\n    height: 32px;\n    align-items: center;\n    padding: 0 12px;\n    gap: 8px;\n    color: ", ";\n    cursor: pointer;\n\n    &-icon {\n      display: block;\n      width: 16px;\n      height: 16px;\n      border: 1px solid ", ";\n      border-radius: 99px;\n    }\n\n    &-title {\n      font-size: 12px;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      color: ", ";\n\n      &:hover {\n        color: ", ";\n        \n      }\n\n    }\n\n    &-subTitle {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      border-left: 1px solid ", ";\n      font-size: 12px;\n      line-height: 1;\n      color: ", ";\n      padding-left: 8px;\n      margin-left: 4px;\n    }\n\n  }\n\n\n  &-tool-call-block {\n    margin-left: 16px;\n    margin-top: 8px;\n\n  \n    &-title {\n      font-size: 12px;\n      color: ", ";\n      line-height: 20px;\n      margin-bottom: 4px;\n    }\n\n  }\n\n\n\n  &-device-action {\n    height: auto;\n    align-items: flex-start;\n\n    &-icon {\n      margin-top: 6px;\n    }\n\n    &-time {\n      margin-bottom: 4px;\n      font-size: 12px;\n      line-height: 20px;\n      color: ", ";\n    }\n\n    &-content {\n      \n      width: 100%;\n      display: flex;\n      justify-content: space-between;\n    }\n\n    &-description {\n      width: 0;\n      flex: 1;\n      margin: 8px 0 6px 0;\n    }\n\n    &-image {\n      margin: 4px 0;\n      height: 32px;\n      margin-left: 8px;\n      display: block;\n      border-radius: 6px;\n      overflow: hidden;\n      border: 1px solid ", ";\n    }\n\n\n    \n  }\n\n  &-rag-empty-placeholder {\n    padding: 16px 0;\n    border: 1px solid ", ";\n    border-radius: 6px;\n    background-color: ", ";\n    line-height: 20px;\n    font-size: 12px;\n    color: ", ";\n    margin: 0 12px 12px 12px;\n  }\n\n  &-rag-query {\n    margin: 0 12px 8px 12px;\n    line-height: 20px;\n    font-size: 12px;\n    color: ", ";\n\n    &-title {\n      font-weight: 500;\n    }\n\n    &-images {\n      margin: 0 12px 8px 12px;\n      display: flex;\n      gap: 8px;\n    }\n  }\n\n  &-rag-item {\n    margin-left: 16px;\n\n    &-title {\n      font-size: 12px;\n      color: ", ";\n      line-height: 20px;\n      margin-bottom: 4px;\n      display: flex;\n      align-items: center;\n      cursor: pointer;\n    }\n\n    &-content {\n      padding: 8px;\n      border-radius: 6px;\n      background-color: ", ";\n\n      &-text {\n        font-size: 12px;\n        line-height: 20px;\n      }\n    }\n\n    &-images {\n      margin-top: 8px;\n      padding: 8px;\n      display: flex;\n      gap: 8px;\n      background-color: ", ";\n      \n    }\n\n    &-footer {\n      display: block;\n      margin-top: 8px;\n      font-size: 12px;\n      line-height: 20px;\n      color: ", ";\n    }\n\n  }\n\n  &-rag-item ~ &-rag-item {\n    margin-top: 8px;\n  }\n}\n"])), function (p) {
   return p.theme.prefixCls;
 }, function (p) {
   return p.theme.borderRadiusLG;

package/lib/index.d.ts

@@ -26,3 +26,4 @@ export { default as sleep } from './Util/sleep';
 export { default as Welcome, type IWelcomeProps } from './Welcome';
 export { default as Markdown, type MarkdownProps as IMarkdownProps, type MarkdownProps, } from './Markdown';
 export { default as AIGC } from './AIGC';
+export { Sandbox as GenerativeUISandbox } from './GenerativeUI';

package/lib/index.js

@@ -24,4 +24,5 @@ export { default as StatusCard } from "./StatusCard";
 export { default as sleep } from "./Util/sleep";
 export { default as Welcome } from "./Welcome";
 export { default as Markdown } from "./Markdown";
-export { default as AIGC } from "./AIGC";
+export { default as AIGC } from "./AIGC";
+export { Sandbox as GenerativeUISandbox } from "./GenerativeUI";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agentscope-ai/chat",
-  "version": "1.1.45-beta.1766042199498",
+  "version": "1.1.45-beta.1766386435551",
   "description": "a free and open-source chat framework for building excellent LLM-powered chat experiences",
   "license": "Apache-2.0",
   "sideEffects": [