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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -57,7 +57,7 @@ export default memo(function (props: MarkdownProps) {
57
57
  } = useCitationsData({ citations: props.citations, citationsMap: props.citationsMap });
58
58
 
59
59
  const components = useMemo(() => ({
60
- pre: CodeBlock,
60
+ code: CodeBlock,
61
61
  style: Null,
62
62
  script: Null,
63
63
  img: props.disableImage ? DisabledImage : Media,
@@ -67,12 +67,9 @@ export default memo(function (props: MarkdownProps) {
67
67
  ...props.components,
68
68
  }), [props.disableImage, CitationComponent, props.components]);
69
69
 
70
- const dompurifyConfig = useMemo(() =>
71
- allowHtml ? {
72
- ADD_TAGS: ['custom-cursor', 'citation']
73
- } : EMPTY_DOMPURIFY_CONFIG
74
- , [allowHtml]);
75
-
70
+ const dompurifyConfig = useMemo(() => ({
71
+ ADD_TAGS: ['custom-cursor', 'citation']
72
+ }), []);
76
73
 
77
74
  // 使用 useMemo 缓存 extensions 配置
78
75
  const { extensions, walkTokens } = useMemo(() => {
@@ -91,7 +88,16 @@ export default memo(function (props: MarkdownProps) {
91
88
  const config = useMemo(() => ({
92
89
  extensions,
93
90
  walkTokens,
94
- }), [extensions]);
91
+ // 当 allowHtml 为 false 时,转义 HTML 标签使其显示为字符串
92
+ ...(!allowHtml && {
93
+ renderer: {
94
+ html(token: { text?: string; raw?: string }) {
95
+ const text = token.text || token.raw || '';
96
+ return text.replace(/</g, '&lt;').replace(/>/g, '&gt;');
97
+ }
98
+ }
99
+ })
100
+ }), [extensions, allowHtml]);
95
101
 
96
102
  const fallback = <Raw content={content || ''} baseFontSize={baseFontSize} baseLineHeight={baseLineHeight} />;
97
103
 
@@ -1,114 +1,45 @@
1
- import React, { useMemo, useState } from 'react';
2
- import type { FC } from 'react';
3
- import { CodeBlock as Code, CodeBlockLangExtensionsMap, } from '@agentscope-ai/design';
4
- import { createStyles } from 'antd-style';
5
- import { useProviderContext, Mermaid } from '@agentscope-ai/chat';
6
- import { theme as AntdTheme } from 'antd'
1
+ import { Bubble, CodeHighlighter, Mermaid } from '@ant-design/x';
2
+ import { type ComponentProps } from '@ant-design/x-markdown';
3
+ import { useProviderContext } from "@agentscope-ai/chat";
4
+ import { useState } from 'react';
7
5
  import { SparkCopyLine, SparkTrueLine } from '@agentscope-ai/icons';
8
6
 
9
- const supportedLanguages = Object.keys(CodeBlockLangExtensionsMap);
10
7
 
11
- const countLines = (str: string): number => {
12
- if (!str) return 1;
13
- const regex = /\n/g;
14
- const matches = str.match(regex);
15
- return matches ? matches.length : 1;
16
- };
17
-
18
- const useCode = (raw: any) => {
19
- if (!raw) return {};
20
-
21
- const { children, className } = raw.props;
22
-
23
- if (!children) return {};
8
+ const Code: React.FC<ComponentProps> = (props) => {
9
+ const { className, children } = props;
10
+ const lang = className?.match(/language-(\w+)/)?.[1] || '';
24
11
 
25
- const content = Array.isArray(children) ? (children[0] as string) : children;
26
- const lang = className?.replace('language-', '') || 'txt';
27
- const isSingleLine = countLines(content) <= 1 && content.length <= 32;
28
-
29
- return {
30
- content,
31
- isSingleLine,
32
- lang,
33
- };
12
+ if (typeof children !== 'string') return null;
13
+ if (lang === 'mermaid') {
14
+ return <Mermaid header={<CodeHeader lang='mermaid' content={children} />}>{children}</Mermaid>;
15
+ }
16
+ return <CodeHighlighter lang={lang} header={<CodeHeader lang={lang} content={children} />}>{children}</CodeHighlighter>;
34
17
  };
35
18
 
36
- interface CodeBlockProps {
37
- children: any;
38
- enableMermaid?: boolean;
39
- }
40
19
 
41
- const CodeBlock: FC<CodeBlockProps> = ({ children, enableMermaid }) => {
42
- const code = useCode(children);
43
- const { styles, cx } = useStyles();
44
- const { getPrefixCls, theme } = useProviderContext();
45
- const isDarkMode = theme?.algorithm === AntdTheme.darkAlgorithm;
20
+ function CodeHeader({ lang, content }: { lang: string, content: string }) {
46
21
  const [copied, setCopied] = useState(false);
22
+ const { getPrefixCls } = useProviderContext();
23
+ const prefixCls = getPrefixCls('code-header');
47
24
 
48
25
 
49
- const { content: _content = '', lang = '' } = code;
50
- const content = useMemo(() => {
51
- return _content.replace(/ :(dot|underline):/g, '');
52
- }, [_content])
26
+ return <div className={prefixCls}>
27
+ <div className={`${prefixCls}-lang`}>{lang}</div>
53
28
 
54
29
 
55
- if (!content) return null;
56
- if (lang === 'mermaid') {
57
- return (
58
- <Mermaid content={content} width={"50%"} />
59
- );
60
- }
61
- if (supportedLanguages.indexOf(lang) === -1) return <pre><code>{content}</code></pre>;
62
-
63
- return <div className={styles.container}>
64
- <div className={styles.header}>
65
- <div className={styles.lang}>{lang}</div>
66
- {
67
- copied ? <SparkTrueLine className={styles.copied} /> : <SparkCopyLine className={styles.icon} onClick={() => {
68
- navigator.clipboard.writeText(content);
69
- setCopied(true);
70
- setTimeout(() => {
71
- setCopied(false);
72
- }, 1000);
73
- }} />
74
- }
75
- </div>
76
- <Code value={content} language={lang} theme={isDarkMode ? 'dark' : 'light'} readOnly={true}></Code>
30
+ {
31
+ copied ? <SparkTrueLine className={`${prefixCls}-copied`} /> : <SparkCopyLine className={`${prefixCls}-icon`} onClick={() => {
32
+ navigator.clipboard.writeText(content);
33
+ setCopied(true);
34
+ setTimeout(() => {
35
+ setCopied(false);
36
+ }, 1000);
37
+ }} />
38
+ }
77
39
  </div>
78
- };
79
40
 
80
- const useStyles = createStyles(({ css, token }) => ({
81
- copied: css`
82
- color: ${token.colorSuccess};
83
- cursor: pointer;
84
- font-size: 16px;
85
- `,
86
- container: css`
87
- border: 1px solid ${token.colorBorderSecondary};
88
- border-radius: 6px;
89
- overflow: hidden;
90
- font-size: 0.8571428571428571em;
91
- margin: 1em 0;
92
- `,
93
- header: css`
94
- display: flex;
95
- justify-content: space-between;
96
- background: ${token.colorFillSecondary};
97
- height: 28px;
98
- line-height: 28px;
99
- border-radius: 4px 4px 0 0;
100
- align-items: center;
101
- user-select: none;
102
- position: relative;
103
- padding: 0 12px;
104
- `,
105
- icon: css`
106
- fontsize: 16px;
107
- cursor: pointer;
108
- `,
109
- lang: {
110
- textTransform: 'capitalize'
111
- }
112
- }));
113
41
 
114
- export default CodeBlock;
42
+ }
43
+
44
+
45
+ export default Code;
@@ -11,6 +11,12 @@ const content = `# 这是一个一级标题
11
11
  ##### 这是一个五级标题
12
12
  ###### 这是一个六级标题
13
13
 
14
+ <div>
15
+ ????
16
+ <h1>这是一个标题</h1>
17
+ </div>
18
+
19
+
14
20
  ---
15
21
 
16
22
  这是第一个段落。
@@ -65,6 +71,10 @@ ___这是粗斜体文本___
65
71
  ---
66
72
  \`hello world\`
67
73
 
74
+ \`\`\`
75
+ ## title
76
+ \`\`\`
77
+
68
78
  \`\`\`java
69
79
  class HelloWorld {
70
80
  public static void main(String[] args) {
@@ -102,6 +112,6 @@ export default function () {
102
112
  <Input.TextArea value={value} onChange={(e) => setValue(e.target.value)} autoSize={{ minRows: 30, maxRows: 30 }} />
103
113
  </Modal>
104
114
  </div>
105
- <Markdown content={value} />
115
+ <Markdown content={value} allowHtml={false} disableImage={true} />
106
116
  </>;
107
117
  }
@@ -35,12 +35,49 @@ export default createGlobalStyle`
35
35
  border: none;
36
36
  }
37
37
 
38
- pre {
39
- background-color: ${(p) => p.theme.colorFillQuaternary};
40
- padding: 4px 10px;
38
+ .${(p) => p.theme.prefixCls}-mermaid,
39
+ .${(p) => p.theme.prefixCls}-codeHighlighter {
41
40
  border: 1px solid ${(p) => p.theme.colorBorderSecondary};
41
+ border-radius: ${(p) => p.theme.borderRadiusSM}px;
42
+
43
+ }
44
+
45
+ .${(p) => p.theme.prefixCls}-mermaid-graph,
46
+ .${(p) => p.theme.prefixCls}-codeHighlighter-code {
47
+ border: none;
48
+ }
49
+
50
+
51
+ .${(p) => p.theme.prefixCls}-code-header {
52
+ display: flex;
53
+ justify-content: space-between;
54
+ background: ${(p) => p.theme.colorFillSecondary};
55
+ border-bottom: 1px solid ${(p) => p.theme.colorBorderSecondary};
56
+ height: 28px;
57
+ line-height: 28px;
58
+ align-items: center;
59
+ user-select: none;
60
+ position: relative;
61
+ padding: 0 12px;
62
+
63
+ &-lang {
64
+ font-weight: bold;
65
+ }
66
+
67
+ &-icon {
68
+ font-size: 16px;
69
+ cursor: pointer;
70
+ }
71
+
72
+ &-copied {
73
+ color: ${(p) => p.theme.colorSuccess};
74
+ cursor: pointer;
75
+ font-size: 16px;
76
+ }
42
77
  }
43
78
 
79
+
80
+
44
81
  h1,
45
82
  h2,
46
83
  h3,
@@ -166,7 +203,7 @@ export default createGlobalStyle`
166
203
  }
167
204
 
168
205
 
169
- .${p => p.theme.prefixCls}-markdown-footnote {
206
+ .${(p) => p.theme.prefixCls}-markdown-footnote {
170
207
  display: inline-flex;
171
208
  align-items: center;
172
209
  justify-content: center;
@@ -175,17 +212,17 @@ export default createGlobalStyle`
175
212
  height: 16px;
176
213
  margin-inline: 2px;
177
214
  font-size: 10px;
178
- color: ${p => p.theme.colorTextSecondary};
215
+ color: ${(p) => p.theme.colorTextSecondary};
179
216
  text-align: center;
180
- background: ${p => p.theme.colorFillSecondary};
217
+ background: ${(p) => p.theme.colorFillSecondary};
181
218
  border-radius: 4px;
182
- transition: all 100ms ${p => p.theme.motionEaseOut};
219
+ transition: all 100ms ${(p) => p.theme.motionEaseOut};
183
220
  cursor: pointer;
184
221
  line-height: 1;
185
222
 
186
223
  &:hover {
187
- color: ${p => p.theme.colorWhite};
188
- background: ${p => p.theme.colorPrimary};
224
+ color: ${(p) => p.theme.colorWhite};
225
+ background: ${(p) => p.theme.colorPrimary};
189
226
  }
190
227
  }
191
228
  `;
@@ -69,7 +69,7 @@ export default /*#__PURE__*/memo(function (props) {
69
69
  CitationComponent = _useCitationsData.CitationComponent;
70
70
  var components = useMemo(function () {
71
71
  return _objectSpread({
72
- pre: CodeBlock,
72
+ code: CodeBlock,
73
73
  style: Null,
74
74
  script: Null,
75
75
  img: props.disableImage ? DisabledImage : Media,
@@ -79,10 +79,10 @@ export default /*#__PURE__*/memo(function (props) {
79
79
  }, props.components);
80
80
  }, [props.disableImage, CitationComponent, props.components]);
81
81
  var dompurifyConfig = useMemo(function () {
82
- return allowHtml ? {
82
+ return {
83
83
  ADD_TAGS: ['custom-cursor', 'citation']
84
- } : EMPTY_DOMPURIFY_CONFIG;
85
- }, [allowHtml]);
84
+ };
85
+ }, []);
86
86
 
87
87
  // 使用 useMemo 缓存 extensions 配置
88
88
  var _useMemo = useMemo(function () {
@@ -103,11 +103,18 @@ export default /*#__PURE__*/memo(function (props) {
103
103
 
104
104
  // // 使用 useMemo 缓存 config 对象
105
105
  var config = useMemo(function () {
106
- return {
106
+ return _objectSpread({
107
107
  extensions: extensions,
108
108
  walkTokens: walkTokens
109
- };
110
- }, [extensions]);
109
+ }, !allowHtml && {
110
+ renderer: {
111
+ html: function html(token) {
112
+ var text = token.text || token.raw || '';
113
+ return text.replace(/</g, '&lt;').replace(/>/g, '&gt;');
114
+ }
115
+ }
116
+ });
117
+ }, [extensions, allowHtml]);
111
118
  var fallback = /*#__PURE__*/_jsx(Raw, {
112
119
  content: content || '',
113
120
  baseFontSize: baseFontSize,
@@ -1,7 +1,4 @@
1
- import type { FC } from 'react';
2
- interface CodeBlockProps {
3
- children: any;
4
- enableMermaid?: boolean;
5
- }
6
- declare const CodeBlock: FC<CodeBlockProps>;
7
- export default CodeBlock;
1
+ /// <reference types="react" />
2
+ import { type ComponentProps } from '@ant-design/x-markdown';
3
+ declare const Code: React.FC<ComponentProps>;
4
+ export default Code;
@@ -1,113 +1,66 @@
1
- var _templateObject, _templateObject2, _templateObject3, _templateObject4;
2
- function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
3
1
  function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
4
2
  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."); }
5
3
  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); }
6
4
  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; }
7
5
  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; } }
8
6
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
9
- import React, { useMemo, useState } from 'react';
10
- import { CodeBlock as Code, CodeBlockLangExtensionsMap } from '@agentscope-ai/design';
11
- import { createStyles } from 'antd-style';
12
- import { useProviderContext, Mermaid } from "../../..";
13
- import { theme as AntdTheme } from 'antd';
7
+ import { CodeHighlighter, Mermaid } from '@ant-design/x';
8
+ import { useProviderContext } from "../../..";
9
+ import { useState } from 'react';
14
10
  import { SparkCopyLine, SparkTrueLine } from '@agentscope-ai/icons';
15
11
  import { jsx as _jsx } from "react/jsx-runtime";
16
12
  import { jsxs as _jsxs } from "react/jsx-runtime";
17
- var supportedLanguages = Object.keys(CodeBlockLangExtensionsMap);
18
- var countLines = function countLines(str) {
19
- if (!str) return 1;
20
- var regex = /\n/g;
21
- var matches = str.match(regex);
22
- return matches ? matches.length : 1;
23
- };
24
- var useCode = function useCode(raw) {
25
- if (!raw) return {};
26
- var _raw$props = raw.props,
27
- children = _raw$props.children,
28
- className = _raw$props.className;
29
- if (!children) return {};
30
- var content = Array.isArray(children) ? children[0] : children;
31
- var lang = (className === null || className === void 0 ? void 0 : className.replace('language-', '')) || 'txt';
32
- var isSingleLine = countLines(content) <= 1 && content.length <= 32;
33
- return {
34
- content: content,
35
- isSingleLine: isSingleLine,
36
- lang: lang
37
- };
38
- };
39
- var CodeBlock = function CodeBlock(_ref) {
40
- var children = _ref.children,
41
- enableMermaid = _ref.enableMermaid;
42
- var code = useCode(children);
43
- var _useStyles = useStyles(),
44
- styles = _useStyles.styles,
45
- cx = _useStyles.cx;
46
- var _useProviderContext = useProviderContext(),
47
- getPrefixCls = _useProviderContext.getPrefixCls,
48
- theme = _useProviderContext.theme;
49
- var isDarkMode = (theme === null || theme === void 0 ? void 0 : theme.algorithm) === AntdTheme.darkAlgorithm;
50
- var _useState = useState(false),
51
- _useState2 = _slicedToArray(_useState, 2),
52
- copied = _useState2[0],
53
- setCopied = _useState2[1];
54
- var _code$content = code.content,
55
- _content = _code$content === void 0 ? '' : _code$content,
56
- _code$lang = code.lang,
57
- lang = _code$lang === void 0 ? '' : _code$lang;
58
- var content = useMemo(function () {
59
- return _content.replace(/ :(dot|underline):/g, '');
60
- }, [_content]);
61
- if (!content) return null;
13
+ var Code = function Code(props) {
14
+ var _className$match;
15
+ var className = props.className,
16
+ children = props.children;
17
+ var lang = (className === null || className === void 0 || (_className$match = className.match(/language-(\w+)/)) === null || _className$match === void 0 ? void 0 : _className$match[1]) || '';
18
+ if (typeof children !== 'string') return null;
62
19
  if (lang === 'mermaid') {
63
20
  return /*#__PURE__*/_jsx(Mermaid, {
64
- content: content,
65
- width: "50%"
21
+ header: /*#__PURE__*/_jsx(CodeHeader, {
22
+ lang: "mermaid",
23
+ content: children
24
+ }),
25
+ children: children
66
26
  });
67
27
  }
68
- if (supportedLanguages.indexOf(lang) === -1) return /*#__PURE__*/_jsx("pre", {
69
- children: /*#__PURE__*/_jsx("code", {
70
- children: content
71
- })
28
+ return /*#__PURE__*/_jsx(CodeHighlighter, {
29
+ lang: lang,
30
+ header: /*#__PURE__*/_jsx(CodeHeader, {
31
+ lang: lang,
32
+ content: children
33
+ }),
34
+ children: children
72
35
  });
36
+ };
37
+ function CodeHeader(_ref) {
38
+ var lang = _ref.lang,
39
+ content = _ref.content;
40
+ var _useState = useState(false),
41
+ _useState2 = _slicedToArray(_useState, 2),
42
+ copied = _useState2[0],
43
+ setCopied = _useState2[1];
44
+ var _useProviderContext = useProviderContext(),
45
+ getPrefixCls = _useProviderContext.getPrefixCls;
46
+ var prefixCls = getPrefixCls('code-header');
73
47
  return /*#__PURE__*/_jsxs("div", {
74
- className: styles.container,
75
- children: [/*#__PURE__*/_jsxs("div", {
76
- className: styles.header,
77
- children: [/*#__PURE__*/_jsx("div", {
78
- className: styles.lang,
79
- children: lang
80
- }), copied ? /*#__PURE__*/_jsx(SparkTrueLine, {
81
- className: styles.copied
82
- }) : /*#__PURE__*/_jsx(SparkCopyLine, {
83
- className: styles.icon,
84
- onClick: function onClick() {
85
- navigator.clipboard.writeText(content);
86
- setCopied(true);
87
- setTimeout(function () {
88
- setCopied(false);
89
- }, 1000);
90
- }
91
- })]
92
- }), /*#__PURE__*/_jsx(Code, {
93
- value: content,
94
- language: lang,
95
- theme: isDarkMode ? 'dark' : 'light',
96
- readOnly: true
48
+ className: prefixCls,
49
+ children: [/*#__PURE__*/_jsx("div", {
50
+ className: "".concat(prefixCls, "-lang"),
51
+ children: lang
52
+ }), copied ? /*#__PURE__*/_jsx(SparkTrueLine, {
53
+ className: "".concat(prefixCls, "-copied")
54
+ }) : /*#__PURE__*/_jsx(SparkCopyLine, {
55
+ className: "".concat(prefixCls, "-icon"),
56
+ onClick: function onClick() {
57
+ navigator.clipboard.writeText(content);
58
+ setCopied(true);
59
+ setTimeout(function () {
60
+ setCopied(false);
61
+ }, 1000);
62
+ }
97
63
  })]
98
64
  });
99
- };
100
- var useStyles = createStyles(function (_ref2) {
101
- var css = _ref2.css,
102
- token = _ref2.token;
103
- return {
104
- copied: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n color: ", ";\n cursor: pointer;\n font-size: 16px;\n "])), token.colorSuccess),
105
- 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),
106
- 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),
107
- icon: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n fontsize: 16px;\n cursor: pointer;\n "]))),
108
- lang: {
109
- textTransform: 'capitalize'
110
- }
111
- };
112
- });
113
- export default CodeBlock;
65
+ }
66
+ export default Code;
@@ -1,7 +1,7 @@
1
1
  var _templateObject;
2
2
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
3
3
  import { createGlobalStyle } from 'antd-style';
4
- 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) {
4
+ 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) {
5
5
  return p.theme.prefixCls;
6
6
  }, function (p) {
7
7
  return p.theme.colorBorder;
@@ -14,9 +14,25 @@ export default createGlobalStyle(_templateObject || (_templateObject = _taggedTe
14
14
  }, function (p) {
15
15
  return p.theme.colorBorderSecondary;
16
16
  }, function (p) {
17
- return p.theme.colorFillQuaternary;
17
+ return p.theme.prefixCls;
18
+ }, function (p) {
19
+ return p.theme.prefixCls;
18
20
  }, function (p) {
19
21
  return p.theme.colorBorderSecondary;
22
+ }, function (p) {
23
+ return p.theme.borderRadiusSM;
24
+ }, function (p) {
25
+ return p.theme.prefixCls;
26
+ }, function (p) {
27
+ return p.theme.prefixCls;
28
+ }, function (p) {
29
+ return p.theme.prefixCls;
30
+ }, function (p) {
31
+ return p.theme.colorFillSecondary;
32
+ }, function (p) {
33
+ return p.theme.colorBorderSecondary;
34
+ }, function (p) {
35
+ return p.theme.colorSuccess;
20
36
  }, function (p) {
21
37
  return p.theme.colorBorderSecondary;
22
38
  }, function (p) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@agentscope-ai/chat",
3
- "version": "1.1.46-beta.1768191317759",
3
+ "version": "1.1.46-beta.1768287325682",
4
4
  "description": "a free and open-source chat framework for building excellent LLM-powered chat experiences",
5
5
  "license": "Apache-2.0",
6
6
  "sideEffects": [
@@ -64,6 +64,7 @@
64
64
  "@ant-design/cssinjs-utils": "^1.1.3",
65
65
  "@ant-design/graphs": "^2.1.1",
66
66
  "@ant-design/icons": "^5.0.1",
67
+ "@ant-design/x": "^2.1.3",
67
68
  "@ant-design/x-markdown": "^2.1.1",
68
69
  "ahooks": "^3.8.4",
69
70
  "antd-style": "^3.7.1",