@agentscope-ai/chat 1.1.46-beta.1768191317759 → 1.1.46

package/components/Markdown/Markdown.tsx

@@ -57,12 +57,13 @@ export default memo(function (props: MarkdownProps) {
   } = useCitationsData({ citations: props.citations, citationsMap: props.citationsMap });
 
   const components = useMemo(() => ({
-    pre: CodeBlock,
+    code: CodeBlock,
     style: Null,
     script: Null,
     img: props.disableImage ? DisabledImage : Media,
     citation: CitationComponent,
     'custom-cursor': CursorComponent,
+    
     a: Link,
     ...props.components,
   }), [props.disableImage, CitationComponent, props.components]);

package/components/Markdown/core/components/CodeBlock.tsx

@@ -1,114 +1,45 @@
-import React, { useMemo, useState } from 'react';
-import type { FC } from 'react';
-import { CodeBlock as Code, CodeBlockLangExtensionsMap, } from '@agentscope-ai/design';
-import { createStyles } from 'antd-style';
-import { useProviderContext, Mermaid } from '@agentscope-ai/chat';
-import { theme as AntdTheme } from 'antd'
+import { Bubble, CodeHighlighter, Mermaid } from '@ant-design/x';
+import { type ComponentProps } from '@ant-design/x-markdown';
+import { useProviderContext } from "@agentscope-ai/chat";
+import { useState } from 'react';
 import { SparkCopyLine, SparkTrueLine } from '@agentscope-ai/icons';
 
-const supportedLanguages = Object.keys(CodeBlockLangExtensionsMap);
 
-const countLines = (str: string): number => {
-  if (!str) return 1;
-  const regex = /\n/g;
-  const matches = str.match(regex);
-  return matches ? matches.length : 1;
-};
-
-const useCode = (raw: any) => {
-  if (!raw) return {};
-
-  const { children, className } = raw.props;
-
-  if (!children) return {};
+const Code: React.FC<ComponentProps> = (props) => {
+  const { className, children } = props;
+  const lang = className?.match(/language-(\w+)/)?.[1] || '';
 
-  const content = Array.isArray(children) ? (children[0] as string) : children;
-  const lang = className?.replace('language-', '') || 'txt';
-  const isSingleLine = countLines(content) <= 1 && content.length <= 32;
-
-  return {
-    content,
-    isSingleLine,
-    lang,
-  };
+  if (typeof children !== 'string') return null;
+  if (lang === 'mermaid') {
+    return <Mermaid header={<CodeHeader lang='mermaid' content={children} />}>{children}</Mermaid>;
+  }
+  return <CodeHighlighter lang={lang} header={<CodeHeader lang={lang} content={children} />}>{children}</CodeHighlighter>;
 };
 
-interface CodeBlockProps {
-  children: any;
-  enableMermaid?: boolean;
-}
 
-const CodeBlock: FC<CodeBlockProps> = ({ children, enableMermaid }) => {
-  const code = useCode(children);
-  const { styles, cx } = useStyles();
-  const { getPrefixCls, theme } = useProviderContext();
-  const isDarkMode = theme?.algorithm === AntdTheme.darkAlgorithm;
+function CodeHeader({ lang, content }: { lang: string, content: string }) {
   const [copied, setCopied] = useState(false);
+  const { getPrefixCls } = useProviderContext();
+  const prefixCls = getPrefixCls('code-header');
 
 
-  const { content: _content = '', lang = '' } = code;
-  const content = useMemo(() => {
-    return _content.replace(/ :(dot|underline):/g, '');
-  }, [_content])
+  return <div className={prefixCls}>
+    <div className={`${prefixCls}-lang`}>{lang}</div>
 
 
-  if (!content) return null;
-  if (lang === 'mermaid') {
-    return (
-      <Mermaid content={content} width={"50%"} />
-    );
-  }
-  if (supportedLanguages.indexOf(lang) === -1) return <pre><code>{content}</code></pre>;
-
-  return <div className={styles.container}>
-    <div className={styles.header}>
-      <div className={styles.lang}>{lang}</div>
-      {
-        copied ? <SparkTrueLine className={styles.copied} /> : <SparkCopyLine className={styles.icon} onClick={() => {
-          navigator.clipboard.writeText(content);
-          setCopied(true);
-          setTimeout(() => {
-            setCopied(false);
-          }, 1000);
-        }} />
-      }
-    </div>
-    <Code value={content} language={lang} theme={isDarkMode ? 'dark' : 'light'} readOnly={true}></Code>
+    {
+      copied ? <SparkTrueLine className={`${prefixCls}-copied`} /> : <SparkCopyLine className={`${prefixCls}-icon`} onClick={() => {
+        navigator.clipboard.writeText(content);
+        setCopied(true);
+        setTimeout(() => {
+          setCopied(false);
+        }, 1000);
+      }} />
+    }
   </div>
-};
 
-const useStyles = createStyles(({ css, token }) => ({
-  copied: css`
-    color: ${token.colorSuccess};
-    cursor: pointer;
-    font-size: 16px;
-  `,
-  container: css`
-    border: 1px solid ${token.colorBorderSecondary};
-    border-radius: 6px;
-    overflow: hidden;
-    font-size: 0.8571428571428571em;
-    margin: 1em 0;
-  `,
-  header: css`
-    display: flex;
-    justify-content: space-between;
-    background: ${token.colorFillSecondary};
-    height: 28px;
-    line-height: 28px;
-    border-radius: 4px 4px 0 0;
-    align-items: center;
-    user-select: none;
-    position: relative;
-    padding: 0 12px;
-  `,
-  icon: css`
-    fontsize: 16px;
-    cursor: pointer;
-  `,
-  lang: {
-    textTransform: 'capitalize'
-  }
-}));
 
-export default CodeBlock;
+}
+
+
+export default Code;

package/components/Markdown/demo/basic.tsx

@@ -65,6 +65,10 @@ ___这是粗斜体文本___
 ---
 \`hello world\`
 
+\`\`\`
+## title
+\`\`\`
+
 \`\`\`java
 class HelloWorld {
     public static void main(String[] args) {

package/components/Markdown/styles.ts

@@ -35,12 +35,49 @@ export default createGlobalStyle`
     border: none;
   }
 
-  pre {
-    background-color: ${(p) => p.theme.colorFillQuaternary};
-    padding: 4px 10px;
+  .${(p) => p.theme.prefixCls}-mermaid,
+  .${(p) => p.theme.prefixCls}-codeHighlighter {
     border: 1px solid ${(p) => p.theme.colorBorderSecondary};
+    border-radius: ${(p) => p.theme.borderRadiusSM}px;
+    
+  }
+
+  .${(p) => p.theme.prefixCls}-mermaid-graph,
+  .${(p) => p.theme.prefixCls}-codeHighlighter-code {
+    border: none;
+  }
+
+
+  .${(p) => p.theme.prefixCls}-code-header {
+    display: flex;
+    justify-content: space-between;
+    background: ${(p) => p.theme.colorFillSecondary};
+    border-bottom: 1px solid ${(p) => p.theme.colorBorderSecondary};
+    height: 28px;
+    line-height: 28px;
+    align-items: center;
+    user-select: none;
+    position: relative;
+    padding: 0 12px;
+
+    &-lang {
+      font-weight: bold;
+    }
+
+    &-icon {
+      font-size: 16px;
+      cursor: pointer;
+    }
+
+    &-copied {
+      color: ${(p) => p.theme.colorSuccess};
+      cursor: pointer;
+      font-size: 16px;
+    }
   }
 
+
+
   h1,
   h2,
   h3,
@@ -166,7 +203,7 @@ export default createGlobalStyle`
 }
 
 
-.${p => p.theme.prefixCls}-markdown-footnote {
+.${(p) => p.theme.prefixCls}-markdown-footnote {
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -175,17 +212,17 @@ export default createGlobalStyle`
   height: 16px;
   margin-inline: 2px;
   font-size: 10px;
-  color: ${p => p.theme.colorTextSecondary};
+  color: ${(p) => p.theme.colorTextSecondary};
   text-align: center;
-  background: ${p => p.theme.colorFillSecondary};
+  background: ${(p) => p.theme.colorFillSecondary};
   border-radius: 4px;
-  transition: all 100ms ${p => p.theme.motionEaseOut};
+  transition: all 100ms ${(p) => p.theme.motionEaseOut};
   cursor: pointer;
   line-height: 1;
 
   &:hover {
-    color: ${p => p.theme.colorWhite};
-    background: ${p => p.theme.colorPrimary};
+    color: ${(p) => p.theme.colorWhite};
+    background: ${(p) => p.theme.colorPrimary};
   }
 }
 `;

package/lib/Markdown/Markdown.js

@@ -69,7 +69,7 @@ export default /*#__PURE__*/memo(function (props) {
     CitationComponent = _useCitationsData.CitationComponent;
   var components = useMemo(function () {
     return _objectSpread({
-      pre: CodeBlock,
+      code: CodeBlock,
       style: Null,
       script: Null,
       img: props.disableImage ? DisabledImage : Media,

package/lib/Markdown/core/components/CodeBlock.d.ts

@@ -1,7 +1,4 @@
-import type { FC } from 'react';
-interface CodeBlockProps {
-    children: any;
-    enableMermaid?: boolean;
-}
-declare const CodeBlock: FC<CodeBlockProps>;
-export default CodeBlock;
+/// <reference types="react" />
+import { type ComponentProps } from '@ant-design/x-markdown';
+declare const Code: React.FC<ComponentProps>;
+export default Code;

package/lib/Markdown/core/components/CodeBlock.js

@@ -1,113 +1,66 @@
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 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, { useMemo, useState } from 'react';
-import { CodeBlock as Code, CodeBlockLangExtensionsMap } from '@agentscope-ai/design';
-import { createStyles } from 'antd-style';
-import { useProviderContext, Mermaid } from "../../..";
-import { theme as AntdTheme } from 'antd';
+import { CodeHighlighter, Mermaid } from '@ant-design/x';
+import { useProviderContext } from "../../..";
+import { useState } from 'react';
 import { SparkCopyLine, SparkTrueLine } from '@agentscope-ai/icons';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-var supportedLanguages = Object.keys(CodeBlockLangExtensionsMap);
-var countLines = function countLines(str) {
-  if (!str) return 1;
-  var regex = /\n/g;
-  var matches = str.match(regex);
-  return matches ? matches.length : 1;
-};
-var useCode = function useCode(raw) {
-  if (!raw) return {};
-  var _raw$props = raw.props,
-    children = _raw$props.children,
-    className = _raw$props.className;
-  if (!children) return {};
-  var content = Array.isArray(children) ? children[0] : children;
-  var lang = (className === null || className === void 0 ? void 0 : className.replace('language-', '')) || 'txt';
-  var isSingleLine = countLines(content) <= 1 && content.length <= 32;
-  return {
-    content: content,
-    isSingleLine: isSingleLine,
-    lang: lang
-  };
-};
-var CodeBlock = function CodeBlock(_ref) {
-  var children = _ref.children,
-    enableMermaid = _ref.enableMermaid;
-  var code = useCode(children);
-  var _useStyles = useStyles(),
-    styles = _useStyles.styles,
-    cx = _useStyles.cx;
-  var _useProviderContext = useProviderContext(),
-    getPrefixCls = _useProviderContext.getPrefixCls,
-    theme = _useProviderContext.theme;
-  var isDarkMode = (theme === null || theme === void 0 ? void 0 : theme.algorithm) === AntdTheme.darkAlgorithm;
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    copied = _useState2[0],
-    setCopied = _useState2[1];
-  var _code$content = code.content,
-    _content = _code$content === void 0 ? '' : _code$content,
-    _code$lang = code.lang,
-    lang = _code$lang === void 0 ? '' : _code$lang;
-  var content = useMemo(function () {
-    return _content.replace(/ :(dot|underline):/g, '');
-  }, [_content]);
-  if (!content) return null;
+var Code = function Code(props) {
+  var _className$match;
+  var className = props.className,
+    children = props.children;
+  var lang = (className === null || className === void 0 || (_className$match = className.match(/language-(\w+)/)) === null || _className$match === void 0 ? void 0 : _className$match[1]) || '';
+  if (typeof children !== 'string') return null;
   if (lang === 'mermaid') {
     return /*#__PURE__*/_jsx(Mermaid, {
-      content: content,
-      width: "50%"
+      header: /*#__PURE__*/_jsx(CodeHeader, {
+        lang: "mermaid",
+        content: children
+      }),
+      children: children
     });
   }
-  if (supportedLanguages.indexOf(lang) === -1) return /*#__PURE__*/_jsx("pre", {
-    children: /*#__PURE__*/_jsx("code", {
-      children: content
-    })
+  return /*#__PURE__*/_jsx(CodeHighlighter, {
+    lang: lang,
+    header: /*#__PURE__*/_jsx(CodeHeader, {
+      lang: lang,
+      content: children
+    }),
+    children: children
   });
+};
+function CodeHeader(_ref) {
+  var lang = _ref.lang,
+    content = _ref.content;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    copied = _useState2[0],
+    setCopied = _useState2[1];
+  var _useProviderContext = useProviderContext(),
+    getPrefixCls = _useProviderContext.getPrefixCls;
+  var prefixCls = getPrefixCls('code-header');
   return /*#__PURE__*/_jsxs("div", {
-    className: styles.container,
-    children: [/*#__PURE__*/_jsxs("div", {
-      className: styles.header,
-      children: [/*#__PURE__*/_jsx("div", {
-        className: styles.lang,
-        children: lang
-      }), copied ? /*#__PURE__*/_jsx(SparkTrueLine, {
-        className: styles.copied
-      }) : /*#__PURE__*/_jsx(SparkCopyLine, {
-        className: styles.icon,
-        onClick: function onClick() {
-          navigator.clipboard.writeText(content);
-          setCopied(true);
-          setTimeout(function () {
-            setCopied(false);
-          }, 1000);
-        }
-      })]
-    }), /*#__PURE__*/_jsx(Code, {
-      value: content,
-      language: lang,
-      theme: isDarkMode ? 'dark' : 'light',
-      readOnly: true
+    className: prefixCls,
+    children: [/*#__PURE__*/_jsx("div", {
+      className: "".concat(prefixCls, "-lang"),
+      children: lang
+    }), copied ? /*#__PURE__*/_jsx(SparkTrueLine, {
+      className: "".concat(prefixCls, "-copied")
+    }) : /*#__PURE__*/_jsx(SparkCopyLine, {
+      className: "".concat(prefixCls, "-icon"),
+      onClick: function onClick() {
+        navigator.clipboard.writeText(content);
+        setCopied(true);
+        setTimeout(function () {
+          setCopied(false);
+        }, 1000);
+      }
     })]
   });
-};
-var useStyles = createStyles(function (_ref2) {
-  var css = _ref2.css,
-    token = _ref2.token;
-  return {
-    copied: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    color: ", ";\n    cursor: pointer;\n    font-size: 16px;\n  "])), token.colorSuccess),
-    container: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    border: 1px solid ", ";\n    border-radius: 6px;\n    overflow: hidden;\n    font-size: 0.8571428571428571em;\n    margin: 1em 0;\n  "])), token.colorBorderSecondary),
-    header: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    display: flex;\n    justify-content: space-between;\n    background: ", ";\n    height: 28px;\n    line-height: 28px;\n    border-radius: 4px 4px 0 0;\n    align-items: center;\n    user-select: none;\n    position: relative;\n    padding: 0 12px;\n  "])), token.colorFillSecondary),
-    icon: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    fontsize: 16px;\n    cursor: pointer;\n  "]))),
-    lang: {
-      textTransform: 'capitalize'
-    }
-  };
-});
-export default CodeBlock;
+}
+export default Code;

package/lib/Markdown/styles.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.", "-markdown {\n  color: inherit;\n  max-width: 100%;\n\n  blockquote {\n    padding-inline: 0.6em 0;\n    padding-block: 0;\n    margin: 1em 0;\n    border-inline-start: 4px solid ", ";\n    opacity: 0.85;\n  }\n\n  figure {\n    margin: 0;\n  }\n\n  code {\n    font-size: 0.8571428571428571em;\n    border: 0;\n    margin: 0;\n    background-color: ", ";\n    color: ", ";\n    border-radius: ", "px;\n    padding: 2px 6px;\n    margin-inline: 3px;\n    border: 1px solid ", ";\n  }\n\n  pre code {\n    font-size: 0.8571428571428571em;\n    background-color: transparent;\n    border: none;\n  }\n\n  pre {\n    background-color: ", ";\n    padding: 4px 10px;\n    border: 1px solid ", ";\n  }\n\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    margin-top: 0.5714285714285714em;\n    margin-bottom: 0.5714285714285714em;\n    font-weight: 500;\n    line-height: 1.7777;\n    color: inherit;\n  }\n\n  p {\n    margin-bottom: 0.5714285714285714em;\n  }\n\n  h1 {\n    font-size: 1.2857142857142858em;\n  }\n\n  h2 {\n    font-size: 1.1428571428571428em;\n  }\n\n  h3 {\n    font-size: 1em;\n  }\n\n  h4 {\n    font-size: 1em;\n  }\n\n  h5 {\n    font-size: 1em;\n  }\n\n  h6 {\n    font-size: 1em;\n  }\n\n  hr {\n    border-color: ", ";\n    border-style: solid;\n    border-width: 1px 0 0 0;\n    margin: 1em 0;\n  }\n\n  table {\n    border-collapse: collapse;\n    display: block;\n    width: max-content;\n    max-width: 100%;\n    overflow: auto;\n  }\n\n  table th {\n    background: ", ";\n    text-align: left;\n  }\n\n  table td,\n  table th {\n    padding: 0.75em 1.5em;\n    border: 1px solid ", ";\n    white-space: pre;\n  }\n\n  .", "-image {\n    max-width: 480px;\n    overflow: hidden;\n  }\n\n  .", "-markdown-video {\n    position: relative;\n    \n    &-poster {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      max-width: 480px;\n      background-color: #000;\n      border-radius: 8px;\n      padding: 100px 0;\n      cursor: pointer;\n    }\n\n    &-play {\n      color: #ccc;\n      font-size: 30px;\n    }\n  }\n}\n\n.", "-markdown.x-markdown {\n  img {\n    margin: 0;\n  }\n}\n\n\n.", "-markdown  > *:last-child {\n  margin-bottom: 0 !important;\n}\n\n.", "-markdown  > *:first-child {\n  margin-top: 0 !important;\n}\n\n.", "-markdown-footnotes {\n  > h2 {\n    display: none;\n  }\n\n  > ol {\n    margin: 0 0 0 1em;\n  }\n\n  [data-footnote-backref] {\n    display: none;\n  }\n\n}\n\n\n.", "-markdown-footnote {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  min-width: 16px;\n  padding: 0 4px;\n  height: 16px;\n  margin-inline: 2px;\n  font-size: 10px;\n  color: ", ";\n  text-align: center;\n  background: ", ";\n  border-radius: 4px;\n  transition: all 100ms ", ";\n  cursor: pointer;\n  line-height: 1;\n\n  &:hover {\n    color: ", ";\n    background: ", ";\n  }\n}\n"])), function (p) {
+export default createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-markdown {\n  color: inherit;\n  max-width: 100%;\n\n  blockquote {\n    padding-inline: 0.6em 0;\n    padding-block: 0;\n    margin: 1em 0;\n    border-inline-start: 4px solid ", ";\n    opacity: 0.85;\n  }\n\n  figure {\n    margin: 0;\n  }\n\n  code {\n    font-size: 0.8571428571428571em;\n    border: 0;\n    margin: 0;\n    background-color: ", ";\n    color: ", ";\n    border-radius: ", "px;\n    padding: 2px 6px;\n    margin-inline: 3px;\n    border: 1px solid ", ";\n  }\n\n  pre code {\n    font-size: 0.8571428571428571em;\n    background-color: transparent;\n    border: none;\n  }\n\n  .", "-mermaid,\n  .", "-codeHighlighter {\n    border: 1px solid ", ";\n    border-radius: ", "px;\n    \n  }\n\n  .", "-mermaid-graph,\n  .", "-codeHighlighter-code {\n    border: none;\n  }\n\n\n  .", "-code-header {\n    display: flex;\n    justify-content: space-between;\n    background: ", ";\n    border-bottom: 1px solid ", ";\n    height: 28px;\n    line-height: 28px;\n    align-items: center;\n    user-select: none;\n    position: relative;\n    padding: 0 12px;\n\n    &-lang {\n      font-weight: bold;\n    }\n\n    &-icon {\n      font-size: 16px;\n      cursor: pointer;\n    }\n\n    &-copied {\n      color: ", ";\n      cursor: pointer;\n      font-size: 16px;\n    }\n  }\n\n\n\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    margin-top: 0.5714285714285714em;\n    margin-bottom: 0.5714285714285714em;\n    font-weight: 500;\n    line-height: 1.7777;\n    color: inherit;\n  }\n\n  p {\n    margin-bottom: 0.5714285714285714em;\n  }\n\n  h1 {\n    font-size: 1.2857142857142858em;\n  }\n\n  h2 {\n    font-size: 1.1428571428571428em;\n  }\n\n  h3 {\n    font-size: 1em;\n  }\n\n  h4 {\n    font-size: 1em;\n  }\n\n  h5 {\n    font-size: 1em;\n  }\n\n  h6 {\n    font-size: 1em;\n  }\n\n  hr {\n    border-color: ", ";\n    border-style: solid;\n    border-width: 1px 0 0 0;\n    margin: 1em 0;\n  }\n\n  table {\n    border-collapse: collapse;\n    display: block;\n    width: max-content;\n    max-width: 100%;\n    overflow: auto;\n  }\n\n  table th {\n    background: ", ";\n    text-align: left;\n  }\n\n  table td,\n  table th {\n    padding: 0.75em 1.5em;\n    border: 1px solid ", ";\n    white-space: pre;\n  }\n\n  .", "-image {\n    max-width: 480px;\n    overflow: hidden;\n  }\n\n  .", "-markdown-video {\n    position: relative;\n    \n    &-poster {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      max-width: 480px;\n      background-color: #000;\n      border-radius: 8px;\n      padding: 100px 0;\n      cursor: pointer;\n    }\n\n    &-play {\n      color: #ccc;\n      font-size: 30px;\n    }\n  }\n}\n\n.", "-markdown.x-markdown {\n  img {\n    margin: 0;\n  }\n}\n\n\n.", "-markdown  > *:last-child {\n  margin-bottom: 0 !important;\n}\n\n.", "-markdown  > *:first-child {\n  margin-top: 0 !important;\n}\n\n.", "-markdown-footnotes {\n  > h2 {\n    display: none;\n  }\n\n  > ol {\n    margin: 0 0 0 1em;\n  }\n\n  [data-footnote-backref] {\n    display: none;\n  }\n\n}\n\n\n.", "-markdown-footnote {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  min-width: 16px;\n  padding: 0 4px;\n  height: 16px;\n  margin-inline: 2px;\n  font-size: 10px;\n  color: ", ";\n  text-align: center;\n  background: ", ";\n  border-radius: 4px;\n  transition: all 100ms ", ";\n  cursor: pointer;\n  line-height: 1;\n\n  &:hover {\n    color: ", ";\n    background: ", ";\n  }\n}\n"])), function (p) {
   return p.theme.prefixCls;
 }, function (p) {
   return p.theme.colorBorder;
@@ -14,9 +14,25 @@ export default createGlobalStyle(_templateObject || (_templateObject = _taggedTe
 }, function (p) {
   return p.theme.colorBorderSecondary;
 }, function (p) {
-  return p.theme.colorFillQuaternary;
+  return p.theme.prefixCls;
+}, function (p) {
+  return p.theme.prefixCls;
 }, function (p) {
   return p.theme.colorBorderSecondary;
+}, function (p) {
+  return p.theme.borderRadiusSM;
+}, function (p) {
+  return p.theme.prefixCls;
+}, function (p) {
+  return p.theme.prefixCls;
+}, function (p) {
+  return p.theme.prefixCls;
+}, function (p) {
+  return p.theme.colorFillSecondary;
+}, function (p) {
+  return p.theme.colorBorderSecondary;
+}, function (p) {
+  return p.theme.colorSuccess;
 }, function (p) {
   return p.theme.colorBorderSecondary;
 }, function (p) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agentscope-ai/chat",
-  "version": "1.1.46-beta.1768191317759",
+  "version": "1.1.46",
   "description": "a free and open-source chat framework for building excellent LLM-powered chat experiences",
   "license": "Apache-2.0",
   "sideEffects": [
@@ -64,6 +64,7 @@
     "@ant-design/cssinjs-utils": "^1.1.3",
     "@ant-design/graphs": "^2.1.1",
     "@ant-design/icons": "^5.0.1",
+    "@ant-design/x": "^2.1.3",
     "@ant-design/x-markdown": "^2.1.1",
     "ahooks": "^3.8.4",
     "antd-style": "^3.7.1",