@agentscope-ai/chat 1.1.55 → 1.1.56
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.
- package/components/AgentScopeRuntimeWebUI/core/AgentScopeRuntime/Response/Card.tsx +1 -1
- package/components/Bubble/Bubble.tsx +10 -11
- package/components/Bubble/style/avatar.ts +1 -1
- package/components/Bubble/style/index.ts +1 -1
- package/components/OperateCard/OperateCard.tsx +1 -2
- package/components/OperateCard/preset/ToolCall.tsx +5 -11
- package/components/OperateCard/style.ts +28 -17
- package/lib/AgentScopeRuntimeWebUI/core/AgentScopeRuntime/Response/Card.js +3 -0
- package/lib/Bubble/Bubble.js +10 -10
- package/lib/Bubble/style/avatar.js +1 -1
- package/lib/Bubble/style/index.js +1 -1
- package/lib/OperateCard/OperateCard.d.ts +0 -1
- package/lib/OperateCard/OperateCard.js +1 -1
- package/lib/OperateCard/preset/ToolCall.d.ts +0 -6
- package/lib/OperateCard/preset/ToolCall.js +3 -8
- package/lib/OperateCard/style.js +7 -3
- package/package.json +1 -1
|
@@ -24,7 +24,7 @@ export default function AgentScopeRuntimeResponseCard(props: {
|
|
|
24
24
|
if (!messages?.length && AgentScopeRuntimeResponseBuilder.maybeGenerating(props.data)) return <Bubble.Spin />;
|
|
25
25
|
|
|
26
26
|
return <>
|
|
27
|
-
{avatar && <Flex align="center" gap={8}>
|
|
27
|
+
{avatar && <Flex align="center" gap={8} style={{ marginBottom: 8 }}>
|
|
28
28
|
<Avatar src={avatar} />
|
|
29
29
|
{nick && <span>{nick as string}</span>}
|
|
30
30
|
</Flex>}
|
|
@@ -80,6 +80,16 @@ const Bubble: React.FC<BubbleProps> = (props) => {
|
|
|
80
80
|
style={!isAssistant && contentNode ? { flexDirection: 'column-reverse' } : {}}
|
|
81
81
|
className={`${prefixCls}-content-wrapper`}
|
|
82
82
|
>
|
|
83
|
+
{
|
|
84
|
+
avatar && <Avatar
|
|
85
|
+
avatar={avatar}
|
|
86
|
+
msgStatus={msgStatus}
|
|
87
|
+
isAssistant={isAssistant}
|
|
88
|
+
prefixCls={prefixCls}
|
|
89
|
+
className={classNames.avatar}
|
|
90
|
+
style={styles.avatar}
|
|
91
|
+
/>
|
|
92
|
+
}
|
|
83
93
|
<Cards cards={cards} id={id} isLast={isLast} className={classnames(
|
|
84
94
|
`${prefixCls}-content`,
|
|
85
95
|
`${prefixCls}-content-wrapper-card`,
|
|
@@ -113,17 +123,6 @@ const Bubble: React.FC<BubbleProps> = (props) => {
|
|
|
113
123
|
id={id}
|
|
114
124
|
data-role={role}
|
|
115
125
|
>
|
|
116
|
-
{
|
|
117
|
-
avatar && <Avatar
|
|
118
|
-
avatar={avatar}
|
|
119
|
-
msgStatus={msgStatus}
|
|
120
|
-
isAssistant={isAssistant}
|
|
121
|
-
prefixCls={prefixCls}
|
|
122
|
-
className={classNames.avatar}
|
|
123
|
-
style={styles.avatar}
|
|
124
|
-
/>
|
|
125
|
-
}
|
|
126
|
-
|
|
127
126
|
{fullContent}
|
|
128
127
|
</div>
|
|
129
128
|
</>
|
|
@@ -18,7 +18,6 @@ export interface IOperateCardProps {
|
|
|
18
18
|
icon: React.ReactNode;
|
|
19
19
|
title: React.ReactNode | string;
|
|
20
20
|
description?: React.ReactNode | string;
|
|
21
|
-
simple?: boolean;
|
|
22
21
|
},
|
|
23
22
|
/**
|
|
24
23
|
* @description 内容配置
|
|
@@ -52,7 +51,7 @@ function OperateCard(props: IOperateCardProps) {
|
|
|
52
51
|
return <>
|
|
53
52
|
<Style />
|
|
54
53
|
<div className={classNames(prefixCls, {
|
|
55
|
-
[`${prefixCls}-
|
|
54
|
+
[`${prefixCls}-collapsed`]: open && props.body
|
|
56
55
|
})}>
|
|
57
56
|
<div className={classNames(`${prefixCls}-header`, props.header.className, {
|
|
58
57
|
[`${prefixCls}-header-has-body`]: props.body
|
|
@@ -14,7 +14,7 @@ function Block(props: {
|
|
|
14
14
|
}) {
|
|
15
15
|
const { getPrefixCls } = useProviderContext();
|
|
16
16
|
const prefixCls = getPrefixCls('operate-card');
|
|
17
|
-
const { expandEnabled =
|
|
17
|
+
const { expandEnabled = false, language = 'json' } = props;
|
|
18
18
|
const contentString = typeof props.content === 'string' ? props.content : JSON.stringify(props.content);
|
|
19
19
|
const [copied, setCopied] = useState(false);
|
|
20
20
|
const [expanded, setExpanded] = useState(expandEnabled === true ? false : true);
|
|
@@ -97,19 +97,14 @@ export interface IToolCallProps {
|
|
|
97
97
|
* @default false
|
|
98
98
|
*/
|
|
99
99
|
loading?: boolean;
|
|
100
|
-
|
|
101
|
-
* @description 是否简单模式，该模式下收起态没有背景色，同时子级内容默认展开
|
|
102
|
-
* @descriptionEn Whether is simple mode, the mode is collapsed without background color, and the child content is expanded by default
|
|
103
|
-
* @default false
|
|
104
|
-
*/
|
|
105
|
-
simple?: boolean;
|
|
100
|
+
|
|
106
101
|
outputBlock?: { language?: 'json' | 'text' }
|
|
107
102
|
inputBlock?: { language?: 'json' | 'text' }
|
|
108
103
|
}
|
|
109
104
|
|
|
110
105
|
export default function (props: IToolCallProps) {
|
|
111
106
|
|
|
112
|
-
const { title = 'Call Tool', subTitle, defaultOpen = true, loading = false
|
|
107
|
+
const { title = 'Call Tool', subTitle, defaultOpen = true, loading = false } = props;
|
|
113
108
|
|
|
114
109
|
return <OperateCard
|
|
115
110
|
|
|
@@ -117,14 +112,13 @@ export default function (props: IToolCallProps) {
|
|
|
117
112
|
icon: loading ? <SparkLoadingLine spin /> : <SparkToolLine />,
|
|
118
113
|
title: title,
|
|
119
114
|
description: subTitle,
|
|
120
|
-
simple: simple,
|
|
121
115
|
}}
|
|
122
116
|
|
|
123
117
|
body={{
|
|
124
118
|
defaultOpen: defaultOpen,
|
|
125
119
|
children: <OperateCard.LineBody>
|
|
126
|
-
<Block title="Input" content={props.input}
|
|
127
|
-
<Block title="Output" content={props.output}
|
|
120
|
+
<Block title="Input" content={props.input} language={props.inputBlock?.language} />
|
|
121
|
+
<Block title="Output" content={props.output} language={props.outputBlock?.language} />
|
|
128
122
|
</OperateCard.LineBody>
|
|
129
123
|
}}
|
|
130
124
|
>
|
|
@@ -3,27 +3,24 @@ import { createGlobalStyle } from 'antd-style';
|
|
|
3
3
|
export default createGlobalStyle`
|
|
4
4
|
.${(p) => p.theme.prefixCls}-operate-card {
|
|
5
5
|
width: 100%;
|
|
6
|
-
|
|
7
|
-
&-simple-collapsed {
|
|
8
|
-
width: auto;
|
|
9
|
-
display: inline-flex;
|
|
10
|
-
background-color: transparent;
|
|
11
|
-
|
|
12
|
-
.${(p) => p.theme.prefixCls}-operate-card-header {
|
|
13
|
-
padding: 0;
|
|
14
|
-
height: auto;
|
|
15
|
-
}
|
|
16
|
-
}
|
|
17
6
|
border-radius: ${(p) => p.theme.borderRadiusLG}px;
|
|
18
7
|
overflow: hidden;
|
|
19
|
-
|
|
8
|
+
|
|
9
|
+
&-collapsed {
|
|
10
|
+
background-color: ${(p) => p.theme.colorFillTertiary};
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
&:hover {
|
|
14
|
+
background-color: ${(p) => p.theme.colorFillTertiary};
|
|
15
|
+
}
|
|
20
16
|
|
|
21
17
|
&-header {
|
|
22
18
|
display: flex;
|
|
23
19
|
align-items: center;
|
|
24
20
|
gap: 8px;
|
|
25
21
|
padding: 0 12px;
|
|
26
|
-
height:
|
|
22
|
+
height: 28px;
|
|
23
|
+
line-height: 28px;
|
|
27
24
|
|
|
28
25
|
&-icon {
|
|
29
26
|
font-size: 16px;
|
|
@@ -33,8 +30,7 @@ export default createGlobalStyle`
|
|
|
33
30
|
overflow: hidden;
|
|
34
31
|
text-overflow: ellipsis;
|
|
35
32
|
white-space: nowrap;
|
|
36
|
-
font-size:
|
|
37
|
-
font-weight: 500;
|
|
33
|
+
font-size: 12px;
|
|
38
34
|
color: ${(p) => p.theme.colorText};
|
|
39
35
|
}
|
|
40
36
|
|
|
@@ -47,12 +43,27 @@ export default createGlobalStyle`
|
|
|
47
43
|
}
|
|
48
44
|
|
|
49
45
|
&-arrow {
|
|
50
|
-
|
|
46
|
+
opacity: 0;
|
|
51
47
|
}
|
|
52
48
|
|
|
53
49
|
&-has-body {
|
|
54
50
|
cursor: pointer;
|
|
55
51
|
}
|
|
52
|
+
|
|
53
|
+
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
&-collapsed {
|
|
57
|
+
.${(p) => p.theme.prefixCls}-operate-card-header-arrow {
|
|
58
|
+
opacity: 1;
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
|
|
63
|
+
&:hover {
|
|
64
|
+
.${(p) => p.theme.prefixCls}-operate-card-header-arrow {
|
|
65
|
+
opacity: 1;
|
|
66
|
+
}
|
|
56
67
|
}
|
|
57
68
|
|
|
58
69
|
&-body {
|
|
@@ -73,7 +84,7 @@ export default createGlobalStyle`
|
|
|
73
84
|
|
|
74
85
|
|
|
75
86
|
&-line-body {
|
|
76
|
-
margin: 0 12px
|
|
87
|
+
margin: 0 12px 8px 20px;
|
|
77
88
|
border-left: 1px solid ${(p) => p.theme.colorBorderSecondary};
|
|
78
89
|
}
|
|
79
90
|
|
|
@@ -33,6 +33,9 @@ export default function AgentScopeRuntimeResponseCard(props) {
|
|
|
33
33
|
children: [avatar && /*#__PURE__*/_jsxs(Flex, {
|
|
34
34
|
align: "center",
|
|
35
35
|
gap: 8,
|
|
36
|
+
style: {
|
|
37
|
+
marginBottom: 8
|
|
38
|
+
},
|
|
36
39
|
children: [/*#__PURE__*/_jsx(Avatar, {
|
|
37
40
|
src: avatar
|
|
38
41
|
}), nick && /*#__PURE__*/_jsx("span", {
|
package/lib/Bubble/Bubble.js
CHANGED
|
@@ -59,7 +59,14 @@ var Bubble = function Bubble(props) {
|
|
|
59
59
|
flexDirection: 'column-reverse'
|
|
60
60
|
} : {},
|
|
61
61
|
className: "".concat(prefixCls, "-content-wrapper"),
|
|
62
|
-
children: [/*#__PURE__*/_jsx(
|
|
62
|
+
children: [avatar && /*#__PURE__*/_jsx(Avatar, {
|
|
63
|
+
avatar: avatar,
|
|
64
|
+
msgStatus: msgStatus,
|
|
65
|
+
isAssistant: isAssistant,
|
|
66
|
+
prefixCls: prefixCls,
|
|
67
|
+
className: classNames.avatar,
|
|
68
|
+
style: styles.avatar
|
|
69
|
+
}), /*#__PURE__*/_jsx(Cards, {
|
|
63
70
|
cards: cards,
|
|
64
71
|
id: id,
|
|
65
72
|
isLast: isLast,
|
|
@@ -71,19 +78,12 @@ var Bubble = function Bubble(props) {
|
|
|
71
78
|
})]
|
|
72
79
|
});
|
|
73
80
|
return /*#__PURE__*/_jsxs(_Fragment, {
|
|
74
|
-
children: [/*#__PURE__*/_jsx(Style, {}), /*#__PURE__*/_jsx(AvatarStyle, {}), /*#__PURE__*/
|
|
81
|
+
children: [/*#__PURE__*/_jsx(Style, {}), /*#__PURE__*/_jsx(AvatarStyle, {}), /*#__PURE__*/_jsx("div", {
|
|
75
82
|
style: style,
|
|
76
83
|
className: mergedCls,
|
|
77
84
|
id: id,
|
|
78
85
|
"data-role": role,
|
|
79
|
-
children:
|
|
80
|
-
avatar: avatar,
|
|
81
|
-
msgStatus: msgStatus,
|
|
82
|
-
isAssistant: isAssistant,
|
|
83
|
-
prefixCls: prefixCls,
|
|
84
|
-
className: classNames.avatar,
|
|
85
|
-
style: styles.avatar
|
|
86
|
-
}), fullContent]
|
|
86
|
+
children: fullContent
|
|
87
87
|
})]
|
|
88
88
|
});
|
|
89
89
|
};
|
|
@@ -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.", "-bubble-avatar {\n display: inline-flex;\n justify-content: center;\n align-self: flex-start;\n margin-
|
|
4
|
+
export default createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-bubble-avatar {\n display: inline-flex;\n justify-content: center;\n align-self: flex-start;\n margin-bottom: 8px;\n\n .", "-avatar {\n background-color: ", ";\n position: relative;\n border: 0;\n }\n\n &-loading .", "-avatar::after {\n content: '';\n position: absolute;\n inset: 0px;\n border-radius: inherit;\n padding: 1px;\n background: conic-gradient(\n ", ",\n ", ",\n transparent,\n ", "\n );\n -webkit-mask:\n linear-gradient(#fff 0 0) content-box,\n linear-gradient(#fff 0 0);\n -webkit-mask-composite: xor;\n mask-composite: exclude;\n pointer-events: none;\n z-index: 1;\n animation: avatar-border-spin 1.5s linear infinite;\n }\n\n ~ .", "-bubble-content-wrapper {\n width: 0;\n flex: 1;\n }\n}\n\n@keyframes avatar-border-spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n"])), function (p) {
|
|
5
5
|
return p.theme.prefixCls;
|
|
6
6
|
}, function (p) {
|
|
7
7
|
return p.theme.prefixCls;
|
|
@@ -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.", "-bubble {\n display: flex;\n\n &-end,\n &-user {\n justify-content: flex-end;\n\n .", "-bubble-content-wrapper {\n align-items: flex-end;\n }\n }\n\n &-content-wrapper {\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap:
|
|
4
|
+
export default createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-bubble {\n display: flex;\n\n &-end,\n &-user {\n justify-content: flex-end;\n\n .", "-bubble-content-wrapper {\n align-items: flex-end;\n }\n }\n\n &-content-wrapper {\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 4px;\n }\n\n &-content-wrapper-card {\n }\n\n &-content {\n position: relative;\n box-sizing: border-box;\n min-width: 0;\n max-width: 100%;\n color: ", ";\n font-size: ", "px;\n line-height: ", ";\n word-break: break-word;\n }\n}\n\n.", "-bubble {\n &-content {\n &-filled {\n padding: 12px 16px;\n border-radius: ", "px;\n background-color: ", ";\n }\n }\n}\n\n\n\n.", "-bubble-loading {\n position: relative;\n display: flex;\n align-items: center;\n gap: 4px;\n filter: invert(1) brightness(100%) saturate(0%);\n\n &-text {\n opacity: 0;\n }\n\n &-dot1 {\n width: 4px;\n height: 4px;\n border-radius: 999px;\n background: linear-gradient(\n ", ",\n ", "\n ),\n linear-gradient(\n ", ",\n ", "\n );\n background-blend-mode: multiply;\n animation: dot_01 2.5s infinite ease;\n }\n &-dot2 {\n width: 4px;\n height: 4px;\n border-radius: 999px;\n background: linear-gradient(\n ", ",\n ", "\n ),\n linear-gradient(\n ", ",\n ", "\n );\n background-blend-mode: multiply;\n animation: dot_02 2.5s infinite ease;\n }\n &-dot3 {\n width: 4px;\n height: 4px;\n border-radius: 999px;\n background: linear-gradient(\n ", ",\n ", "\n ),\n linear-gradient(\n ", ",\n ", "\n );\n background-blend-mode: multiply;\n animation: dot_03 2.5s infinite ease;\n }\n}\n\n@keyframes dot_01 {\n 0% {\n transform: translateX(0px) scale(1);\n z-index: 3;\n }\n\n 30.3% {\n transform: translateX(15px) scale(1);\n z-index: 3;\n }\n 33.3% {\n transform: translateX(15px) scale(1);\n z-index: 1;\n }\n 63.6% {\n transform: translateX(7.5px) scale(0.75);\n z-index: 1;\n }\n 66.6% {\n transform: translateX(7.5px) scale(0.75);\n z-index: 2;\n }\n 97% {\n transform: translateX(0px) scale(1);\n z-index: 2;\n }\n}\n\n@keyframes dot_02 {\n 0% {\n transform: translateX(0px) scale(1);\n z-index: 2;\n }\n 23.3% {\n transform: translateX(-7.5px) scale(1.33333);\n z-index: 2;\n }\n\n 30.3% {\n transform: translateX(-7.5px) scale(1.33333);\n z-index: 3;\n }\n 56.6% {\n transform: translateX(7.5px) scale(1.33333);\n z-index: 3;\n }\n 63.6% {\n transform: translateX(7.5px) scale(1.33333);\n z-index: 1;\n }\n 97% {\n transform: translateX(0px) scale(1);\n z-index: 1;\n }\n}\n\n@keyframes dot_03 {\n 0% {\n transform: translateX(0px) scale(1);\n z-index: 1;\n }\n 23.3% {\n transform: translateX(-7.5px) scale(0.75);\n z-index: 1;\n }\n\n 30.3% {\n transform: translateX(-7.5px) scale(0.75);\n z-index: 2;\n }\n 56.6% {\n transform: translateX(-15px) scale(1);\n z-index: 2;\n }\n 63.6% {\n transform: translateX(-15px) scale(1);\n z-index: 3;\n }\n 97% {\n transform: translateX(0px) scale(1);\n z-index: 3;\n }\n}\n"])), function (p) {
|
|
5
5
|
return p.theme.prefixCls;
|
|
6
6
|
}, function (p) {
|
|
7
7
|
return p.theme.prefixCls;
|
|
@@ -39,7 +39,7 @@ function OperateCard(props) {
|
|
|
39
39
|
setOpen = _useState2[1];
|
|
40
40
|
return /*#__PURE__*/_jsxs(_Fragment, {
|
|
41
41
|
children: [/*#__PURE__*/_jsx(Style, {}), /*#__PURE__*/_jsxs("div", {
|
|
42
|
-
className: classNames(prefixCls, _defineProperty({}, "".concat(prefixCls, "-
|
|
42
|
+
className: classNames(prefixCls, _defineProperty({}, "".concat(prefixCls, "-collapsed"), open && props.body)),
|
|
43
43
|
children: [/*#__PURE__*/_jsxs("div", {
|
|
44
44
|
className: classNames("".concat(prefixCls, "-header"), props.header.className, _defineProperty({}, "".concat(prefixCls, "-header-has-body"), props.body)),
|
|
45
45
|
onClick: function onClick() {
|
|
@@ -34,12 +34,6 @@ export interface IToolCallProps {
|
|
|
34
34
|
* @default false
|
|
35
35
|
*/
|
|
36
36
|
loading?: boolean;
|
|
37
|
-
/**
|
|
38
|
-
* @description 是否简单模式，该模式下收起态没有背景色，同时子级内容默认展开
|
|
39
|
-
* @descriptionEn Whether is simple mode, the mode is collapsed without background color, and the child content is expanded by default
|
|
40
|
-
* @default false
|
|
41
|
-
*/
|
|
42
|
-
simple?: boolean;
|
|
43
37
|
outputBlock?: {
|
|
44
38
|
language?: 'json' | 'text';
|
|
45
39
|
};
|
|
@@ -16,7 +16,7 @@ function Block(props) {
|
|
|
16
16
|
getPrefixCls = _useProviderContext.getPrefixCls;
|
|
17
17
|
var prefixCls = getPrefixCls('operate-card');
|
|
18
18
|
var _props$expandEnabled = props.expandEnabled,
|
|
19
|
-
expandEnabled = _props$expandEnabled === void 0 ?
|
|
19
|
+
expandEnabled = _props$expandEnabled === void 0 ? false : _props$expandEnabled,
|
|
20
20
|
_props$language = props.language,
|
|
21
21
|
language = _props$language === void 0 ? 'json' : _props$language;
|
|
22
22
|
var contentString = typeof props.content === 'string' ? props.content : JSON.stringify(props.content);
|
|
@@ -90,17 +90,14 @@ export default function (props) {
|
|
|
90
90
|
_props$defaultOpen = props.defaultOpen,
|
|
91
91
|
defaultOpen = _props$defaultOpen === void 0 ? true : _props$defaultOpen,
|
|
92
92
|
_props$loading = props.loading,
|
|
93
|
-
loading = _props$loading === void 0 ? false : _props$loading
|
|
94
|
-
_props$simple = props.simple,
|
|
95
|
-
simple = _props$simple === void 0 ? false : _props$simple;
|
|
93
|
+
loading = _props$loading === void 0 ? false : _props$loading;
|
|
96
94
|
return /*#__PURE__*/_jsx(OperateCard, {
|
|
97
95
|
header: {
|
|
98
96
|
icon: loading ? /*#__PURE__*/_jsx(SparkLoadingLine, {
|
|
99
97
|
spin: true
|
|
100
98
|
}) : /*#__PURE__*/_jsx(SparkToolLine, {}),
|
|
101
99
|
title: title,
|
|
102
|
-
description: subTitle
|
|
103
|
-
simple: simple
|
|
100
|
+
description: subTitle
|
|
104
101
|
},
|
|
105
102
|
body: {
|
|
106
103
|
defaultOpen: defaultOpen,
|
|
@@ -108,12 +105,10 @@ export default function (props) {
|
|
|
108
105
|
children: [/*#__PURE__*/_jsx(Block, {
|
|
109
106
|
title: "Input",
|
|
110
107
|
content: props.input,
|
|
111
|
-
expandEnabled: !simple,
|
|
112
108
|
language: (_props$inputBlock = props.inputBlock) === null || _props$inputBlock === void 0 ? void 0 : _props$inputBlock.language
|
|
113
109
|
}), /*#__PURE__*/_jsx(Block, {
|
|
114
110
|
title: "Output",
|
|
115
111
|
content: props.output,
|
|
116
|
-
expandEnabled: !simple,
|
|
117
112
|
language: (_props$outputBlock = props.outputBlock) === null || _props$outputBlock === void 0 ? void 0 : _props$outputBlock.language
|
|
118
113
|
})]
|
|
119
114
|
})
|
package/lib/OperateCard/style.js
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
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.", "-operate-card {\n width: 100%;\n
|
|
5
|
-
return p.theme.prefixCls;
|
|
6
|
-
}, function (p) {
|
|
4
|
+
export default createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-operate-card {\n width: 100%;\n border-radius: ", "px;\n overflow: hidden;\n \n &-collapsed {\n background-color: ", ";\n }\n\n &:hover {\n background-color: ", ";\n }\n\n &-header {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 0 12px;\n height: 28px;\n line-height: 28px;\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: 12px;\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 opacity: 0;\n }\n\n &-has-body {\n cursor: pointer;\n }\n\n\n }\n\n &-collapsed {\n .", "-operate-card-header-arrow {\n opacity: 1;\n }\n }\n\n\n &:hover {\n .", "-operate-card-header-arrow {\n opacity: 1;\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 8px 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 border-radius: 8px;\n border: 1px solid ", ";\n overflow: hidden;\n background-color: ", ";\n\n &-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n background: ", ";\n height: 32px;\n padding: 0 12px;\n cursor: pointer;\n user-select: none;\n }\n\n &-title {\n font-size: 14px;\n color: ", ";\n }\n\n &-extra {\n display: inline-flex;\n align-items: center;\n }\n\n &-content {\n max-height: 128px;\n overflow-y: auto;\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 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 &-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-children .", "-operate-card-line-body {\n display: flex;\n flex-direction: column;\n }\n\n &-rag-group-title {\n margin: 16px 0 4px 16px;\n font-size: 12px;\n font-weight: 500;\n color: ", ";\n\n &:first-child {\n margin-top: 8px;\n }\n }\n\n\n &-rag-group-content {\n margin-left: 16px;\n border-radius: 6px;\n font-size: 12px;\n color: ", ";\n display: flex;\n align-items: center;\n cursor: pointer;\n\n &-images {\n gap: 8px;\n }\n }\n\n\n &-rag-item {\n margin-left: 16px;\n border-radius: 6px;\n overflow: hidden;\n margin-bottom: 4px;\n\n\n &-score {\n margin-right: 0;\n\n b {\n font-weight: 500;\n color: ", ";\n }\n }\n\n &-title {\n font-size: 12px;\n color: ", ";\n height: 28px;\n padding: 0 4px 0 12px;\n display: flex;\n align-items: center;\n cursor: pointer;\n background-color: ", ";\n\n &-text {\n flex: 1;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n }\n\n &-content {\n padding: 0 12px 12px 12px;\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) {
|
|
7
5
|
return p.theme.prefixCls;
|
|
8
6
|
}, function (p) {
|
|
9
7
|
return p.theme.borderRadiusLG;
|
|
10
8
|
}, function (p) {
|
|
11
9
|
return p.theme.colorFillTertiary;
|
|
10
|
+
}, function (p) {
|
|
11
|
+
return p.theme.colorFillTertiary;
|
|
12
12
|
}, function (p) {
|
|
13
13
|
return p.theme.colorText;
|
|
14
14
|
}, function (p) {
|
|
@@ -17,6 +17,10 @@ export default createGlobalStyle(_templateObject || (_templateObject = _taggedTe
|
|
|
17
17
|
return p.theme.prefixCls;
|
|
18
18
|
}, function (p) {
|
|
19
19
|
return p.theme.prefixCls;
|
|
20
|
+
}, function (p) {
|
|
21
|
+
return p.theme.prefixCls;
|
|
22
|
+
}, function (p) {
|
|
23
|
+
return p.theme.prefixCls;
|
|
20
24
|
}, function (p) {
|
|
21
25
|
return p.theme.colorBorderSecondary;
|
|
22
26
|
}, function (p) {
|