@ant-design/agentic-ui 2.30.30 → 2.30.31
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/dist/Bubble/AIBubble.js +6 -3
- package/dist/Bubble/List/PureBubbleList.js +22 -1
- package/dist/Bubble/List/index.js +7 -5
- package/dist/Bubble/MessagesContent/BubbleExtra.js +4 -2
- package/dist/Components/ActionIconBox/index.js +8 -8
- package/dist/Hooks/useLanguage.d.ts +1 -0
- package/dist/I18n/locales.d.ts +1 -0
- package/dist/I18n/locales.js +2 -0
- package/dist/MarkdownEditor/editor/parser/parse/parseHtml.js +15 -6
- package/dist/MarkdownEditor/style.js +0 -4
- package/dist/MarkdownInputField/SendButton/index.d.ts +2 -2
- package/dist/MarkdownInputField/SendButton/index.js +44 -26
- package/dist/MarkdownInputField/SendButton/sendButtonPalette.d.ts +36 -0
- package/dist/MarkdownInputField/SendButton/sendButtonPalette.js +247 -0
- package/dist/MarkdownInputField/SendButton/style.js +3 -3
- package/dist/MarkdownInputField/style.js +3 -1
- package/dist/MarkdownRenderer/AnimationText.js +1 -2
- package/dist/MarkdownRenderer/CharacterQueue.js +3 -0
- package/dist/MarkdownRenderer/MarkdownRenderer.js +5 -18
- package/dist/MarkdownRenderer/markdownReactShared.d.ts +2 -1
- package/dist/MarkdownRenderer/markdownReactShared.js +57 -19
- package/dist/MarkdownRenderer/streaming/MarkdownBlockPiece.js +14 -10
- package/dist/MarkdownRenderer/streaming/fenceTracker.d.ts +7 -0
- package/dist/MarkdownRenderer/streaming/fenceTracker.js +28 -0
- package/dist/MarkdownRenderer/streaming/lastBlockThrottle.js +3 -1
- package/dist/MarkdownRenderer/streaming/useShallowMemo.d.ts +1 -0
- package/dist/MarkdownRenderer/streaming/useShallowMemo.js +36 -0
- package/dist/MarkdownRenderer/streaming/useStreamingMarkdownReact.js +6 -3
- package/dist/MarkdownRenderer/useStreaming.js +43 -41
- package/dist/Plugins/chart/components/ChartContainer/ChartErrorBoundary.d.ts +2 -0
- package/dist/TaskList/TaskList.js +25 -13
- package/dist/TaskList/constants.d.ts +1 -1
- package/dist/TaskList/constants.js +9 -4
- package/dist/TaskList/style.js +29 -11
- package/dist/ToolUseBarThink/index.d.ts +0 -23
- package/dist/ToolUseBarThink/index.js +178 -315
- package/dist/ToolUseBarThink/style.js +64 -48
- package/dist/Types/quicklink.d.ts +1 -1
- package/dist/Workspace/File/FileTree/FileTreeComponent.d.ts +4 -0
- package/dist/Workspace/File/FileTree/FileTreeComponent.js +283 -0
- package/dist/Workspace/File/FileTree/index.d.ts +2 -0
- package/dist/Workspace/File/FileTree/index.js +1 -0
- package/dist/Workspace/File/FileTree/style.d.ts +8 -0
- package/dist/Workspace/File/FileTree/style.js +80 -0
- package/dist/Workspace/File/index.d.ts +2 -1
- package/dist/Workspace/File/index.js +1 -0
- package/dist/Workspace/index.d.ts +4 -2
- package/dist/Workspace/index.js +73 -36
- package/dist/Workspace/types.d.ts +70 -2
- package/package.json +2 -1
|
@@ -55,6 +55,24 @@ var LIGHT_MODE_BACKGROUND = 'rgba(255, 255, 255, 0.65)';
|
|
|
55
55
|
var LIGHT_MODE_BACKDROP_FILTER = 'blur(12px)';
|
|
56
56
|
var genStyle = function genStyle(token) {
|
|
57
57
|
return _define_property({}, token.componentCls, {
|
|
58
|
+
'@keyframes thinkSpin': {
|
|
59
|
+
from: {
|
|
60
|
+
'--think-rotate': '0deg'
|
|
61
|
+
},
|
|
62
|
+
to: {
|
|
63
|
+
'--think-rotate': '360deg'
|
|
64
|
+
}
|
|
65
|
+
},
|
|
66
|
+
'@keyframes thinkMaskSweep': {
|
|
67
|
+
'0%': {
|
|
68
|
+
maskPosition: '200% 0',
|
|
69
|
+
WebkitMaskPosition: '200% 0'
|
|
70
|
+
},
|
|
71
|
+
'100%': {
|
|
72
|
+
maskPosition: '-100% 0',
|
|
73
|
+
WebkitMaskPosition: '-100% 0'
|
|
74
|
+
}
|
|
75
|
+
},
|
|
58
76
|
position: 'relative',
|
|
59
77
|
cursor: 'pointer',
|
|
60
78
|
borderRadius: 'var(--radius-card-base)',
|
|
@@ -92,21 +110,6 @@ var genStyle = function genStyle(token) {
|
|
|
92
110
|
boxShadow: 'var(--shadow-border-base)'
|
|
93
111
|
}
|
|
94
112
|
},
|
|
95
|
-
'&-light': {
|
|
96
|
-
boxShadow: 'none',
|
|
97
|
-
border: 'none',
|
|
98
|
-
borderRadius: '14px',
|
|
99
|
-
padding: 4,
|
|
100
|
-
background: LIGHT_MODE_BACKGROUND,
|
|
101
|
-
backdropFilter: LIGHT_MODE_BACKDROP_FILTER,
|
|
102
|
-
WebkitBackdropFilter: LIGHT_MODE_BACKDROP_FILTER,
|
|
103
|
-
'&:hover': _define_property({
|
|
104
|
-
background: 'none',
|
|
105
|
-
boxShadow: 'none'
|
|
106
|
-
}, "".concat(token.componentCls, "-header-left-icon-light"), {
|
|
107
|
-
color: 'var(--color-gray-text-secondary)'
|
|
108
|
-
})
|
|
109
|
-
},
|
|
110
113
|
'&-loading': {
|
|
111
114
|
background: 'var(--color-gray-bg-card-white)',
|
|
112
115
|
boxSizing: 'border-box',
|
|
@@ -122,6 +125,22 @@ var genStyle = function genStyle(token) {
|
|
|
122
125
|
background: 'var(--color-gray-bg-card-light)',
|
|
123
126
|
boxShadow: 'inset 0px 0px 1px 0px rgba(0, 19, 41, 0.15)'
|
|
124
127
|
},
|
|
128
|
+
// Placed after &-success so light mode wins when both classes apply (success + light).
|
|
129
|
+
'&-light': {
|
|
130
|
+
boxShadow: 'none',
|
|
131
|
+
border: 'none',
|
|
132
|
+
borderRadius: '14px',
|
|
133
|
+
padding: 4,
|
|
134
|
+
background: LIGHT_MODE_BACKGROUND,
|
|
135
|
+
backdropFilter: LIGHT_MODE_BACKDROP_FILTER,
|
|
136
|
+
WebkitBackdropFilter: LIGHT_MODE_BACKDROP_FILTER,
|
|
137
|
+
'&:hover': _define_property({
|
|
138
|
+
background: 'none',
|
|
139
|
+
boxShadow: 'none'
|
|
140
|
+
}, "".concat(token.componentCls, "-header-left-icon-light"), {
|
|
141
|
+
color: 'var(--color-gray-text-secondary)'
|
|
142
|
+
})
|
|
143
|
+
},
|
|
125
144
|
'&-bar': {
|
|
126
145
|
borderRadius: 'var(--radius-card-base)',
|
|
127
146
|
minHeight: '24px',
|
|
@@ -143,26 +162,21 @@ var genStyle = function genStyle(token) {
|
|
|
143
162
|
gap: 4
|
|
144
163
|
}
|
|
145
164
|
},
|
|
146
|
-
'&-header-left': {
|
|
165
|
+
'&-header-left-icon': {
|
|
166
|
+
font: 'var(--font-text-body-emphasized-base)',
|
|
167
|
+
color: 'var(--color-gray-text-default)',
|
|
168
|
+
height: 20,
|
|
147
169
|
display: 'flex',
|
|
148
170
|
alignItems: 'center',
|
|
149
|
-
|
|
150
|
-
'
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
justifyContent: 'center',
|
|
157
|
-
borderRadius: 'var(--radius-control-sm)',
|
|
171
|
+
justifyContent: 'center',
|
|
172
|
+
borderRadius: 'var(--radius-control-sm)',
|
|
173
|
+
'&:hover': {
|
|
174
|
+
backgroundColor: 'var(--color-gray-control-fill-hover)'
|
|
175
|
+
},
|
|
176
|
+
'&-light': {
|
|
177
|
+
color: 'var(--color-gray-text-light)',
|
|
158
178
|
'&:hover': {
|
|
159
|
-
|
|
160
|
-
},
|
|
161
|
-
'&-light': {
|
|
162
|
-
color: 'var(--color-gray-text-light)',
|
|
163
|
-
'&:hover': {
|
|
164
|
-
color: 'var(--color-gray-text-secondary)'
|
|
165
|
-
}
|
|
179
|
+
color: 'var(--color-gray-text-secondary)'
|
|
166
180
|
}
|
|
167
181
|
}
|
|
168
182
|
},
|
|
@@ -197,39 +211,33 @@ var genStyle = function genStyle(token) {
|
|
|
197
211
|
justifyContent: 'center',
|
|
198
212
|
alignItems: 'center',
|
|
199
213
|
padding: '4px',
|
|
200
|
-
gap: '0px 8px',
|
|
201
|
-
flexWrap: 'wrap',
|
|
202
|
-
alignContent: 'center',
|
|
203
214
|
borderRadius: '200px',
|
|
204
215
|
boxSizing: 'border-box',
|
|
205
216
|
boxShadow: 'var(--shadow-border-base)',
|
|
206
217
|
background: 'var(--color-gray-bg-card-white)',
|
|
207
218
|
zIndex: 0,
|
|
219
|
+
position: 'relative',
|
|
220
|
+
color: '#767E8B',
|
|
221
|
+
fontSize: 'var(--font-size-lg)',
|
|
222
|
+
'& > svg, & > *:first-child': {
|
|
223
|
+
position: 'relative',
|
|
224
|
+
zIndex: 1
|
|
225
|
+
},
|
|
208
226
|
'&-loading': {
|
|
209
227
|
borderRadius: '50%',
|
|
210
228
|
transition: 'border-radius 0.3s ease-in-out',
|
|
211
|
-
|
|
229
|
+
animation: 'thinkSpin 1s linear infinite',
|
|
212
230
|
'&::after': {
|
|
213
231
|
content: '""',
|
|
214
232
|
position: 'absolute',
|
|
215
233
|
inset: '0',
|
|
216
234
|
borderRadius: '50%',
|
|
217
|
-
background: 'conic-gradient(from var(--rotate, 0deg),transparent 0deg 0deg, #5EF050 35deg 55deg, #37ABFF 105deg 115deg, #D7B9FF 135deg 135deg, transparent 165deg 360deg)',
|
|
235
|
+
background: 'conic-gradient(from var(--think-rotate, 0deg),transparent 0deg 0deg, #5EF050 35deg 55deg, #37ABFF 105deg 115deg, #D7B9FF 135deg 135deg, transparent 165deg 360deg)',
|
|
218
236
|
WebkitMask: 'radial-gradient(50% 50% at 50% 50%, rgba(255, 0, 0, 0) 65%, #FF0000 100%)',
|
|
219
237
|
mask: 'radial-gradient(50% 50% at 50% 50%, rgba(255, 0, 0, 0) 80%, #FF0000 80%, #FF0000 100%)'
|
|
220
238
|
}
|
|
221
239
|
}
|
|
222
240
|
},
|
|
223
|
-
'&-image': {
|
|
224
|
-
color: '#767E8B',
|
|
225
|
-
fontSize: 'var(--font-size-lg)',
|
|
226
|
-
position: 'absolute',
|
|
227
|
-
zIndex: 999,
|
|
228
|
-
borderRadius: '50%',
|
|
229
|
-
display: 'flex',
|
|
230
|
-
justifyContent: 'center',
|
|
231
|
-
alignItems: 'center'
|
|
232
|
-
},
|
|
233
241
|
'&-target': {
|
|
234
242
|
lineHeight: '20px',
|
|
235
243
|
flex: 1,
|
|
@@ -310,7 +318,14 @@ var genStyle = function genStyle(token) {
|
|
|
310
318
|
display: 'flex',
|
|
311
319
|
alignItems: 'center',
|
|
312
320
|
gap: 8,
|
|
313
|
-
flex: 1
|
|
321
|
+
flex: 1,
|
|
322
|
+
'&-loading': {
|
|
323
|
+
maskImage: 'linear-gradient(to right, rgba(0,0,0,1) 0%, rgba(0,0,0,0.15) 50%, rgba(0,0,0,1) 100%)',
|
|
324
|
+
WebkitMaskImage: 'linear-gradient(to right, rgba(0,0,0,1) 0%, rgba(0,0,0,0.15) 50%, rgba(0,0,0,1) 100%)',
|
|
325
|
+
maskSize: '200% 100%',
|
|
326
|
+
WebkitMaskSize: '200% 100%',
|
|
327
|
+
animation: 'thinkMaskSweep 1.5s linear infinite'
|
|
328
|
+
}
|
|
314
329
|
},
|
|
315
330
|
'&-content': {
|
|
316
331
|
font: 'var(--font-text-paragraph-sm)',
|
|
@@ -362,6 +377,7 @@ var genStyle = function genStyle(token) {
|
|
|
362
377
|
zIndex: 10,
|
|
363
378
|
transform: 'translateY(100%)',
|
|
364
379
|
opacity: 0,
|
|
380
|
+
transition: 'transform 0.2s ease, opacity 0.2s ease',
|
|
365
381
|
'&:hover': {
|
|
366
382
|
boxShadow: 'var(--shadow-popover-base)'
|
|
367
383
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
declare module 'quicklink';
|
|
@@ -0,0 +1,283 @@
|
|
|
1
|
+
function _array_like_to_array(arr, len) {
|
|
2
|
+
if (len == null || len > arr.length) len = arr.length;
|
|
3
|
+
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
4
|
+
return arr2;
|
|
5
|
+
}
|
|
6
|
+
function _array_with_holes(arr) {
|
|
7
|
+
if (Array.isArray(arr)) return arr;
|
|
8
|
+
}
|
|
9
|
+
function _define_property(obj, key, value) {
|
|
10
|
+
if (key in obj) {
|
|
11
|
+
Object.defineProperty(obj, key, {
|
|
12
|
+
value: value,
|
|
13
|
+
enumerable: true,
|
|
14
|
+
configurable: true,
|
|
15
|
+
writable: true
|
|
16
|
+
});
|
|
17
|
+
} else {
|
|
18
|
+
obj[key] = value;
|
|
19
|
+
}
|
|
20
|
+
return obj;
|
|
21
|
+
}
|
|
22
|
+
function _iterable_to_array_limit(arr, i) {
|
|
23
|
+
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
24
|
+
if (_i == null) return;
|
|
25
|
+
var _arr = [];
|
|
26
|
+
var _n = true;
|
|
27
|
+
var _d = false;
|
|
28
|
+
var _s, _e;
|
|
29
|
+
try {
|
|
30
|
+
for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
|
|
31
|
+
_arr.push(_s.value);
|
|
32
|
+
if (i && _arr.length === i) break;
|
|
33
|
+
}
|
|
34
|
+
} catch (err) {
|
|
35
|
+
_d = true;
|
|
36
|
+
_e = err;
|
|
37
|
+
} finally{
|
|
38
|
+
try {
|
|
39
|
+
if (!_n && _i["return"] != null) _i["return"]();
|
|
40
|
+
} finally{
|
|
41
|
+
if (_d) throw _e;
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
return _arr;
|
|
45
|
+
}
|
|
46
|
+
function _non_iterable_rest() {
|
|
47
|
+
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
48
|
+
}
|
|
49
|
+
function _object_spread(target) {
|
|
50
|
+
for(var i = 1; i < arguments.length; i++){
|
|
51
|
+
var source = arguments[i] != null ? arguments[i] : {};
|
|
52
|
+
var ownKeys = Object.keys(source);
|
|
53
|
+
if (typeof Object.getOwnPropertySymbols === "function") {
|
|
54
|
+
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
|
|
55
|
+
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
|
|
56
|
+
}));
|
|
57
|
+
}
|
|
58
|
+
ownKeys.forEach(function(key) {
|
|
59
|
+
_define_property(target, key, source[key]);
|
|
60
|
+
});
|
|
61
|
+
}
|
|
62
|
+
return target;
|
|
63
|
+
}
|
|
64
|
+
function ownKeys(object, enumerableOnly) {
|
|
65
|
+
var keys = Object.keys(object);
|
|
66
|
+
if (Object.getOwnPropertySymbols) {
|
|
67
|
+
var symbols = Object.getOwnPropertySymbols(object);
|
|
68
|
+
if (enumerableOnly) {
|
|
69
|
+
symbols = symbols.filter(function(sym) {
|
|
70
|
+
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
71
|
+
});
|
|
72
|
+
}
|
|
73
|
+
keys.push.apply(keys, symbols);
|
|
74
|
+
}
|
|
75
|
+
return keys;
|
|
76
|
+
}
|
|
77
|
+
function _object_spread_props(target, source) {
|
|
78
|
+
source = source != null ? source : {};
|
|
79
|
+
if (Object.getOwnPropertyDescriptors) {
|
|
80
|
+
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
|
|
81
|
+
} else {
|
|
82
|
+
ownKeys(Object(source)).forEach(function(key) {
|
|
83
|
+
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
84
|
+
});
|
|
85
|
+
}
|
|
86
|
+
return target;
|
|
87
|
+
}
|
|
88
|
+
function _sliced_to_array(arr, i) {
|
|
89
|
+
return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
|
|
90
|
+
}
|
|
91
|
+
function _unsupported_iterable_to_array(o, minLen) {
|
|
92
|
+
if (!o) return;
|
|
93
|
+
if (typeof o === "string") return _array_like_to_array(o, minLen);
|
|
94
|
+
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
95
|
+
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
96
|
+
if (n === "Map" || n === "Set") return Array.from(n);
|
|
97
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
|
|
98
|
+
}
|
|
99
|
+
import { FileFolders } from "@sofa-design/icons";
|
|
100
|
+
import { ConfigProvider, Empty, Tree } from "antd";
|
|
101
|
+
import classNames from "clsx";
|
|
102
|
+
import React, { useCallback, useContext, useEffect, useMemo, useState } from "react";
|
|
103
|
+
import { useRefFunction } from "../../../Hooks/useRefFunction";
|
|
104
|
+
import { I18nContext } from "../../../I18n";
|
|
105
|
+
import { getFileType } from "../../types";
|
|
106
|
+
import { getFileTypeIcon } from "../utils";
|
|
107
|
+
import { useFileTreeStyle } from "./style";
|
|
108
|
+
var walkAndIndex = function walkAndIndex1(nodes, map) {
|
|
109
|
+
var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = undefined;
|
|
110
|
+
try {
|
|
111
|
+
for(var _iterator = nodes[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true){
|
|
112
|
+
var n = _step.value;
|
|
113
|
+
var _n_children;
|
|
114
|
+
map.set(n.key, n);
|
|
115
|
+
if ((_n_children = n.children) === null || _n_children === void 0 ? void 0 : _n_children.length) {
|
|
116
|
+
walkAndIndex(n.children, map);
|
|
117
|
+
}
|
|
118
|
+
}
|
|
119
|
+
} catch (err) {
|
|
120
|
+
_didIteratorError = true;
|
|
121
|
+
_iteratorError = err;
|
|
122
|
+
} finally{
|
|
123
|
+
try {
|
|
124
|
+
if (!_iteratorNormalCompletion && _iterator.return != null) {
|
|
125
|
+
_iterator.return();
|
|
126
|
+
}
|
|
127
|
+
} finally{
|
|
128
|
+
if (_didIteratorError) {
|
|
129
|
+
throw _iteratorError;
|
|
130
|
+
}
|
|
131
|
+
}
|
|
132
|
+
}
|
|
133
|
+
};
|
|
134
|
+
var toDataNode = function toDataNode1(node) {
|
|
135
|
+
var key = node.key, name = node.name, isLeaf = node.isLeaf, disabled = node.disabled, children = node.children;
|
|
136
|
+
var hasChildren = Boolean(children && children.length > 0);
|
|
137
|
+
// `isLeaf: false` = 目录;未传时:有子节点 = 目录,无子节点 = 视为文件(与懒加载目录需显式 `isLeaf: false` 一致)
|
|
138
|
+
var resolvedIsLeaf = isLeaf !== null && isLeaf !== void 0 ? isLeaf : !hasChildren;
|
|
139
|
+
if (resolvedIsLeaf) {
|
|
140
|
+
return {
|
|
141
|
+
key: key,
|
|
142
|
+
title: name,
|
|
143
|
+
isLeaf: true,
|
|
144
|
+
disabled: disabled
|
|
145
|
+
};
|
|
146
|
+
}
|
|
147
|
+
return {
|
|
148
|
+
key: key,
|
|
149
|
+
title: name,
|
|
150
|
+
isLeaf: false,
|
|
151
|
+
disabled: disabled,
|
|
152
|
+
children: hasChildren ? children.map(toDataNode) : []
|
|
153
|
+
};
|
|
154
|
+
};
|
|
155
|
+
var replaceNodeChildren = function replaceNodeChildren1(nodes, key, newChildren) {
|
|
156
|
+
return nodes.map(function(n) {
|
|
157
|
+
var _n_children;
|
|
158
|
+
if (n.key === key) {
|
|
159
|
+
return _object_spread_props(_object_spread({}, n), {
|
|
160
|
+
children: newChildren
|
|
161
|
+
});
|
|
162
|
+
}
|
|
163
|
+
if ((_n_children = n.children) === null || _n_children === void 0 ? void 0 : _n_children.length) {
|
|
164
|
+
return _object_spread_props(_object_spread({}, n), {
|
|
165
|
+
children: replaceNodeChildren(n.children, key, newChildren)
|
|
166
|
+
});
|
|
167
|
+
}
|
|
168
|
+
return n;
|
|
169
|
+
});
|
|
170
|
+
};
|
|
171
|
+
var buildMap = function buildMap(nodes) {
|
|
172
|
+
var m = new Map();
|
|
173
|
+
walkAndIndex(nodes, m);
|
|
174
|
+
return m;
|
|
175
|
+
};
|
|
176
|
+
var FileTreeComponent = function FileTreeComponent(param) {
|
|
177
|
+
var _tab = param.tab, className = param.className, style = param.style, treeData = param.treeData, onLoadChildren = param.onLoadChildren, onSelect = param.onSelect, _param_showLine = param.showLine, showLine = _param_showLine === void 0 ? true : _param_showLine, _resetKey = param.resetKey, emptyRender = param.emptyRender, _param_blockNode = param.blockNode, blockNode = _param_blockNode === void 0 ? true : _param_blockNode;
|
|
178
|
+
var _ref;
|
|
179
|
+
var getPrefixCls = useContext(ConfigProvider.ConfigContext).getPrefixCls;
|
|
180
|
+
var locale = useContext(I18nContext).locale;
|
|
181
|
+
var prefixCls = getPrefixCls('workspace-file-tree');
|
|
182
|
+
var _useFileTreeStyle = useFileTreeStyle(prefixCls), wrapSSR = _useFileTreeStyle.wrapSSR, hashId = _useFileTreeStyle.hashId;
|
|
183
|
+
var _useState = _sliced_to_array(useState(treeData), 2), innerTree = _useState[0], setInnerTree = _useState[1];
|
|
184
|
+
var nodeMap = useMemo(function() {
|
|
185
|
+
return buildMap(innerTree);
|
|
186
|
+
}, [
|
|
187
|
+
innerTree
|
|
188
|
+
]);
|
|
189
|
+
var onLoadChildrenRef = useRefFunction(onLoadChildren);
|
|
190
|
+
useEffect(function() {
|
|
191
|
+
setInnerTree(treeData);
|
|
192
|
+
}, [
|
|
193
|
+
treeData
|
|
194
|
+
]);
|
|
195
|
+
var dataNodes = useMemo(function() {
|
|
196
|
+
return innerTree.map(toDataNode);
|
|
197
|
+
}, [
|
|
198
|
+
innerTree
|
|
199
|
+
]);
|
|
200
|
+
var handleLoadData = useCallback(function(treeNode) {
|
|
201
|
+
var k = String(treeNode.key);
|
|
202
|
+
var source = nodeMap.get(k);
|
|
203
|
+
if (!source) {
|
|
204
|
+
return Promise.resolve();
|
|
205
|
+
}
|
|
206
|
+
if (source.isLeaf === true) {
|
|
207
|
+
return Promise.resolve();
|
|
208
|
+
}
|
|
209
|
+
if (source.isLeaf === undefined && (!source.children || source.children.length === 0)) {
|
|
210
|
+
return Promise.resolve();
|
|
211
|
+
}
|
|
212
|
+
if (source.children && source.children.length > 0) {
|
|
213
|
+
return Promise.resolve();
|
|
214
|
+
}
|
|
215
|
+
// 须让 `Promise` 在失败时 reject,以便 rc-tree 不将 key 记为已加载,从而可再次展开重试
|
|
216
|
+
return Promise.resolve(onLoadChildrenRef(source)).then(function(loaded) {
|
|
217
|
+
setInnerTree(function(prev) {
|
|
218
|
+
return replaceNodeChildren(prev, k, loaded);
|
|
219
|
+
});
|
|
220
|
+
});
|
|
221
|
+
}, [
|
|
222
|
+
onLoadChildrenRef,
|
|
223
|
+
nodeMap
|
|
224
|
+
]);
|
|
225
|
+
var handleSelect = useCallback(function(_keys, info) {
|
|
226
|
+
if (!onSelect) return;
|
|
227
|
+
if (!info.selected) return;
|
|
228
|
+
var k = String(info.node.key);
|
|
229
|
+
var n = nodeMap.get(k);
|
|
230
|
+
if (n) onSelect(n);
|
|
231
|
+
}, [
|
|
232
|
+
nodeMap,
|
|
233
|
+
onSelect
|
|
234
|
+
]);
|
|
235
|
+
var handleTreeIcon = useCallback(function(iconProps) {
|
|
236
|
+
var k = String(iconProps.eventKey);
|
|
237
|
+
var n = nodeMap.get(k);
|
|
238
|
+
if (n === null || n === void 0 ? void 0 : n.icon) {
|
|
239
|
+
return /*#__PURE__*/ React.createElement("span", {
|
|
240
|
+
className: classNames("".concat(prefixCls, "-icon"), hashId)
|
|
241
|
+
}, n.icon);
|
|
242
|
+
}
|
|
243
|
+
if (iconProps.isLeaf) {
|
|
244
|
+
var _ref;
|
|
245
|
+
var fileName = (_ref = n === null || n === void 0 ? void 0 : n.name) !== null && _ref !== void 0 ? _ref : '';
|
|
246
|
+
var fileType = getFileType(fileName);
|
|
247
|
+
return /*#__PURE__*/ React.createElement("span", {
|
|
248
|
+
className: classNames("".concat(prefixCls, "-icon"), hashId),
|
|
249
|
+
"aria-hidden": true
|
|
250
|
+
}, getFileTypeIcon(fileType, undefined, fileName));
|
|
251
|
+
}
|
|
252
|
+
return /*#__PURE__*/ React.createElement("span", {
|
|
253
|
+
className: classNames("".concat(prefixCls, "-icon"), "".concat(prefixCls, "-icon--folder"), hashId),
|
|
254
|
+
"aria-hidden": true
|
|
255
|
+
}, /*#__PURE__*/ React.createElement(FileFolders, null));
|
|
256
|
+
}, [
|
|
257
|
+
hashId,
|
|
258
|
+
nodeMap,
|
|
259
|
+
prefixCls
|
|
260
|
+
]);
|
|
261
|
+
var showEmpty = innerTree.length === 0;
|
|
262
|
+
var emptyNode = typeof emptyRender === 'function' ? emptyRender() : emptyRender;
|
|
263
|
+
var defaultEmpty = /*#__PURE__*/ React.createElement(Empty, {
|
|
264
|
+
image: Empty.PRESENTED_IMAGE_SIMPLE,
|
|
265
|
+
description: (_ref = locale === null || locale === void 0 ? void 0 : locale['workspace.empty']) !== null && _ref !== void 0 ? _ref : '暂无数据'
|
|
266
|
+
});
|
|
267
|
+
return wrapSSR(/*#__PURE__*/ React.createElement("div", {
|
|
268
|
+
className: classNames(prefixCls, hashId, className),
|
|
269
|
+
style: style,
|
|
270
|
+
"data-testid": "workspace-file-tree"
|
|
271
|
+
}, showEmpty ? emptyNode !== null && emptyNode !== void 0 ? emptyNode : defaultEmpty : /*#__PURE__*/ React.createElement(Tree, {
|
|
272
|
+
className: classNames("".concat(prefixCls, "-tree"), hashId),
|
|
273
|
+
showLine: showLine,
|
|
274
|
+
showIcon: true,
|
|
275
|
+
blockNode: blockNode,
|
|
276
|
+
loadData: handleLoadData,
|
|
277
|
+
onSelect: handleSelect,
|
|
278
|
+
treeData: dataNodes,
|
|
279
|
+
icon: handleTreeIcon
|
|
280
|
+
})));
|
|
281
|
+
};
|
|
282
|
+
FileTreeComponent.displayName = 'FileTree';
|
|
283
|
+
export { FileTreeComponent as FileTree };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { FileTree } from "./FileTreeComponent";
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare function useFileTreeStyle(prefixCls?: string): {
|
|
3
|
+
hashId: string;
|
|
4
|
+
wrapSSR: (node: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) => import("react").JSX.Element;
|
|
5
|
+
} | {
|
|
6
|
+
wrapSSR: (node: any) => any;
|
|
7
|
+
hashId: string;
|
|
8
|
+
};
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
function _define_property(obj, key, value) {
|
|
2
|
+
if (key in obj) {
|
|
3
|
+
Object.defineProperty(obj, key, {
|
|
4
|
+
value: value,
|
|
5
|
+
enumerable: true,
|
|
6
|
+
configurable: true,
|
|
7
|
+
writable: true
|
|
8
|
+
});
|
|
9
|
+
} else {
|
|
10
|
+
obj[key] = value;
|
|
11
|
+
}
|
|
12
|
+
return obj;
|
|
13
|
+
}
|
|
14
|
+
function _object_spread(target) {
|
|
15
|
+
for(var i = 1; i < arguments.length; i++){
|
|
16
|
+
var source = arguments[i] != null ? arguments[i] : {};
|
|
17
|
+
var ownKeys = Object.keys(source);
|
|
18
|
+
if (typeof Object.getOwnPropertySymbols === "function") {
|
|
19
|
+
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
|
|
20
|
+
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
|
|
21
|
+
}));
|
|
22
|
+
}
|
|
23
|
+
ownKeys.forEach(function(key) {
|
|
24
|
+
_define_property(target, key, source[key]);
|
|
25
|
+
});
|
|
26
|
+
}
|
|
27
|
+
return target;
|
|
28
|
+
}
|
|
29
|
+
function ownKeys(object, enumerableOnly) {
|
|
30
|
+
var keys = Object.keys(object);
|
|
31
|
+
if (Object.getOwnPropertySymbols) {
|
|
32
|
+
var symbols = Object.getOwnPropertySymbols(object);
|
|
33
|
+
if (enumerableOnly) {
|
|
34
|
+
symbols = symbols.filter(function(sym) {
|
|
35
|
+
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
36
|
+
});
|
|
37
|
+
}
|
|
38
|
+
keys.push.apply(keys, symbols);
|
|
39
|
+
}
|
|
40
|
+
return keys;
|
|
41
|
+
}
|
|
42
|
+
function _object_spread_props(target, source) {
|
|
43
|
+
source = source != null ? source : {};
|
|
44
|
+
if (Object.getOwnPropertyDescriptors) {
|
|
45
|
+
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
|
|
46
|
+
} else {
|
|
47
|
+
ownKeys(Object(source)).forEach(function(key) {
|
|
48
|
+
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
49
|
+
});
|
|
50
|
+
}
|
|
51
|
+
return target;
|
|
52
|
+
}
|
|
53
|
+
import { useEditorStyleRegister } from "../../../Hooks/useStyle";
|
|
54
|
+
var genStyle = function genStyle(token) {
|
|
55
|
+
var componentCls = token.componentCls;
|
|
56
|
+
return _define_property({}, componentCls, _define_property({
|
|
57
|
+
height: '100%',
|
|
58
|
+
minHeight: 0,
|
|
59
|
+
display: 'flex',
|
|
60
|
+
flexDirection: 'column',
|
|
61
|
+
overflow: 'hidden',
|
|
62
|
+
boxSizing: 'border-box',
|
|
63
|
+
padding: 'var(--margin-2x) var(--margin-3x)'
|
|
64
|
+
}, "".concat(componentCls, "-tree"), {
|
|
65
|
+
flex: 1,
|
|
66
|
+
minHeight: 0,
|
|
67
|
+
overflow: 'auto',
|
|
68
|
+
background: 'transparent'
|
|
69
|
+
}));
|
|
70
|
+
};
|
|
71
|
+
export function useFileTreeStyle(prefixCls) {
|
|
72
|
+
return useEditorStyleRegister('WorkspaceFileTree', function(token) {
|
|
73
|
+
var fileTreeToken = _object_spread_props(_object_spread({}, token), {
|
|
74
|
+
componentCls: ".".concat(prefixCls)
|
|
75
|
+
});
|
|
76
|
+
return [
|
|
77
|
+
genStyle(fileTreeToken)
|
|
78
|
+
];
|
|
79
|
+
});
|
|
80
|
+
}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
export { FileComponent as File } from './FileComponent';
|
|
2
|
+
export { FileTree } from './FileTree';
|
|
2
3
|
export { PreviewComponent } from './PreviewComponent';
|
|
3
4
|
export type { PreviewComponentProps } from './PreviewComponent';
|
|
4
5
|
export { getFileTypeName } from '../types';
|
|
5
|
-
export type { FileActionRef, FileBuiltinActions, FileNode, FileProps, FileRenderContext, FileType, GroupNode, } from '../types';
|
|
6
|
+
export type { FileActionRef, FileBuiltinActions, FileNode, FileProps, FileRenderContext, FileTreeNode, FileTreeProps, FileType, GroupNode, } from '../types';
|
|
6
7
|
export { getFileTypeIcon, getGroupIcon } from './utils';
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import { FC } from 'react';
|
|
2
|
-
import type { BrowserProps, CustomProps, FileProps, RealtimeProps, TaskProps, WorkspaceProps } from './types';
|
|
2
|
+
import type { BrowserProps, CustomProps, FileProps, FileTreeProps, RealtimeProps, TaskProps, WorkspaceProps } from './types';
|
|
3
3
|
export type { FileActionRef } from './types';
|
|
4
4
|
declare const RealtimeComponent: FC<RealtimeProps>;
|
|
5
5
|
declare const BrowserComponent: FC<BrowserProps>;
|
|
6
6
|
declare const TaskComponent: FC<TaskProps>;
|
|
7
7
|
declare const FileComponent: FC<FileProps>;
|
|
8
|
+
declare const FileTreeComponent: FC<FileTreeProps>;
|
|
8
9
|
declare const CustomComponent: FC<CustomProps>;
|
|
9
10
|
/**
|
|
10
11
|
* 工作空间组件
|
|
@@ -15,9 +16,10 @@ declare const Workspace: FC<WorkspaceProps> & {
|
|
|
15
16
|
Browser: typeof BrowserComponent;
|
|
16
17
|
Task: typeof TaskComponent;
|
|
17
18
|
File: typeof FileComponent;
|
|
19
|
+
FileTree: typeof FileTreeComponent;
|
|
18
20
|
Custom: typeof CustomComponent;
|
|
19
21
|
};
|
|
20
22
|
export * from './File';
|
|
21
23
|
export type { HtmlPreviewProps } from './HtmlPreview';
|
|
22
|
-
export type { BrowserProps, CustomProps, FileProps, RealtimeProps, TabConfiguration, TabItem, TaskProps, WorkspaceProps, } from './types';
|
|
24
|
+
export type { BrowserProps, CustomProps, FileProps, FileTreeNode, FileTreeProps, RealtimeProps, TabConfiguration, TabItem, TaskProps, WorkspacePanelType, WorkspaceProps, } from './types';
|
|
23
25
|
export default Workspace;
|