@matechat/ng 20.3.0 → 20.4.0-alpha.1
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/fesm2022/matechat-ng.mjs +1821 -1334
- package/fesm2022/matechat-ng.mjs.map +1 -1
- package/index.d.ts +285 -204
- package/package.json +1 -1
package/fesm2022/matechat-ng.mjs
CHANGED
|
@@ -3,27 +3,28 @@ import { Injectable, Pipe, EventEmitter, ViewChild, Output, Input, Component, Co
|
|
|
3
3
|
import * as i1 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
5
|
import { Subject, debounceTime } from 'rxjs';
|
|
6
|
+
import * as i2 from '@angular/platform-browser';
|
|
6
7
|
import * as i3 from '@angular/forms';
|
|
7
8
|
import { FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
9
|
+
import { debounce, isObject } from 'lodash-es';
|
|
8
10
|
import morphdom from 'morphdom';
|
|
9
11
|
import markdownit from 'markdown-it';
|
|
10
12
|
import { getDefaultWhiteList, getDefaultCSSWhiteList, filterXSS } from 'xss';
|
|
11
13
|
import hljs from 'highlight.js';
|
|
12
14
|
import { trigger, transition, style, animate } from '@angular/animations';
|
|
13
15
|
import { computePosition, offset, autoUpdate } from '@floating-ui/dom';
|
|
14
|
-
import { debounce, isObject } from 'lodash-es';
|
|
15
16
|
|
|
16
17
|
var zhCN = {
|
|
17
18
|
Input: {
|
|
18
|
-
send:
|
|
19
|
-
pauseAnswer:
|
|
20
|
-
pleaseEnter:
|
|
21
|
-
pleaseEnterPlaceholder:
|
|
22
|
-
ariaLabel:
|
|
19
|
+
send: '发送',
|
|
20
|
+
pauseAnswer: '停止回答',
|
|
21
|
+
pleaseEnter: '请输入您的问题...',
|
|
22
|
+
pleaseEnterPlaceholder: '请输入您的问题,并按{enterKey}发送,按{shiftEnterKey}换行',
|
|
23
|
+
ariaLabel: '输入框',
|
|
23
24
|
},
|
|
24
25
|
Md: {
|
|
25
|
-
toggle:
|
|
26
|
-
copy:
|
|
26
|
+
toggle: '收起/展开',
|
|
27
|
+
copy: '复制',
|
|
27
28
|
diagram: '图形',
|
|
28
29
|
code: '代码',
|
|
29
30
|
zoomIn: '放大',
|
|
@@ -31,28 +32,41 @@ var zhCN = {
|
|
|
31
32
|
downLoad: '下载',
|
|
32
33
|
},
|
|
33
34
|
Bubble: {
|
|
34
|
-
ariaLabel:
|
|
35
|
-
emptyAvatar:
|
|
36
|
-
userName:
|
|
37
|
-
content:
|
|
38
|
-
avatar:
|
|
35
|
+
ariaLabel: '聊天消息气泡',
|
|
36
|
+
emptyAvatar: '无头像占位',
|
|
37
|
+
userName: '用户名称: {name}',
|
|
38
|
+
content: '消息内容',
|
|
39
|
+
avatar: '用户头像: {name}',
|
|
39
40
|
},
|
|
40
41
|
Attachment: {
|
|
41
|
-
dragToUpload:
|
|
42
|
+
dragToUpload: '拖拽到此处上传',
|
|
43
|
+
},
|
|
44
|
+
FileList: {
|
|
45
|
+
uploadFailed: '上传失败',
|
|
46
|
+
downloadFailed: '下载失败',
|
|
47
|
+
retry: '重试',
|
|
48
|
+
download: '下载',
|
|
49
|
+
preview: '预览',
|
|
50
|
+
uploading: '上传中...',
|
|
51
|
+
downloading: '下载中...',
|
|
52
|
+
remove: '删除',
|
|
53
|
+
unsupportedPreview: '浏览器不支持预览此文件类型:{fileName}',
|
|
54
|
+
tryDownload: '请尝试下载后查看',
|
|
55
|
+
close: '关闭',
|
|
42
56
|
},
|
|
43
57
|
};
|
|
44
58
|
|
|
45
59
|
var enUS = {
|
|
46
60
|
Input: {
|
|
47
|
-
send:
|
|
48
|
-
pauseAnswer:
|
|
49
|
-
pleaseEnter:
|
|
50
|
-
pleaseEnterPlaceholder:
|
|
51
|
-
ariaLabel:
|
|
61
|
+
send: 'Send',
|
|
62
|
+
pauseAnswer: 'Stop',
|
|
63
|
+
pleaseEnter: 'Please enter your question...',
|
|
64
|
+
pleaseEnterPlaceholder: 'Please enter your question and press {enterKey} to send, {shiftEnterKey} to wrap.',
|
|
65
|
+
ariaLabel: 'Input box',
|
|
52
66
|
},
|
|
53
67
|
Md: {
|
|
54
|
-
toggle:
|
|
55
|
-
copy:
|
|
68
|
+
toggle: 'Collapse/Expand',
|
|
69
|
+
copy: 'Copy',
|
|
56
70
|
diagram: 'Diagram',
|
|
57
71
|
code: 'Code',
|
|
58
72
|
zoomIn: 'Zoom In',
|
|
@@ -60,15 +74,28 @@ var enUS = {
|
|
|
60
74
|
downLoad: 'Download',
|
|
61
75
|
},
|
|
62
76
|
Bubble: {
|
|
63
|
-
ariaLabel:
|
|
64
|
-
emptyAvatar:
|
|
65
|
-
userName:
|
|
66
|
-
content:
|
|
67
|
-
avatar:
|
|
77
|
+
ariaLabel: 'Chat message bubble',
|
|
78
|
+
emptyAvatar: 'Empty avatar placeholder',
|
|
79
|
+
userName: 'User name: {name}',
|
|
80
|
+
content: 'Message content',
|
|
81
|
+
avatar: 'User avatar: {name}',
|
|
68
82
|
},
|
|
69
83
|
Attachment: {
|
|
70
84
|
dragToUpload: 'Drag to upload',
|
|
71
85
|
},
|
|
86
|
+
FileList: {
|
|
87
|
+
uploadFailed: 'Upload failed',
|
|
88
|
+
downloadFailed: 'Download failed',
|
|
89
|
+
retry: 'Retry',
|
|
90
|
+
download: 'Download',
|
|
91
|
+
preview: 'Preview',
|
|
92
|
+
uploading: 'Uploading...',
|
|
93
|
+
downloading: 'Downloading...',
|
|
94
|
+
remove: 'Remove',
|
|
95
|
+
unsupportedPreview: 'Browser does not support previewing this file type: {fileName}',
|
|
96
|
+
tryDownload: 'Please try downloading to view',
|
|
97
|
+
close: 'Close',
|
|
98
|
+
},
|
|
72
99
|
};
|
|
73
100
|
|
|
74
101
|
class LocaleService {
|
|
@@ -1030,6 +1057,504 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImpo
|
|
|
1030
1057
|
}]
|
|
1031
1058
|
}] });
|
|
1032
1059
|
|
|
1060
|
+
class McTeleportComponent {
|
|
1061
|
+
constructor(viewContainerRef, renderer) {
|
|
1062
|
+
this.viewContainerRef = viewContainerRef;
|
|
1063
|
+
this.renderer = renderer;
|
|
1064
|
+
this.insertedElements = [];
|
|
1065
|
+
this.targetElement = null;
|
|
1066
|
+
}
|
|
1067
|
+
ngOnInit() {
|
|
1068
|
+
this.targetElement = this.getTargetElement();
|
|
1069
|
+
if (this.targetElement && this.contentTemplate) {
|
|
1070
|
+
this.teleportContent();
|
|
1071
|
+
}
|
|
1072
|
+
}
|
|
1073
|
+
ngOnDestroy() {
|
|
1074
|
+
this.removeContent();
|
|
1075
|
+
}
|
|
1076
|
+
getTargetElement() {
|
|
1077
|
+
if (typeof this.to === 'string') {
|
|
1078
|
+
if (this.to === 'body') {
|
|
1079
|
+
return document.body;
|
|
1080
|
+
}
|
|
1081
|
+
return document.querySelector(this.to);
|
|
1082
|
+
}
|
|
1083
|
+
return this.to;
|
|
1084
|
+
}
|
|
1085
|
+
teleportContent() {
|
|
1086
|
+
if (!this.targetElement || !this.contentTemplate)
|
|
1087
|
+
return;
|
|
1088
|
+
// 创建一个注释节点作为标记
|
|
1089
|
+
const startComment = this.renderer.createComment('mc-teleport-start');
|
|
1090
|
+
const endComment = this.renderer.createComment('mc-teleport-end');
|
|
1091
|
+
// 将注释节点添加到目标位置
|
|
1092
|
+
this.renderer.appendChild(this.targetElement, startComment);
|
|
1093
|
+
this.renderer.appendChild(this.targetElement, endComment);
|
|
1094
|
+
// 保存插入的节点
|
|
1095
|
+
this.insertedElements.push(startComment, endComment);
|
|
1096
|
+
// 使用 ViewContainerRef 创建嵌入式视图
|
|
1097
|
+
const viewRef = this.viewContainerRef.createEmbeddedView(this.contentTemplate);
|
|
1098
|
+
// 将视图的根节点移动到目标位置
|
|
1099
|
+
viewRef.rootNodes.forEach((node) => {
|
|
1100
|
+
this.renderer.insertBefore(this.targetElement, node, endComment);
|
|
1101
|
+
this.insertedElements.push(node);
|
|
1102
|
+
});
|
|
1103
|
+
}
|
|
1104
|
+
removeContent() {
|
|
1105
|
+
// 移除所有插入的节点
|
|
1106
|
+
this.insertedElements.forEach((node) => {
|
|
1107
|
+
if (node.parentNode) {
|
|
1108
|
+
this.renderer.removeChild(node.parentNode, node);
|
|
1109
|
+
}
|
|
1110
|
+
});
|
|
1111
|
+
// 清空插入的节点列表
|
|
1112
|
+
this.insertedElements = [];
|
|
1113
|
+
// 清空视图容器
|
|
1114
|
+
this.viewContainerRef.clear();
|
|
1115
|
+
}
|
|
1116
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: McTeleportComponent, deps: [{ token: i0.ViewContainerRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1117
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: McTeleportComponent, isStandalone: true, selector: "mc-teleport", inputs: { to: "to" }, viewQueries: [{ propertyName: "contentTemplate", first: true, predicate: ["content"], descendants: true, static: true }], ngImport: i0, template: '<ng-template #content><ng-content></ng-content></ng-template>', isInline: true, styles: [""] }); }
|
|
1118
|
+
}
|
|
1119
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: McTeleportComponent, decorators: [{
|
|
1120
|
+
type: Component,
|
|
1121
|
+
args: [{ selector: 'mc-teleport', standalone: true, template: '<ng-template #content><ng-content></ng-content></ng-template>' }]
|
|
1122
|
+
}], ctorParameters: () => [{ type: i0.ViewContainerRef }, { type: i0.Renderer2 }], propDecorators: { to: [{
|
|
1123
|
+
type: Input
|
|
1124
|
+
}], contentTemplate: [{
|
|
1125
|
+
type: ViewChild,
|
|
1126
|
+
args: ['content', { static: true }]
|
|
1127
|
+
}] } });
|
|
1128
|
+
|
|
1129
|
+
class FileListFoundation extends BaseFoundation {
|
|
1130
|
+
constructor(adapter) {
|
|
1131
|
+
super({ ...adapter });
|
|
1132
|
+
}
|
|
1133
|
+
formatFileSize(bytes) {
|
|
1134
|
+
if (bytes === 0)
|
|
1135
|
+
return '0 B';
|
|
1136
|
+
const k = 1024;
|
|
1137
|
+
const sizes = ['B', 'KB', 'MB', 'GB'];
|
|
1138
|
+
const i = Math.floor(Math.log(bytes) / Math.log(k));
|
|
1139
|
+
return parseFloat((bytes / k ** i).toFixed(2)) + ' ' + sizes[i];
|
|
1140
|
+
}
|
|
1141
|
+
getFileType(name) {
|
|
1142
|
+
const ext = name.split('.').pop()?.toLowerCase();
|
|
1143
|
+
if (!ext)
|
|
1144
|
+
return 'file';
|
|
1145
|
+
const imageExts = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp', 'svg'];
|
|
1146
|
+
const videoExts = ['mp4', 'avi', 'mov', 'wmv', 'flv', 'mkv', 'webm'];
|
|
1147
|
+
const audioExts = ['mp3', 'wav', 'ogg', 'flac', 'aac'];
|
|
1148
|
+
const docExts = ['doc', 'docx', 'txt', 'pdf', 'rtf', 'md'];
|
|
1149
|
+
const sheetExts = ['xls', 'xlsx', 'csv'];
|
|
1150
|
+
const pptExts = ['ppt', 'pptx'];
|
|
1151
|
+
const codeExts = [
|
|
1152
|
+
'js',
|
|
1153
|
+
'ts',
|
|
1154
|
+
'jsx',
|
|
1155
|
+
'tsx',
|
|
1156
|
+
'html',
|
|
1157
|
+
'css',
|
|
1158
|
+
'scss',
|
|
1159
|
+
'json',
|
|
1160
|
+
'xml',
|
|
1161
|
+
'yml',
|
|
1162
|
+
'yaml',
|
|
1163
|
+
];
|
|
1164
|
+
const archiveExts = ['zip', 'rar', '7z', 'tar', 'gz'];
|
|
1165
|
+
if (imageExts.includes(ext))
|
|
1166
|
+
return 'image';
|
|
1167
|
+
if (videoExts.includes(ext))
|
|
1168
|
+
return 'video';
|
|
1169
|
+
if (audioExts.includes(ext))
|
|
1170
|
+
return 'audio';
|
|
1171
|
+
if (docExts.includes(ext))
|
|
1172
|
+
return 'document';
|
|
1173
|
+
if (sheetExts.includes(ext))
|
|
1174
|
+
return 'spreadsheet';
|
|
1175
|
+
if (pptExts.includes(ext))
|
|
1176
|
+
return 'presentation';
|
|
1177
|
+
if (codeExts.includes(ext))
|
|
1178
|
+
return 'code';
|
|
1179
|
+
if (archiveExts.includes(ext))
|
|
1180
|
+
return 'archive';
|
|
1181
|
+
return 'file';
|
|
1182
|
+
}
|
|
1183
|
+
getPreviewType(file) {
|
|
1184
|
+
const name = file.name;
|
|
1185
|
+
const ext = name.split('.').pop()?.toLowerCase();
|
|
1186
|
+
if (!ext)
|
|
1187
|
+
return 'unsupported';
|
|
1188
|
+
const imageExts = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp'];
|
|
1189
|
+
const videoExts = ['mp4', 'avi', 'mov', 'wmv', 'flv', 'mkv', 'webm'];
|
|
1190
|
+
const iframeExts = ['pdf', 'html'];
|
|
1191
|
+
if (imageExts.includes(ext))
|
|
1192
|
+
return 'image';
|
|
1193
|
+
if (videoExts.includes(ext))
|
|
1194
|
+
return 'video';
|
|
1195
|
+
if (iframeExts.includes(ext))
|
|
1196
|
+
return 'iframe';
|
|
1197
|
+
return 'unsupported';
|
|
1198
|
+
}
|
|
1199
|
+
handleRemove(uid) {
|
|
1200
|
+
this._adapter.emitRemove(uid);
|
|
1201
|
+
}
|
|
1202
|
+
handleRetryUpload(uid) {
|
|
1203
|
+
this._adapter.emitRetryUpload(uid);
|
|
1204
|
+
}
|
|
1205
|
+
handlePreview(file) {
|
|
1206
|
+
this._adapter.emitPreview(file);
|
|
1207
|
+
}
|
|
1208
|
+
handleDownload(file) {
|
|
1209
|
+
this._adapter.emitDownload(file);
|
|
1210
|
+
}
|
|
1211
|
+
handleRetryDownload(uid) {
|
|
1212
|
+
this._adapter.emitRetryDownload(uid);
|
|
1213
|
+
}
|
|
1214
|
+
handleMouseEnter(uid) {
|
|
1215
|
+
this._adapter.updateFileItem(uid, { isHovered: true });
|
|
1216
|
+
}
|
|
1217
|
+
handleMouseLeave(uid) {
|
|
1218
|
+
this._adapter.updateFileItem(uid, { isHovered: false });
|
|
1219
|
+
}
|
|
1220
|
+
getIconComponent(file) {
|
|
1221
|
+
if (file.type) {
|
|
1222
|
+
if (file.type?.startsWith('image/'))
|
|
1223
|
+
return 'image-icon';
|
|
1224
|
+
if (file.type?.startsWith('video/'))
|
|
1225
|
+
return 'mp4-icon';
|
|
1226
|
+
if (file.type?.startsWith('audio/'))
|
|
1227
|
+
return 'mp4-icon';
|
|
1228
|
+
if (file.type?.startsWith('text/'))
|
|
1229
|
+
return 'document-icon';
|
|
1230
|
+
if (file.type === 'application/pdf')
|
|
1231
|
+
return 'pdf-icon';
|
|
1232
|
+
if (file.type === 'application/zip' || file.type?.includes('compress'))
|
|
1233
|
+
return 'compressed-file-icon';
|
|
1234
|
+
}
|
|
1235
|
+
const extension = file.name.split('.').pop()?.toLowerCase();
|
|
1236
|
+
const extensionMap = {
|
|
1237
|
+
// Office & Documents
|
|
1238
|
+
ppt: 'ppt-icon',
|
|
1239
|
+
pptx: 'ppt-icon',
|
|
1240
|
+
pdf: 'pdf-icon',
|
|
1241
|
+
doc: 'document-icon',
|
|
1242
|
+
docx: 'document-icon',
|
|
1243
|
+
xls: 'excel-icon',
|
|
1244
|
+
xlsx: 'excel-icon',
|
|
1245
|
+
csv: 'excel-icon',
|
|
1246
|
+
txt: 'document-icon',
|
|
1247
|
+
rtf: 'document-icon',
|
|
1248
|
+
page: 'page-icon',
|
|
1249
|
+
md: 'markdown-icon',
|
|
1250
|
+
markdown: 'markdown-icon',
|
|
1251
|
+
// Image
|
|
1252
|
+
jpg: 'image-icon',
|
|
1253
|
+
jpeg: 'image-icon',
|
|
1254
|
+
png: 'image-icon',
|
|
1255
|
+
gif: 'image-icon',
|
|
1256
|
+
webp: 'image-icon',
|
|
1257
|
+
svg: 'image-icon',
|
|
1258
|
+
bmp: 'image-icon',
|
|
1259
|
+
// Video
|
|
1260
|
+
mp4: 'mp4-icon',
|
|
1261
|
+
avi: 'mp4-icon',
|
|
1262
|
+
mov: 'mp4-icon',
|
|
1263
|
+
wmv: 'mp4-icon',
|
|
1264
|
+
flv: 'mp4-icon',
|
|
1265
|
+
webm: 'mp4-icon',
|
|
1266
|
+
mkv: 'mp4-icon',
|
|
1267
|
+
// Audio
|
|
1268
|
+
mp3: 'mp4-icon',
|
|
1269
|
+
wav: 'mp4-icon',
|
|
1270
|
+
ogg: 'mp4-icon',
|
|
1271
|
+
flac: 'mp4-icon',
|
|
1272
|
+
aac: 'mp4-icon',
|
|
1273
|
+
// Code
|
|
1274
|
+
js: 'code-file-icon',
|
|
1275
|
+
ts: 'code-file-icon',
|
|
1276
|
+
jsx: 'code-file-icon',
|
|
1277
|
+
tsx: 'code-file-icon',
|
|
1278
|
+
html: 'code-file-icon',
|
|
1279
|
+
css: 'code-file-icon',
|
|
1280
|
+
scss: 'code-file-icon',
|
|
1281
|
+
less: 'code-file-icon',
|
|
1282
|
+
json: 'code-file-icon',
|
|
1283
|
+
yaml: 'code-file-icon',
|
|
1284
|
+
yml: 'code-file-icon',
|
|
1285
|
+
xml: 'code-file-icon',
|
|
1286
|
+
// Compressed
|
|
1287
|
+
zip: 'compressed-file-icon',
|
|
1288
|
+
rar: 'compressed-file-icon',
|
|
1289
|
+
'7z': 'compressed-file-icon',
|
|
1290
|
+
tar: 'compressed-file-icon',
|
|
1291
|
+
gz: 'compressed-file-icon',
|
|
1292
|
+
// Other
|
|
1293
|
+
mind: 'mind-icon',
|
|
1294
|
+
board: 'drawing-board-icon',
|
|
1295
|
+
flow: 'flow-chart-icon',
|
|
1296
|
+
email: 'email-file-icon',
|
|
1297
|
+
};
|
|
1298
|
+
return extensionMap[extension || ''] || 'unknown-icon';
|
|
1299
|
+
}
|
|
1300
|
+
}
|
|
1301
|
+
|
|
1302
|
+
class McFileIconComponent {
|
|
1303
|
+
constructor() {
|
|
1304
|
+
this.iconType = 'unknown-icon';
|
|
1305
|
+
this.size = 36;
|
|
1306
|
+
}
|
|
1307
|
+
get className() {
|
|
1308
|
+
return this.customClass || '';
|
|
1309
|
+
}
|
|
1310
|
+
ngOnInit() {
|
|
1311
|
+
console.log('iconType', this.iconType);
|
|
1312
|
+
}
|
|
1313
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: McFileIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1314
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: McFileIconComponent, isStandalone: true, selector: "mc-file-icon", inputs: { iconType: "iconType", size: "size", title: "title", customClass: "customClass" }, ngImport: i0, template: "<svg\r\n [attr.width]=\"size\"\r\n [attr.height]=\"size\"\r\n viewBox=\"0 0 32 32\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" fill=\"none\"\r\n role=\"img\"\r\n [attr.aria-label]=\"title\"\r\n [class]=\"className\"\r\n>\r\n <!-- \u56FE\u7247\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'image-icon'\">\r\n <defs>\r\n <mask id=\"mask_image\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_image)\">\r\n <use xlink:href=\"#use_image\" />\r\n </g>\r\n </mask>\r\n <g id=\"use_image\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(57,121,249)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_image\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u56FE\u7247\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"6\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"6\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u56FE\u6807/\u7A7A\u6587\u4EF6\u5939 copy 2\" mask=\"url(#mask_image)\">\r\n <use xlink:href=\"#use_image\" />\r\n <g id=\"\u7F16\u7EC4 27\">\r\n <path id=\"\u692D\u5706\u5F62\" d=\"M11.5 16.5C12.3284 16.5 13 15.8284 13 15C13 14.1716 12.3284 13.5 11.5 13.5C10.6716 13.5 10 14.1716 10 15C10 15.8284 10.6716 16.5 11.5 16.5Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u692D\u5706\u5F62\" d=\"M13 15C13 15.8284 12.3284 16.5 11.5 16.5C10.6716 16.5 10 15.8284 10 15C10 14.1716 10.6716 13.5 11.5 13.5C12.3284 13.5 13 14.1716 13 15ZM11.9634 14.8081C11.9878 14.867 12 14.931 12 15C12 15.069 11.9878 15.133 11.9634 15.1919C11.939 15.2509 11.9024 15.3047 11.8536 15.3536C11.8047 15.4024 11.7509 15.439 11.6919 15.4634C11.633 15.4878 11.569 15.5 11.5 15.5C11.431 15.5 11.367 15.4878 11.3081 15.4634C11.2491 15.439 11.1953 15.4024 11.1464 15.3536C11.0976 15.3047 11.061 15.2509 11.0366 15.1919C11.0122 15.133 11 15.069 11 15C11 14.931 11.0122 14.867 11.0366 14.8081C11.061 14.7491 11.0976 14.6953 11.1464 14.6464C11.1953 14.5976 11.2491 14.561 11.3081 14.5366C11.367 14.5122 11.431 14.5 11.5 14.5C11.569 14.5 11.633 14.5122 11.6919 14.5366C11.7509 14.561 11.8047 14.5976 11.8536 14.6464C11.9024 14.6953 11.939 14.7491 11.9634 14.8081Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M22.7002 23.126L18.6447 16.9265C18.3065 16.4096 17.5571 16.3873 17.1888 16.8831L15.2857 19.4454L13.7373 18.0224C13.3287 17.647 12.6798 17.734 12.3846 18.2038L9.28364 23.1397C8.91213 23.731 9.33716 24.5 10.0355 24.5L21.9572 24.5C22.6629 24.5 23.0866 23.7165 22.7002 23.126Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M14.5454 18.765L13.7373 18.0224C13.3287 17.647 12.6798 17.734 12.3846 18.2038L9.28364 23.1397C8.91213 23.731 9.33716 24.5 10.0355 24.5L21.9572 24.5C22.6629 24.5 23.0866 23.7165 22.7002 23.126L18.6447 16.9265C18.3065 16.4096 17.5571 16.3873 17.1888 16.8831L15.8852 18.6382L15.2857 19.4454L14.5454 18.765ZM17.8958 17.6084L15.4265 20.9329L13.1597 18.8498L10.2383 23.5L21.7499 23.5L17.8958 17.6084Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(157,189,252)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- PDF\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'pdf-icon'\">\r\n <defs>\r\n <mask id=\"mask_pdf\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_pdf)\">\r\n <use xlink:href=\"#use_pdf\" />\r\n </g>\r\n </mask>\r\n <g id=\"use_pdf\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(242,48,48)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_pdf\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"pdf\">\r\n <g id=\"\u56FE\u6807/pdf\u6587\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"8\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"8\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u7F16\u7EC4 2\">\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_pdf)\">\r\n <use xlink:href=\"#use_pdf\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(250,167,163)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"path6\" d=\"M16.364 18.6456C18.7712 21.8711 23.2379 23.4328 23.4902 21.3188C23.7425 19.2048 19.0713 19.4571 14.9933 20.5482C10.9085 21.6324 7.37606 24.1215 8.83541 25.5399C10.2879 26.9584 11.7814 24.7489 13.8067 20.0504C15.8321 15.345 17.5164 11.0352 15.1979 11.0352C12.8793 11.0352 13.9499 15.42 16.364 18.6456Z\" fill=\"rgb(0,0,0)\" fill-opacity=\"0\" fill-rule=\"nonzero\" />\r\n <path id=\"path6\" d=\"M23.4902 21.3188C23.7425 19.2048 19.0713 19.4571 14.9933 20.5482C10.9085 21.6324 7.37606 24.1215 8.83541 25.5399C10.2879 26.9584 11.7814 24.7489 13.8067 20.0504C15.8321 15.345 17.5164 11.0352 15.1979 11.0352C12.8793 11.0352 13.9499 15.42 16.364 18.6456C18.7712 21.8711 23.2379 23.4328 23.4902 21.3188Z\" fill-rule=\"nonzero\" stroke=\"rgb(255,255,255)\" stroke-linejoin=\"round\" stroke-width=\"1.5\" />\r\n </g>\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u672A\u77E5\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'unknown-icon'\">\r\n <defs>\r\n <mask id=\"mask_15\" width=\"24\" height=\"28\" x=\"4\" y=\"5\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline)\">\r\n <use xlink:href=\"#use_15\" />\r\n </g>\r\n </mask>\r\n <g id=\"use_15\">\r\n <path id=\"\u8499\u7248\" d=\"M7 5L22 5L28 11L28 30C28 31.6569 26.6569 33 25 33L7 33C5.34315 33 4 31.6569 4 30L4 8C4 6.34315 5.34315 5 7 5Z\" fill=\"rgb(189,189,189)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M22 5L7 5C5.34315 5 4 6.34315 4 8L4 30C4 31.6569 5.34315 33 7 33L25 33C26.6569 33 28 31.6569 28 30L28 11L22 5ZM21.5858 6L27 11.4142L27 30C27 30.1577 26.9824 30.3113 26.9472 30.4607C26.9217 30.5687 26.8871 30.6745 26.8432 30.7782C26.7974 30.8867 26.7429 30.9896 26.6798 31.0869C26.6037 31.2041 26.5152 31.3132 26.4142 31.4142C26.3132 31.5152 26.2041 31.6037 26.0869 31.6797C25.9896 31.7429 25.8867 31.7974 25.7782 31.8432C25.6745 31.8871 25.5687 31.9217 25.4607 31.9472C25.3113 31.9824 25.1577 32 25 32L7 32C6.84229 32 6.68872 31.9824 6.53931 31.9472C6.43131 31.9217 6.32548 31.8871 6.22182 31.8432C6.11331 31.7973 6.01038 31.7428 5.91305 31.6797C5.79586 31.6037 5.68677 31.5152 5.58579 31.4142C5.48479 31.3132 5.39628 31.2041 5.32027 31.0869C5.25715 30.9896 5.20265 30.8867 5.15676 30.7782C5.11292 30.6745 5.07827 30.5687 5.05282 30.4607C5.01761 30.3113 5 30.1577 5 30L5 8C5 7.84228 5.01761 7.68871 5.05282 7.53929C5.07827 7.4313 5.11292 7.32547 5.15676 7.22182C5.20266 7.1133 5.25717 7.01037 5.32031 6.91303C5.39631 6.79585 5.4848 6.68677 5.58579 6.58579C5.68677 6.4848 5.79585 6.39631 5.91303 6.32031C6.01037 6.25717 6.1133 6.20266 6.22182 6.15676C6.32547 6.11292 6.4313 6.07827 6.53929 6.05282C6.68871 6.01761 6.84228 6 7 6L21.5858 6Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n <filter id=\"filter_0\" width=\"16\" height=\"16\" x=\"17\" y=\"0\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix result=\"hardAlpha\" in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0 \" />\r\n <feOffset dx=\"0\" dy=\"0\" />\r\n <feGaussianBlur stdDeviation=\"1.66666663\" />\r\n <feComposite k2=\"-1\" k3=\"1\" in2=\"hardAlpha\" operator=\"out\" />\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0.643137 0 0 0 0 0.643137 0 0 0 0 0.643137 0 0 0 1 0 \" />\r\n <feBlend result=\"effect_dropShadow_1\" in2=\"BackgroundImageFix\" mode=\"normal\" />\r\n <feBlend result=\"shape\" in=\"SourceGraphic\" in2=\"effect_dropShadow_1\" mode=\"normal\" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u672A\u77E5\u6587\u4EF6\">\r\n <g id=\"\u56FE\u6807/\u672A\u77E5\u6587\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"3\" rx=\"8\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"3.5\" rx=\"8\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_15)\">\r\n <use xlink:href=\"#use_15\" />\r\n <g id=\"ic_public_questionmark\">\r\n <path id=\"path4\" d=\"M15.25 26.22C15.25 25.8224 15.5724 25.5 15.97 25.5L16 25.5C16.4142 25.5 16.75 25.8358 16.75 26.25C16.75 26.6642 16.4142 27 16 27L15.97 27C15.5724 27 15.25 26.6776 15.25 26.28L15.25 26.28L15.25 26.22Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" />\r\n <path id=\"path4\" d=\"M14.25 26.22C14.25 25.9872 14.2952 25.7639 14.3856 25.5502C14.4727 25.3443 14.5954 25.1622 14.7538 25.0038C14.9122 24.8454 15.0943 24.7227 15.3002 24.6356C15.5139 24.5452 15.7372 24.5 15.97 24.5L16 24.5C16.2369 24.5 16.4641 24.546 16.6815 24.6379C16.891 24.7265 17.0763 24.8514 17.2374 25.0126C17.3986 25.1737 17.5235 25.359 17.6121 25.5685C17.704 25.7859 17.75 26.0131 17.75 26.25C17.75 26.4869 17.704 26.7141 17.6121 26.9315C17.5235 27.141 17.3986 27.3263 17.2374 27.4874C17.0763 27.6486 16.891 27.7735 16.6815 27.8621C16.4641 27.954 16.2369 28 16 28L15.97 28C15.7372 28 15.5139 27.9548 15.3002 27.8644C15.0943 27.7773 14.9122 27.6546 14.7538 27.4962C14.5954 27.3378 14.4727 27.1557 14.3856 26.9498C14.2952 26.7361 14.25 26.5128 14.25 26.28L16.25 26.28C16.25 26.2027 16.2227 26.1367 16.168 26.082C16.1133 26.0273 16.0473 26 15.97 26L16 26C15.931 26 15.872 26.0244 15.8232 26.0732C15.7744 26.122 15.75 26.181 15.75 26.25C15.75 26.319 15.7744 26.378 15.8232 26.4268C15.872 26.4756 15.931 26.5 16 26.5L15.97 26.5C16.0473 26.5 16.1133 26.4727 16.168 26.418C16.2227 26.3633 16.25 26.2973 16.25 26.22L14.25 26.22ZM16.23 26.2L16.25 26.22C16.25 26.78 15.81 27.22 15.25 27.22C14.69 27.22 14.25 26.78 14.25 26.22L14.27 26.2L16.23 26.2ZMnan nanLnan nanCnan nan nan nan nan nanCnan nan nan nan nan nanLnan nan\" fill=\"rgb(25,25,25)\" fill-opacity=\"0\" fill-rule=\"nonzero\" />\r\n <path id=\"path5\" d=\"M16 23.5C16 23.2897 15.9663 22.5794 16 22.2727C16.028 22.0177 16.086 21.7987 16.2953 21.4564C16.6719 20.8404 17.836 20.1869 18.0114 20.0597C18.9117 19.407 19.5 18.3279 19.5 17.1072C19.5 15.115 17.933 13.5 16 13.5C14.067 13.5 12.5 15.115 12.5 17.1072\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" />\r\n </g>\r\n <g filter=\"url(#filter_0)\">\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 11L24 11C22.8954 11 22 10.1046 22 9L22 5L28 11Z\" fill=\"rgb(245,245,246)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 11L24 11C22.8954 11 22 10.1046 22 9L22 5L23 6L23 9C23 9.08264 23.0096 9.1629 23.0288 9.24079C23.0413 9.29117 23.0577 9.34055 23.0782 9.38894C23.1003 9.44134 23.1265 9.49116 23.1568 9.53839C23.1955 9.59887 23.2409 9.65511 23.2929 9.70711C23.3449 9.75911 23.4011 9.80448 23.4616 9.84322C23.5089 9.87346 23.5587 9.89966 23.6111 9.92183C23.6595 9.94229 23.7088 9.95874 23.7592 9.97117C23.8371 9.99039 23.9174 10 24 10L27 10L28 11Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u4EE3\u7801\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'code-file-icon'\">\r\n <defs>\r\n <mask id=\"mask_code\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_code)\">\r\n <use xlink:href=\"#use_code\" />\r\n </g>\r\n </mask>\r\n <g id=\"use_code\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(92,179,0)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_code\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u4EE3\u7801\u7C7B\u6587\u4EF6\">\r\n <g id=\"\u56FE\u6807/\u56FE\u7247\u6587\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"8\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"8\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u7F16\u7EC4 2\">\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_code)\">\r\n <use xlink:href=\"#use_code\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(185,230,131)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <g id=\"ic_public_code\">\r\n <path id=\"ic_public_code_2_5\" d=\"M0 0L7.06296 0\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" transform=\"matrix(0.351112,-0.936333,0.936333,0.351112,14.7598,21.8066)\" />\r\n <path id=\"\u77E2\u91CF 772\" d=\"M12 15L9.05221 18.4391C9.0217 18.4747 9.02001 18.5267 9.04813 18.5642L12 22.5\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 772\" d=\"M3 0L0.0522046 3.43909C0.0217021 3.47468 0.0200084 3.52668 0.0481303 3.56417L3 7.5\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(-1,0,0,1,23,15)\" />\r\n </g>\r\n </g>\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u538B\u7F29\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'compressed-file-icon'\">\r\n <mask id=\"mask_compressed\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_compressed)\">\r\n <use xlink:href=\"#use_compressed\" />\r\n </g>\r\n </mask>\r\n <defs>\r\n <g id=\"use_compressed\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(255,136,0)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_compressed\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u538B\u7F29\u6587\u4EF6\">\r\n <g id=\"\u56FE\u6807/\u538B\u7F29\u6587\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"8\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"8\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u7F16\u7EC4 2\">\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_compressed)\">\r\n <use xlink:href=\"#use_compressed\" />\r\n <g id=\"\u7F16\u7EC4-109\">\r\n <path id=\"Rectangle-16-Copy-2\" d=\"M11.8164 9.26886L14.6559 9.26886C14.844 9.26886 14.9966 9.42141 14.9966 9.60959L14.9966 10.7454C14.9966 10.9336 14.844 11.0861 14.6559 11.0861L11.8164 11.0861L11.8164 9.26886Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" />\r\n <path id=\"Rectangle-16-Copy-4\" d=\"M11.8164 12.9036L14.6559 12.9036C14.844 12.9036 14.9966 13.0562 14.9966 13.2444L14.9966 14.7209L14.9966 14.7209L11.8164 14.7209L11.8164 12.9036Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" />\r\n <path id=\"Rectangle-16-Copy\" d=\"M0 0L2.83945 0C3.02763 0 3.18019 0.152552 3.18019 0.340734L3.18019 1.47652C3.18019 1.6647 3.02763 1.81725 2.83945 1.81725L0 1.81725L0 0Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" transform=\"matrix(-1,0,0,1,13.1802,7.45172)\" />\r\n <path id=\"Rectangle-16-Copy-6\" d=\"M0.340734 0L3.18019 0L3.18019 0L3.18019 1.81725L0.340734 1.81725C0.152552 1.81725 0 1.6647 0 1.47652L0 0.340734C0 0.152552 0.152552 0 0.340734 0Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" transform=\"matrix(-1,0,0,1,14.9966,5.63434)\" />\r\n <path id=\"Rectangle-16-Copy-6\u5907\u4EFD-3\" d=\"M0 0L3.18019 0L3.18019 1.81725L0.340734 1.81725C0.152552 1.81725 0 1.6647 0 1.47652L0 0L0 0Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" transform=\"matrix(-1,0,0,1,14.9966,2.00006)\" />\r\n <path id=\"Rectangle-16-Copy-6\u5907\u4EFD-2\" d=\"M0 0L2.83945 0C3.02763 0 3.18019 0.152552 3.18019 0.340734L3.18019 1.47652C3.18019 1.6647 3.02763 1.81725 2.83945 1.81725L0 1.81725L0 0Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" transform=\"matrix(-1,0,0,1,13.1802,3.8172)\" />\r\n <path id=\"Rectangle-16-Copy-3\" d=\"M0 0L2.83945 0C3.02763 0 3.18019 0.152552 3.18019 0.340734L3.18019 1.47652C3.18019 1.6647 3.02763 1.81725 2.83945 1.81725L0 1.81725L0 0Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" transform=\"matrix(-1,0,0,1,13.1802,11.0862)\" />\r\n <path id=\"Combined-Shape\" d=\"M15 17.687L15 14.72L10.0026 14.72L10.0026 17.687C10.0026 18.0556 10.3015 18.3545 10.6701 18.3545L14.3324 18.3545C14.7011 18.3545 15 18.0556 15 17.687ZM11.2478 15.6313L13.7465 15.6313L13.7465 16.8807C13.7465 17.0689 13.5939 17.2214 13.4058 17.2214L11.5885 17.2214C11.4003 17.2214 11.2478 17.0689 11.2478 16.8807L11.2478 15.6313Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" />\r\n </g>\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(252,213,164)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u6587\u6863\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'document-icon'\">\r\n <defs>\r\n <mask id=\"mask_document\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_document)\">\r\n <use xlink:href=\"#use_document\" />\r\n </g>\r\n </mask>\r\n <g id=\"use_document\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(57,121,249)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_document\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u6587\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"6\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"6\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u56FE\u6807/\u7A7A\u6587\u4EF6\u5939 copy 2\" mask=\"url(#mask_document)\">\r\n <use xlink:href=\"#use_document\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(157,189,252)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <g id=\"\u7F16\u7EC4 29\">\r\n <circle id=\"\u692D\u5706\u5F62\" cx=\"9.25\" cy=\"13\" r=\"0.75\" fill=\"rgb(255,255,255)\" />\r\n <circle id=\"\u692D\u5706\u5F62\" cx=\"9.25\" cy=\"18\" r=\"0.75\" fill=\"rgb(255,255,255)\" />\r\n <circle id=\"\u692D\u5706\u5F62\" cx=\"9.25\" cy=\"23\" r=\"0.75\" fill=\"rgb(255,255,255)\" />\r\n </g>\r\n <path id=\"\u77E2\u91CF 777\" d=\"M12 13L23 13\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 781\" d=\"M12 18L23 18\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 782\" d=\"M12 23L23 23\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- Excel\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'excel-icon'\">\r\n <defs>\r\n <mask id=\"mask_excel\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_excel)\">\r\n <use xlink:href=\"#use_excel\" />\r\n </g>\r\n </mask>\r\n <g id=\"use_excel\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(37,194,81)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_excel\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u8868\u683C\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" fill=\"rgb(0,0,0)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_excel)\">\r\n <use xlink:href=\"#use_excel\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(146,224,165)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <g id=\"\u7EC4\u5408 3851\">\r\n <rect id=\"\u77E9\u5F62\" width=\"15\" height=\"13\" x=\"8.5\" y=\"12.5\" rx=\"2\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"15\" height=\"13\" x=\"8.5\" y=\"12.5\" rx=\"2\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 773\" d=\"M9 19L23 19\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 773\" d=\"M0 0L14 0\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(0,-1,1,0,16,26)\" />\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- PPT\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'ppt-icon'\">\r\n <g id=\"ppt\">\r\n <g id=\"\u56FE\u6807/ppt\u6587\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"8\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"8\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u7F16\u7EC4 2\">\r\n <g id=\"\u8DEF\u5F84\">\r\n <!-- \u6A59\u8272\u80CC\u666F\u5F62\u72B6 -->\r\n <path d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(255,136,0)\" fill-rule=\"evenodd\" />\r\n \r\n <!-- \u5185\u90E8\u767D\u8272 \"P\" \u5B57\u6BCD\u548C\u88C5\u9970 -->\r\n <g fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\">\r\n <path d=\"M11.8164 9.26886L14.6559 9.26886C14.844 9.26886 14.9966 9.42141 14.9966 9.60959L14.9966 10.7454C14.9966 10.9336 14.844 11.0861 14.6559 11.0861L11.8164 11.0861L11.8164 9.26886Z\" />\r\n <path d=\"M11.8164 12.9036L14.6559 12.9036C14.844 12.9036 14.9966 13.0562 14.9966 13.2444L14.9966 14.7209L14.9966 14.7209L11.8164 14.7209L11.8164 12.9036Z\" />\r\n <path d=\"M0 0L2.83945 0C3.02763 0 3.18019 0.152552 3.18019 0.340734L3.18019 1.47652C3.18019 1.6647 3.02763 1.81725 2.83945 1.81725L0 1.81725L0 0Z\" transform=\"matrix(-1,0,0,1,13.1802,7.45172)\" />\r\n <path d=\"M0.340734 0L3.18019 0L3.18019 0L3.18019 1.81725L0.340734 1.81725C0.152552 1.81725 0 1.6647 0 1.47652L0 0.340734C0 0.152552 0.152552 0 0.340734 0Z\" transform=\"matrix(-1,0,0,1,14.9966,5.63434)\" />\r\n <path d=\"M0 0L3.18019 0L3.18019 1.81725L0.340734 1.81725C0.152552 1.81725 0 1.6647 0 1.47652L0 0L0 0Z\" transform=\"matrix(-1,0,0,1,14.9966,2.00006)\" />\r\n <path d=\"M0 0L2.83945 0C3.02763 0 3.18019 0.152552 3.18019 0.340734L3.18019 1.47652C3.18019 1.6647 3.02763 1.81725 2.83945 1.81725L0 1.81725L0 0Z\" transform=\"matrix(-1,0,0,1,13.1802,3.8172)\" />\r\n <path d=\"M0 0L2.83945 0C3.02763 0 3.18019 0.152552 3.18019 0.340734L3.18019 1.47652C3.18019 1.6647 3.02763 1.81725 2.83945 1.81725L0 1.81725L0 0Z\" transform=\"matrix(-1,0,0,1,13.1802,11.0862)\" />\r\n <path d=\"M15 17.687L15 14.72L10.0026 14.72L10.0026 17.687C10.0026 18.0556 10.3015 18.3545 10.6701 18.3545L14.3324 18.3545C14.7011 18.3545 15 18.0556 15 17.687ZM11.2478 15.6313L13.7465 15.6313L13.7465 16.8807C13.7465 17.0689 13.5939 17.2214 13.4058 17.2214L11.5885 17.2214C11.4003 17.2214 11.2478 17.0689 11.2478 16.8807L11.2478 15.6313Z\" />\r\n </g>\r\n \r\n <!-- \u6298\u89D2\u90E8\u5206 -->\r\n <path d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(252,213,164)\" fill-rule=\"evenodd\" />\r\n </g>\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- Markdown\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'markdown-icon'\">\r\n <mask id=\"mask_markdown\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_markdown)\">\r\n <use xlink:href=\"#use_markdown\" />\r\n </g>\r\n </mask>\r\n <defs>\r\n <g id=\"use_markdown\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(37,194,81)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_markdown\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"markdown\">\r\n <g id=\"\u56FE\u6807/markdown\u6587\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"4\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"4\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u7F16\u7EC4 2\" mask=\"url(#mask_markdown)\">\r\n <use xlink:href=\"#use_markdown\" />\r\n <g id=\"\u7EC4\u5408 3854\">\r\n <path id=\"\u77E2\u91CF 770\" d=\"M0 0L8 0\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" transform=\"matrix(0,1,-1,0,9,14)\" />\r\n <path id=\"\u77E2\u91CF 790\" d=\"M0 0L8 0\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" transform=\"matrix(0,1,-1,0,17,14)\" />\r\n <path id=\"\u77E2\u91CF 794\" d=\"M0 0L8 0\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" transform=\"matrix(0,1,-1,0,22,14)\" />\r\n <path id=\"\u77E2\u91CF 795\" d=\"M20 20L21.9293 21.9293C21.9683 21.9683 22.0317 21.9683 22.0707 21.9293L24 20\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 791\" d=\"M9 14L12.9106 21.8211C12.9474 21.8948 13.0526 21.8948 13.0894 21.8211L17 14\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n </g>\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(146,224,165)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- MP4\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'mp4-icon'\">\r\n <defs>\r\n <g id=\"use_mp4\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(57,121,249)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_mp4\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n <mask id=\"mask_mp4\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_mp4)\">\r\n <use xlink:href=\"#use_mp4\" />\r\n </g>\r\n </mask>\r\n </defs>\r\n <g id=\"mp4\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"8\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"8\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_mp4)\">\r\n <use xlink:href=\"#use_mp4\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(157,189,252)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u77E2\u91CF 780\" d=\"M13.5 22.5433C13.5 22.6269 13.5965 22.6736 13.6621 22.6217L19.401 18.0784C19.4515 18.0384 19.4515 17.9616 19.401 17.9216L13.6621 13.3783C13.5965 13.3264 13.5 13.3731 13.5 13.4567L13.5 22.5433Z\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- EmailFile\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'email-file-icon'\">\r\n <defs>\r\n <g id=\"use_14\">\r\n <rect id=\"\u8499\u7248\" width=\"28\" height=\"22\" x=\"2\" y=\"5\" rx=\"4\" fill=\"rgb(255,136,0)\" />\r\n <rect id=\"\u8499\u7248\" width=\"27\" height=\"21\" x=\"2.5\" y=\"5.5\" rx=\"4\" stroke=\"rgb(223,225,230)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_email\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n <mask id=\"mask_14\" width=\"28\" height=\"22\" x=\"2\" y=\"5\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_email)\">\r\n <use xlink:href=\"#use_14\" />\r\n </g>\r\n </mask>\r\n <linearGradient id=\"paint_linear_0\" x1=\"14.3386717\" x2=\"14.3386717\" y1=\"0\" y2=\"11.6952209\" gradientUnits=\"userSpaceOnUse\">\r\n <stop stop-color=\"rgb(246,247,253)\" offset=\"0\" stop-opacity=\"1\" />\r\n <stop stop-color=\"rgb(233,237,250)\" offset=\"1\" stop-opacity=\"1\" />\r\n </linearGradient>\r\n <linearGradient id=\"paint_linear_1\" x1=\"16\" x2=\"16\" y1=\"3\" y2=\"17\" gradientUnits=\"userSpaceOnUse\">\r\n <stop stop-color=\"rgb(246,247,253)\" offset=\"0\" stop-opacity=\"1\" />\r\n <stop stop-color=\"rgb(233,237,250)\" offset=\"1\" stop-opacity=\"1\" />\r\n </linearGradient>\r\n </defs>\r\n <g id=\"\u90AE\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"4\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"4\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u77E9\u5F62\" mask=\"url(#mask_14)\">\r\n <use xlink:href=\"#use_14\" />\r\n <path id=\"\u5F62\u72B6\" d=\"M0.341524 1.75256L11.7046 11.6952L0.999972 0C0.711642 0 0.43735 0.124481 0.247408 0.341492C-0.116239 0.757141 -0.074125 1.38889 0.341524 1.75256ZM27.6773 0C28.2296 0 28.6773 0.447723 28.6773 1C28.6773 1.28836 28.5528 1.56268 28.3358 1.75256L16.9727 11.6952L27.6773 0Z\" opacity=\"0\" fill=\"url(#paint_linear_0)\" fill-opacity=\"0\" fill-rule=\"evenodd\" transform=\"matrix(1,0,0,-1,1.66125,27.4999)\" />\r\n <path id=\"\u5F62\u72B6\" d=\"M0.341524 1.75256L11.7046 11.6952L0.999972 0C0.711642 0 0.43735 0.124481 0.247408 0.341492C-0.116239 0.757141 -0.074125 1.38889 0.341524 1.75256ZM27.6773 0C28.2296 0 28.6773 0.447723 28.6773 1C28.6773 1.28836 28.5528 1.56268 28.3358 1.75256L16.9727 11.6952L27.6773 0Z\" opacity=\"0\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" transform=\"matrix(1,0,0,-1,1.66125,27.4999)\" />\r\n <path id=\"\u77E9\u5F62\" d=\"M2.66145 3L29.3386 3C30.2619 3 30.692 4.14454 29.9971 4.75258L18.634 14.6952C17.1259 16.0148 14.8741 16.0148 13.366 14.6952L2.00294 4.75258C1.30804 4.14454 1.73808 3 2.66145 3Z\" fill=\"url(#paint_linear_1)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u77E9\u5F62\" d=\"M29.3386 3C30.2619 3 30.692 4.14454 29.9971 4.75258L18.634 14.6952C17.1259 16.0148 14.8741 16.0148 13.366 14.6952L2.00294 4.75258C1.30804 4.14454 1.73808 3 2.66145 3L29.3386 3Z\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 789\" d=\"M0 0L15.5563 0\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(0.707107,-0.707107,0.707107,0.707107,3,26)\" />\r\n <path id=\"\u77E2\u91CF 789\" d=\"M0 0L15.5563 0\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(-0.707107,-0.707107,-0.707107,0.707107,29,26)\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- Markdown\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'markdown-icon'\">\r\n <defs>\r\n <g id=\"use_18\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(37,194,81)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_markdown\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n <mask id=\"mask_18\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_markdown)\">\r\n <use xlink:href=\"#use_18\" />\r\n </g>\r\n </mask>\r\n </defs>\r\n <rect id=\"\u96EA\u78A7\u56FE/32px/markdown\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" />\r\n <g id=\"\u56FE\u6807/markdown\u6587\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"4\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"4\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u7F16\u7EC4 2\" mask=\"url(#mask_18)\">\r\n <use xlink:href=\"#use_18\" />\r\n <g id=\"\u7EC4\u5408 3854\">\r\n <path id=\"\u77E2\u91CF 770\" d=\"M0 0L8 0\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" transform=\"matrix(0,1,-1,0,9,14)\" />\r\n <path id=\"\u77E2\u91CF 790\" d=\"M0 0L8 0\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" transform=\"matrix(0,1,-1,0,17,14)\" />\r\n <path id=\"\u77E2\u91CF 794\" d=\"M0 0L8 0\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" transform=\"matrix(0,1,-1,0,22,14)\" />\r\n <path id=\"\u77E2\u91CF 795\" d=\"M20 20L21.9293 21.9293C21.9683 21.9683 22.0317 21.9683 22.0707 21.9293L24 20\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 791\" d=\"M9 14L12.9106 21.8211C12.9474 21.8948 13.0526 21.8948 13.0894 21.8211L17 14\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n </g>\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(146,224,165)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- Excel\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'excel-icon'\">\r\n <defs>\r\n <g id=\"use_6\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(37,194,81)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_excel\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n <mask id=\"mask_6\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_excel)\">\r\n <use xlink:href=\"#use_6\" />\r\n </g>\r\n </mask>\r\n </defs>\r\n <g id=\"\u8868\u683C\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" fill=\"rgb(0,0,0)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_6)\">\r\n <use xlink:href=\"#use_6\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(146,224,165)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <g id=\"\u7EC4\u5408 3851\">\r\n <rect id=\"\u77E9\u5F62\" width=\"15\" height=\"13\" x=\"8.5\" y=\"12.5\" rx=\"2\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"15\" height=\"13\" x=\"8.5\" y=\"12.5\" rx=\"2\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 773\" d=\"M9 19L23 19\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 773\" d=\"M0 0L14 0\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(0,-1,1,0,16,26)\" />\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- Ppt\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'ppt-icon'\">\r\n <g>\r\n <!-- \u6A59\u8272\u80CC\u666F\u5F62\u72B6 -->\r\n <path d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(255,136,0)\" fill-rule=\"evenodd\" />\r\n \r\n <!-- \u5185\u90E8\u767D\u8272 \"P\" \u5B57\u6BCD\u548C\u88C5\u9970 -->\r\n <g fill=\"#FFF\" fill-rule=\"evenodd\">\r\n <path d=\"M11.8164 9.26886L14.6559 9.26886C14.844 9.26886 14.9966 9.42141 14.9966 9.60959L14.9966 10.7454C14.9966 10.9336 14.844 11.0861 14.6559 11.0861L11.8164 11.0861L11.8164 9.26886Z\" />\r\n <path d=\"M11.8164 12.9036L14.6559 12.9036C14.844 12.9036 14.9966 13.0562 14.9966 13.2444L14.9966 14.7209L14.9966 14.7209L11.8164 14.7209L11.8164 12.9036Z\" />\r\n <path d=\"M0 0L2.83945 0C3.02763 0 3.18019 0.152552 3.18019 0.340734L3.18019 1.47652C3.18019 1.6647 3.02763 1.81725 2.83945 1.81725L0 1.81725L0 0Z\" transform=\"matrix(-1,0,0,1,13.1802,7.45172)\" />\r\n <path d=\"M0.340734 0L3.18019 0L3.18019 0L3.18019 1.81725L0.340734 1.81725C0.152552 1.81725 0 1.6647 0 1.47652L0 0.340734C0 0.152552 0.152552 0 0.340734 0Z\" transform=\"matrix(-1,0,0,1,14.9966,5.63434)\" />\r\n <path d=\"M0 0L3.18019 0L3.18019 1.81725L0.340734 1.81725C0.152552 1.81725 0 1.6647 0 1.47652L0 0L0 0Z\" transform=\"matrix(-1,0,0,1,14.9966,2.00006)\" />\r\n <path d=\"M0 0L2.83945 0C3.02763 0 3.18019 0.152552 3.18019 0.340734L3.18019 1.47652C3.18019 1.6647 3.02763 1.81725 2.83945 1.81725L0 1.81725L0 0Z\" transform=\"matrix(-1,0,0,1,13.1802,3.8172)\" />\r\n <path d=\"M0 0L2.83945 0C3.02763 0 3.18019 0.152552 3.18019 0.340734L3.18019 1.47652C3.18019 1.6647 3.02763 1.81725 2.83945 1.81725L0 1.81725L0 0Z\" transform=\"matrix(-1,0,0,1,13.1802,11.0862)\" />\r\n <path d=\"M15 17.687L15 14.72L10.0026 14.72L10.0026 17.687C10.0026 18.0556 10.3015 18.3545 10.6701 18.3545L14.3324 18.3545C14.7011 18.3545 15 18.0556 15 17.687ZM11.2478 15.6313L13.7465 15.6313L13.7465 16.8807C13.7465 17.0689 13.5939 17.2214 13.4058 17.2214L11.5885 17.2214C11.4003 17.2214 11.2478 17.0689 11.2478 16.8807L11.2478 15.6313Z\" />\r\n </g>\r\n \r\n <!-- \u6298\u89D2\u90E8\u5206 -->\r\n <path d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(252,213,164)\" fill-rule=\"evenodd\" />\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- Mp4\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'mp4-icon'\">\r\n <defs>\r\n <g id=\"use_9\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(57,121,249)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_mp4\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n <mask id=\"mask_9\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_mp4)\">\r\n <use xlink:href=\"#use_9\" />\r\n </g>\r\n </mask>\r\n </defs>\r\n <g id=\"mp4\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"8\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"8\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_9)\">\r\n <use xlink:href=\"#use_9\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(157,189,252)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u77E2\u91CF 780\" d=\"M13.5 22.5433C13.5 22.6269 13.5965 22.6736 13.6621 22.6217L19.401 18.0784C19.4515 18.0384 19.4515 17.9616 19.401 17.9216L13.6621 13.3783C13.5965 13.3264 13.5 13.3731 13.5 13.4567L13.5 22.5433Z\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- Unknown\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'unknown-icon'\">\r\n <defs>\r\n <g id=\"use_15\">\r\n <path id=\"\u8499\u7248\" d=\"M7 5L22 5L28 11L28 30C28 31.6569 26.6569 33 25 33L7 33C5.34315 33 4 31.6569 4 30L4 8C4 6.34315 5.34315 5 7 5Z\" fill=\"rgb(189,189,189)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M22 5L7 5C5.34315 5 4 6.34315 4 8L4 30C4 31.6569 5.34315 33 7 33L25 33C26.6569 33 28 31.6569 28 30L28 11L22 5ZM21.5858 6L27 11.4142L27 30C27 30.1577 26.9824 30.3113 26.9472 30.4607C26.9217 30.5687 26.8871 30.6745 26.8432 30.7782C26.7974 30.8867 26.7429 30.9896 26.6798 31.0869C26.6037 31.2041 26.5152 31.3132 26.4142 31.4142C26.3132 31.5152 26.2041 31.6037 26.0869 31.6797C25.9896 31.7429 25.8867 31.7974 25.7782 31.8432C25.6745 31.8871 25.5687 31.9217 25.4607 31.9472C25.3113 31.9824 25.1577 32 25 32L7 32C6.84229 32 6.68872 31.9824 6.53931 31.9472C6.43131 31.9217 6.32548 31.8871 6.22182 31.8432C6.11331 31.7973 6.01038 31.7428 5.91305 31.6797C5.79586 31.6037 5.68677 31.5152 5.58579 31.4142C5.48479 31.3132 5.39628 31.2041 5.32027 31.0869C5.25715 30.9896 5.20265 30.8867 5.15676 30.7782C5.11292 30.6745 5.07827 30.5687 5.05282 30.4607C5.01761 30.3113 5 30.1577 5 30L5 8C5 7.84228 5.01761 7.68871 5.05282 7.53929C5.07827 7.4313 5.11292 7.32547 5.15676 7.22182C5.20266 7.1133 5.25717 7.01037 5.32031 6.91303C5.39631 6.79585 5.4848 6.68677 5.58579 6.58579C5.68677 6.4848 5.79585 6.39631 5.91303 6.32031C6.01037 6.25717 6.1133 6.20266 6.22182 6.15676C6.32547 6.11292 6.4313 6.07827 6.53929 6.05282C6.68871 6.01761 6.84228 6 7 6L21.5858 6Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_unknown\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n <mask id=\"mask_15\" width=\"24\" height=\"28\" x=\"4\" y=\"5\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_unknown)\">\r\n <use xlink:href=\"#use_15\" />\r\n </g>\r\n </mask>\r\n <filter id=\"filter_0\" width=\"16\" height=\"16\" x=\"17\" y=\"0\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix result=\"hardAlpha\" in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0 \" />\r\n <feOffset dx=\"0\" dy=\"0\" />\r\n <feGaussianBlur stdDeviation=\"1.66666663\" />\r\n <feComposite k2=\"-1\" k3=\"1\" in2=\"hardAlpha\" operator=\"out\" />\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0.643137 0 0 0 0 0.643137 0 0 0 0 0.643137 0 0 0 1 0 \" />\r\n <feBlend result=\"effect_dropShadow_1\" in2=\"BackgroundImageFix\" mode=\"normal\" />\r\n <feBlend result=\"shape\" in=\"SourceGraphic\" in2=\"effect_dropShadow_1\" mode=\"normal\" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u672A\u77E5\u6587\u4EF6\">\r\n <g id=\"\u56FE\u6807/\u672A\u77E5\u6587\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"3\" rx=\"8\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"3.5\" rx=\"8\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_15)\">\r\n <use xlink:href=\"#use_15\" />\r\n <g id=\"ic_public_questionmark\">\r\n <path id=\"path4\" d=\"M15.25 26.22C15.25 25.8224 15.5724 25.5 15.97 25.5L16 25.5C16.4142 25.5 16.75 25.8358 16.75 26.25C16.75 26.6642 16.4142 27 16 27L15.97 27C15.5724 27 15.25 26.6776 15.25 26.28L15.25 26.28L15.25 26.22Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" />\r\n <path id=\"path4\" d=\"M14.25 26.22C14.25 25.9872 14.2952 25.7639 14.3856 25.5502C14.4727 25.3443 14.5954 25.1622 14.7538 25.0038C14.9122 24.8454 15.0943 24.7227 15.3002 24.6356C15.5139 24.5452 15.7372 24.5 15.97 24.5L16 24.5C16.2369 24.5 16.4641 24.546 16.6815 24.6379C16.891 24.7265 17.0763 24.8514 17.2374 25.0126C17.3986 25.1737 17.5235 25.359 17.6121 25.5685C17.704 25.7859 17.75 26.0131 17.75 26.25C17.75 26.4869 17.704 26.7141 17.6121 26.9315C17.5235 27.141 17.3986 27.3263 17.2374 27.4874C17.0763 27.6486 16.891 27.7735 16.6815 27.8621C16.4641 27.954 16.2369 28 16 28L15.97 28C15.7372 28 15.5139 27.9548 15.3002 27.8644C15.0943 27.7773 14.9122 27.6546 14.7538 27.4962C14.5954 27.3378 14.4727 27.1557 14.3856 26.9498C14.2952 26.7361 14.25 26.5128 14.25 26.28L16.25 26.28C16.25 26.2027 16.2227 26.1367 16.168 26.082C16.1133 26.0273 16.0473 26 15.97 26L16 26C15.931 26 15.872 26.0244 15.8232 26.0732C15.7744 26.122 15.75 26.181 15.75 26.25C15.75 26.319 15.7744 26.378 15.8232 26.4268C15.872 26.4756 15.931 26.5 16 26.5L15.97 26.5C16.0473 26.5 16.1133 26.4727 16.168 26.418C16.2227 26.3633 16.25 26.2973 16.25 26.22L14.25 26.22ZM16.23 26.2L16.25 26.22C16.25 26.78 15.81 27.22 15.25 27.22C14.69 27.22 14.25 26.78 14.25 26.22L14.27 26.2L16.23 26.2ZMnan nanLnan nanCnan nan nan nan nan nanCnan nan nan nan nan nanLnan nan\" fill=\"rgb(25,25,25)\" fill-opacity=\"0\" fill-rule=\"nonzero\" />\r\n <path id=\"path5\" d=\"M16 23.5C16 23.2897 15.9663 22.5794 16 22.2727C16.028 22.0177 16.086 21.7987 16.2953 21.4564C16.6719 20.8404 17.836 20.1869 18.0114 20.0597C18.9117 19.407 19.5 18.3279 19.5 17.1072C19.5 15.115 17.933 13.5 16 13.5C14.067 13.5 12.5 15.115 12.5 17.1072\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" />\r\n </g>\r\n <g filter=\"url(#filter_0)\">\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 11L24 11C22.8954 11 22 10.1046 22 9L22 5L28 11Z\" fill=\"rgb(245,245,246)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 11L24 11C22.8954 11 22 10.1046 22 9L22 5L23 6L23 9C23 9.08264 23.0096 9.1629 23.0288 9.24079C23.0413 9.29117 23.0577 9.34055 23.0782 9.38894C23.1003 9.44134 23.1265 9.49116 23.1568 9.53839C23.1955 9.59887 23.2409 9.65511 23.2929 9.70711C23.3449 9.75911 23.4011 9.80448 23.4616 9.84322C23.5089 9.87346 23.5587 9.89966 23.6111 9.92183C23.6595 9.94229 23.7088 9.95874 23.7592 9.97117C23.8371 9.99039 23.9174 10 24 10L27 10L28 11Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- EmailFile\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'email-file-icon'\">\r\n <defs>\r\n\t<g id=\"use_14\">\r\n\t\t<rect id=\"\u8499\u7248\" width=\"28\" height=\"22\" x=\"2\" y=\"5\" rx=\"4\" fill=\"rgb(255,136,0)\" />\r\n\t\t<rect id=\"\u8499\u7248\" width=\"27\" height=\"21\" x=\"2.5\" y=\"5.5\" rx=\"4\" stroke=\"rgb(223,225,230)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n\t</g>\r\n\t<filter id=\"pixso_custom_mask_type_outline_email\">\r\n\t\t<feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n\t</filter>\r\n\t<mask id=\"mask_14\" width=\"28\" height=\"22\" x=\"2\" y=\"5\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n\t<g filter=\"url(#pixso_custom_mask_type_outline_email)\">\r\n\t\t<use xlink:href=\"#use_14\" />\r\n\t</g>\r\n</mask>\r\n\t<linearGradient id=\"paint_linear_0\" x1=\"14.3386717\" x2=\"14.3386717\" y1=\"0\" y2=\"11.6952209\" gradientUnits=\"userSpaceOnUse\">\r\n\t\t<stop stop-color=\"rgb(246,247,253)\" offset=\"0\" stop-opacity=\"1\" />\r\n\t\t<stop stop-color=\"rgb(233,237,250)\" offset=\"1\" stop-opacity=\"1\" />\r\n\t</linearGradient>\r\n\t<linearGradient id=\"paint_linear_1\" x1=\"16\" x2=\"16\" y1=\"3\" y2=\"17\" gradientUnits=\"userSpaceOnUse\">\r\n\t\t<stop stop-color=\"rgb(246,247,253)\" offset=\"0\" stop-opacity=\"1\" />\r\n\t\t<stop stop-color=\"rgb(233,237,250)\" offset=\"1\" stop-opacity=\"1\" />\r\n\t</linearGradient>\r\n</defs>\r\n<g id=\"\u90AE\u4EF6\">\r\n\t<rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"4\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n\t<rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"4\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n\t<g id=\"\u77E9\u5F62\" mask=\"url(#mask_14)\">\r\n\t\t<use xlink:href=\"#use_14\" />\r\n\t\t<path id=\"\u5F62\u72B6\" d=\"M2.66145 3L29.3386 3C30.2619 3 30.692 4.14454 29.9971 4.75258L18.634 14.6952C17.1259 16.0148 14.8741 16.0148 13.366 14.6952L2.00294 4.75258C1.30804 4.14454 1.73808 3 2.66145 3Z\" fill=\"url(#paint_linear_1)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n\t\t<path id=\"\u77E9\u5F62\" d=\"M29.3386 3C30.2619 3 30.692 4.14454 29.9971 4.75258L18.634 14.6952C17.1259 16.0148 14.8741 16.0148 13.366 14.6952L2.00294 4.75258C1.30804 4.14454 1.73808 3 2.66145 3L29.3386 3Z\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n\t\t<path id=\"\u77E2\u91CF 789\" d=\"M0 0L15.5563 0\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(0.707107,-0.707107,0.707107,0.707107,3,26)\" />\r\n\t\t<path id=\"\u77E2\u91CF 789\" d=\"M0 0L15.5563 0\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(-0.707107,-0.707107,-0.707107,0.707107,29,26)\" />\r\n\t</g>\r\n</g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- DrawingBoard\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'drawing-board-icon'\">\r\n <defs>\r\n <g id=\"use_drawingboard\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(92,179,0)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_drawingboard\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n <mask id=\"mask_drawingboard\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_drawingboard)\">\r\n <use xlink:href=\"#use_drawingboard\" />\r\n </g>\r\n </mask>\r\n </defs>\r\n <clipPath id=\"clipPath_drawingboard\">\r\n <rect width=\"15\" height=\"16\" x=\"9\" y=\"11\" fill=\"rgb(255,255,255)\" />\r\n </clipPath>\r\n <g id=\"\u753B\u677F\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" fill=\"rgb(0,0,0)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_drawingboard)\">\r\n <use xlink:href=\"#use_drawingboard\" />\r\n <g id=\"svg\" clip-path=\"url(#clipPath_drawingboard)\" customFrame=\"url(#clipPath_drawingboard)\">\r\n <rect id=\"svg\" width=\"15\" height=\"16\" x=\"9\" y=\"11\" />\r\n <g id=\"ic_public_office_brush-\u753B\u7B14/base/ic_public_office_brush1\">\r\n <path id=\"path6\" d=\"M13.5333 23.4382L9.875 24.8333L11.4169 20.7952L19.1124 13.1001C19.8016 12.4109 20.919 12.411 21.6081 13.1002C22.2973 13.7894 22.2973 14.9069 21.6081 15.5961L14.8912 22.3175\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" />\r\n <line id=\"path7\" x1=\"0\" x2=\"3.51560974\" y1=\"0\" y2=\"0\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"square\" stroke-linejoin=\"round\" stroke-width=\"1.5\" transform=\"matrix(0.705038,0.70917,-0.70917,0.705038,18.5347,13.6929)\" />\r\n <path id=\"path8\" d=\"M16.3501 23.632C16.7621 24.4423 17.2822 24.8475 17.9105 24.8475C18.8918 24.8475 19.3342 23.6954 20.1977 23.632C20.7734 23.5898 21.3469 23.8969 21.9183 24.5533\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 793\" d=\"M14 25.0878C14.1434 25.1785 14.5505 25.3054 15.0323 25.0878C15.514 24.8703 17.7849 24 18.2151 24C18.6452 24 18.7828 24.272 18.6452 24.6346C18.5075 24.9972 17.957 25.6318 18.129 25.9037C18.3011 26.1756 19.9355 25.8131 20.6237 25.5411C21.3118 25.2691 21.828 25.3598 22 25.5411\" opacity=\"0\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"path9\" d=\"M20.1849 23.4575C20.8232 23.4106 21.4459 23.7441 22.0503 24.4384C22.1137 24.5113 22.1061 24.6219 22.0332 24.6853C21.9603 24.7488 21.8497 24.7411 21.7863 24.6682C21.2478 24.0496 20.7235 23.7689 20.2105 23.8065C19.9376 23.8265 19.7196 23.9568 19.338 24.287C19.2903 24.3284 19.2903 24.3284 19.2421 24.3704C18.6985 24.8433 18.3888 25.0225 17.9105 25.0225C17.2076 25.0225 16.6332 24.5751 16.1941 23.7113C16.1503 23.6251 16.1846 23.5198 16.2708 23.476C16.3569 23.4322 16.4623 23.4665 16.5061 23.5527C16.8908 24.3095 17.3568 24.6725 17.9105 24.6725C18.2771 24.6725 18.5295 24.5264 19.0123 24.1063C19.0605 24.0644 19.0605 24.0644 19.109 24.0223C19.5446 23.6454 19.8136 23.4847 20.1849 23.4575Z\" fill=\"rgb(255,255,255)\" fill-opacity=\"0\" fill-rule=\"nonzero\" />\r\n <path id=\"path9\" d=\"M22.0503 24.4384C22.1137 24.5113 22.1061 24.6219 22.0332 24.6853C21.9603 24.7488 21.8497 24.7411 21.7863 24.6682C21.2478 24.0496 20.7235 23.7689 20.2105 23.8065C19.9376 23.8265 19.7196 23.9568 19.338 24.287C19.2903 24.3284 19.2903 24.3284 19.2421 24.3704C18.6985 24.8433 18.3888 25.0225 17.9105 25.0225C17.2076 25.0225 16.6332 24.5751 16.1941 23.7113C16.1503 23.6251 16.1846 23.5198 16.2708 23.476C16.3569 23.4322 16.4623 23.4665 16.5061 23.5527C16.8908 24.3095 17.3568 24.6725 17.9105 24.6725C18.2771 24.6725 18.5295 24.5264 19.0123 24.1063C19.0605 24.0644 19.0605 24.0644 19.109 24.0223C19.5446 23.6454 19.8136 23.4847 20.1849 23.4575C20.8232 23.4106 21.4459 23.7441 22.0503 24.4384Z\" fill-rule=\"nonzero\" stroke=\"rgb(255,255,255)\" stroke-opacity=\"0\" stroke-linejoin=\"round\" stroke-width=\"0.699999988\" />\r\n </g>\r\n </g>\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(185,230,131)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84 6\" d=\"M8.5 21.3938L12.2173 17.4814L16.3341 22L23.5 14L8.5 21.3938Z\" opacity=\"0\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84 6\" d=\"M8.5 21.3938L12.2173 17.4814L16.3341 22L23.5 14\" opacity=\"0\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- EmailFile\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'email-file-icon'\">\r\n <mask id=\"mask_emailfile\" width=\"28\" height=\"22\" x=\"2\" y=\"5\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_emailfile)\">\r\n <use xlink:href=\"#use_emailfile\" />\r\n </g>\r\n </mask>\r\n <defs>\r\n <g id=\"use_emailfile\">\r\n <rect id=\"\u8499\u7248\" width=\"28\" height=\"22\" x=\"2\" y=\"5\" rx=\"4\" fill=\"rgb(255,136,0)\" />\r\n <rect id=\"\u8499\u7248\" width=\"27\" height=\"21\" x=\"2.5\" y=\"5.5\" rx=\"4\" stroke=\"rgb(223,225,230)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_emailfile\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n <linearGradient id=\"paint_linear_0_emailfile\" x1=\"14.3386717\" x2=\"14.3386717\" y1=\"0\" y2=\"11.6952209\" gradientUnits=\"userSpaceOnUse\">\r\n <stop stop-color=\"rgb(246,247,253)\" offset=\"0\" stop-opacity=\"1\" />\r\n <stop stop-color=\"rgb(233,237,250)\" offset=\"1\" stop-opacity=\"1\" />\r\n </linearGradient>\r\n <linearGradient id=\"paint_linear_1_emailfile\" x1=\"16\" x2=\"16\" y1=\"3\" y2=\"17\" gradientUnits=\"userSpaceOnUse\">\r\n <stop stop-color=\"rgb(246,247,253)\" offset=\"0\" stop-opacity=\"1\" />\r\n <stop stop-color=\"rgb(233,237,250)\" offset=\"1\" stop-opacity=\"1\" />\r\n </linearGradient>\r\n </defs>\r\n <g id=\"\u90AE\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"4\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"4\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u77E9\u5F62\" mask=\"url(#mask_emailfile)\">\r\n <use xlink:href=\"#use_emailfile\" />\r\n <path id=\"\u5F62\u72B6\" d=\"M0.341524 1.75256L11.7046 11.6952L0.999972 0C0.711642 0 0.43735 0.124481 0.247408 0.341492C-0.116239 0.757141 -0.074125 1.38889 0.341524 1.75256ZM27.6773 0C28.2296 0 28.6773 0.447723 28.6773 1C28.6773 1.28836 28.5528 1.56268 28.3358 1.75256L16.9727 11.6952L27.6773 0Z\" opacity=\"0\" fill=\"url(#paint_linear_0_emailfile)\" fill-opacity=\"0\" fill-rule=\"evenodd\" transform=\"matrix(1,0,0,-1,1.66125,27.4999)\" />\r\n <path id=\"\u5F62\u72B6\" d=\"M0.341524 1.75256L11.7046 11.6952L0.999972 0C0.711642 0 0.43735 0.124481 0.247408 0.341492C-0.116239 0.757141 -0.074125 1.38889 0.341524 1.75256ZM27.6773 0C28.2296 0 28.6773 0.447723 28.6773 1C28.6773 1.28836 28.5528 1.56268 28.3358 1.75256L16.9727 11.6952L27.6773 0Z\" opacity=\"0\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" transform=\"matrix(1,0,0,-1,1.66125,27.4999)\" />\r\n <path id=\"\u77E9\u5F62\" d=\"M2.66145 3L29.3386 3C30.2619 3 30.692 4.14454 29.9971 4.75258L18.634 14.6952C17.1259 16.0148 14.8741 16.0148 13.366 14.6952L2.00294 4.75258C1.30804 4.14454 1.73808 3 2.66145 3Z\" fill=\"url(#paint_linear_1_emailfile)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u77E9\u5F62\" d=\"M29.3386 3C30.2619 3 30.692 4.14454 29.9971 4.75258L18.634 14.6952C17.1259 16.0148 14.8741 16.0148 13.366 14.6952L2.00294 4.75258C1.30804 4.14454 1.73808 3 2.66145 3L29.3386 3Z\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 789\" d=\"M0 0L15.5563 0\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(0.707107,-0.707107,0.707107,0.707107,3,26)\" />\r\n <path id=\"\u77E2\u91CF 789\" d=\"M0 0L15.5563 0\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(-0.707107,-0.707107,-0.707107,0.707107,29,26)\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- FlowChart\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'flow-chart-icon'\">\r\n <mask id=\"mask_flowchart\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_flowchart)\">\r\n <use xlink:href=\"#use_flowchart\" />\r\n </g>\r\n </mask>\r\n <defs>\r\n <g id=\"use_flowchart\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(242,48,48)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_flowchart\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u6D41\u7A0B\u56FE\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" fill=\"rgb(0,0,0)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u7F16\u7EC4 2\" mask=\"url(#mask_flowchart)\">\r\n <use xlink:href=\"#use_flowchart\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(250,167,163)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M6.54991 5L2.5 5C1.11929 5 -1.09279e-07 3.88071 -1.09279e-07 2.5C-1.09279e-07 1.11929 1.11929 0 2.5 0L12 0L6.54991 5Z\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" fill-rule=\"evenodd\" transform=\"matrix(-1,0,0,1,23.5,13)\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M6.54991 5L2.5 5C1.11929 5 -1.09279e-07 3.88071 -1.09279e-07 2.5C-1.09279e-07 1.11929 1.11929 0 2.5 0L12 0\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(-1,0,0,1,23.5,13)\" />\r\n <path id=\"\u8DEF\u5F84\u5907\u4EFD\" d=\"M8.64563 5L2.5 5C1.11929 5 -1.09278e-07 3.88071 -1.09278e-07 2.5C-1.09278e-07 1.11929 1.11929 0 2.5 0L11.9084 0L8.64563 5Z\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" fill-rule=\"evenodd\" transform=\"matrix(1,0,0,-1,9,23)\" />\r\n <path id=\"\u8DEF\u5F84\u5907\u4EFD\" d=\"M8.64563 5L2.5 5C1.11929 5 -1.09278e-07 3.88071 -1.09278e-07 2.5C-1.09278e-07 1.11929 1.11929 0 2.5 0L11.9084 0\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(1,0,0,-1,9,23)\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"3\" height=\"3\" x=\"20.5\" y=\"21.5\" rx=\"1.5\" fill=\"rgb(18,119,255)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"3\" height=\"3\" x=\"20.5\" y=\"21.5\" rx=\"1.5\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 16\" width=\"3\" height=\"3\" x=\"0\" y=\"0\" rx=\"1.5\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" transform=\"matrix(0.707107,0.707107,-0.707107,0.707107,10.5,10.8787)\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 16\" width=\"3\" height=\"3\" x=\"0\" y=\"0\" rx=\"1.5\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(0.707107,0.707107,-0.707107,0.707107,10.5,10.8787)\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- DrawingBoard\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'drawing-board-icon'\">\r\n <mask id=\"mask_4\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_drawingboard)\">\r\n <use xlink:href=\"#use_4\" />\r\n </g>\r\n </mask>\r\n <defs>\r\n <g id=\"use_4\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(92,179,0)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_drawingboard\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n <clipPath id=\"clipPath_2\">\r\n <rect width=\"15\" height=\"16\" x=\"9\" y=\"11\" fill=\"rgb(255,255,255)\" />\r\n </clipPath>\r\n </defs>\r\n <g id=\"\u753B\u677F\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" fill=\"rgb(0,0,0)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_4)\">\r\n <use xlink:href=\"#use_4\" />\r\n <g id=\"svg\" clip-path=\"url(#clipPath_2)\">\r\n <rect id=\"svg\" width=\"15\" height=\"16\" x=\"9\" y=\"11\" />\r\n <g id=\"ic_public_office_brush-\u753B\u7B14/base/ic_public_office_brush1\">\r\n <path id=\"path6\" d=\"M13.5333 23.4382L9.875 24.8333L11.4169 20.7952L19.1124 13.1001C19.8016 12.4109 20.919 12.411 21.6081 13.1002C22.2973 13.7894 22.2973 14.9069 21.6081 15.5961L14.8912 22.3175\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" />\r\n <line id=\"path7\" x1=\"0\" x2=\"3.51560974\" y1=\"0\" y2=\"0\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"square\" stroke-linejoin=\"round\" stroke-width=\"1.5\" transform=\"matrix(0.705038,0.70917,-0.70917,0.705038,18.5347,13.6929)\" />\r\n <path id=\"path8\" d=\"M16.3501 23.632C16.7621 24.4423 17.2822 24.8475 17.9105 24.8475C18.8918 24.8475 19.3342 23.6954 20.1977 23.632C20.7734 23.5898 21.3469 23.8969 21.9183 24.5533\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 793\" d=\"M14 25.0878C14.1434 25.1785 14.5505 25.3054 15.0323 25.0878C15.514 24.8703 17.7849 24 18.2151 24C18.6452 24 18.7828 24.272 18.6452 24.6346C18.5075 24.9972 17.957 25.6318 18.129 25.9037C18.3011 26.1756 19.9355 25.8131 20.6237 25.5411C21.3118 25.2691 21.828 25.3598 22 25.5411\" opacity=\"0\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"path9\" d=\"M20.1849 23.4575C20.8232 23.4106 21.4459 23.7441 22.0503 24.4384C22.1137 24.5113 22.1061 24.6219 22.0332 24.6853C21.9603 24.7488 21.8497 24.7411 21.7863 24.6682C21.2478 24.0496 20.7235 23.7689 20.2105 23.8065C19.9376 23.8265 19.7196 23.9568 19.338 24.287C19.2903 24.3284 19.2903 24.3284 19.2421 24.3704C18.6985 24.8433 18.3888 25.0225 17.9105 25.0225C17.2076 25.0225 16.6332 24.5751 16.1941 23.7113C16.1503 23.6251 16.1846 23.5198 16.2708 23.476C16.3569 23.4322 16.4623 23.4665 16.5061 23.5527C16.8908 24.3095 17.3568 24.6725 17.9105 24.6725C18.2771 24.6725 18.5295 24.5264 19.0123 24.1063C19.0605 24.0644 19.0605 24.0644 19.109 24.0223C19.5446 23.6454 19.8136 23.4847 20.1849 23.4575Z\" fill=\"rgb(255,255,255)\" fill-opacity=\"0\" fill-rule=\"nonzero\" />\r\n <path id=\"path9\" d=\"M22.0503 24.4384C22.1137 24.5113 22.1061 24.6219 22.0332 24.6853C21.9603 24.7488 21.8497 24.7411 21.7863 24.6682C21.2478 24.0496 20.7235 23.7689 20.2105 23.8065C19.9376 23.8265 19.7196 23.9568 19.338 24.287C19.2903 24.3284 19.2903 24.3284 19.2421 24.3704C18.6985 24.8433 18.3888 25.0225 17.9105 25.0225C17.2076 25.0225 16.6332 24.5751 16.1941 23.7113C16.1503 23.6251 16.1846 23.5198 16.2708 23.476C16.3569 23.4322 16.4623 23.4665 16.5061 23.5527C16.8908 24.3095 17.3568 24.6725 17.9105 24.6725C18.2771 24.6725 18.5295 24.5264 19.0123 24.1063C19.0605 24.0644 19.0605 24.0644 19.109 24.0223C19.5446 23.6454 19.8136 23.4847 20.1849 23.4575C20.8232 23.4106 21.4459 23.7441 22.0503 24.4384Z\" fill-rule=\"nonzero\" stroke=\"rgb(255,255,255)\" stroke-opacity=\"0\" stroke-linejoin=\"round\" stroke-width=\"0.699999988\" />\r\n </g>\r\n </g>\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(185,230,131)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84 6\" d=\"M8.5 21.3938L12.2173 17.4814L16.3341 22L23.5 14L8.5 21.3938Z\" opacity=\"0\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84 6\" d=\"M8.5 21.3938L12.2173 17.4814L16.3341 22L23.5 14\" opacity=\"0\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- DrawingBoard\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'drawing-board-icon'\">\r\n <mask id=\"mask_4\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n\t<g filter=\"url(#pixso_custom_mask_type_outline_drawingboard)\">\r\n\t\t<use xlink:href=\"#use_4\" />\r\n\t</g>\r\n</mask>\r\n<defs>\r\n\t<g id=\"use_4\">\r\n\t\t<path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(92,179,0)\" fill-rule=\"evenodd\" />\r\n\t\t<path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n\t</g>\r\n\t<filter id=\"pixso_custom_mask_type_outline_drawingboard\">\r\n\t\t<feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n\t</filter>\r\n\t<clipPath id=\"clipPath_2\">\r\n\t\t<rect width=\"15\" height=\"16\" x=\"9\" y=\"11\" fill=\"rgb(255,255,255)\" />\r\n\t</clipPath>\r\n</defs>\r\n<g id=\"\u753B\u677F\">\r\n\t<rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" fill=\"rgb(0,0,0)\" fill-opacity=\"0\" />\r\n\t<rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n\t<g id=\"\u8DEF\u5F84\" mask=\"url(#mask_4)\">\r\n\t\t<use xlink:href=\"#use_4\" />\r\n\t\t<g id=\"svg\" clip-path=\"url(#clipPath_2)\">\r\n\t\t\t<rect id=\"svg\" width=\"15\" height=\"16\" x=\"9\" y=\"11\" />\r\n\t\t\t<g id=\"ic_public_office_brush-\u753B\u7B14/base/ic_public_office_brush1\">\r\n\t\t\t\t<path id=\"path6\" d=\"M13.5333 23.4382L9.875 24.8333L11.4169 20.7952L19.1124 13.1001C19.8016 12.4109 20.919 12.411 21.6081 13.1002C22.2973 13.7894 22.2973 14.9069 21.6081 15.5961L14.8912 22.3175\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" />\r\n\t\t\t\t<line id=\"path7\" x1=\"0\" x2=\"3.51560974\" y1=\"0\" y2=\"0\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"square\" stroke-linejoin=\"round\" stroke-width=\"1.5\" transform=\"matrix(0.705038,0.70917,-0.70917,0.705038,18.5347,13.6929)\" />\r\n\t\t\t\t<path id=\"path8\" d=\"M16.3501 23.632C16.7621 24.4423 17.2822 24.8475 17.9105 24.8475C18.8918 24.8475 19.3342 23.6954 20.1977 23.632C20.7734 23.5898 21.3469 23.8969 21.9183 24.5533\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" />\r\n\t\t\t</g>\r\n\t\t</g>\r\n\t\t<path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(185,230,131)\" fill-rule=\"evenodd\" />\r\n\t\t<path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n\t</g>\r\n</g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- Mind\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'mind-icon'\">\r\n <mask id=\"mask_mind\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_mind)\">\r\n <use xlink:href=\"#use_mind\" />\r\n </g>\r\n </mask>\r\n <defs>\r\n <g id=\"use_mind\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(164,47,214)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_mind\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u601D\u7EF4\u5BFC\u56FE\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" fill=\"rgb(0,0,0)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u7F16\u7EC4 2\" mask=\"url(#mask_mind)\">\r\n <use xlink:href=\"#use_mind\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(222,163,247)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <g id=\"\u7F16\u7EC4 33\">\r\n <rect id=\"\u77E9\u5F62\" width=\"4\" height=\"4\" x=\"8.5\" y=\"17\" rx=\"2\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"4\" height=\"4\" x=\"8.5\" y=\"17\" rx=\"2\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 13\" width=\"4\" height=\"4\" x=\"19.5\" y=\"12.5\" rx=\"2\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 13\" width=\"4\" height=\"4\" x=\"19.5\" y=\"12.5\" rx=\"2\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 15\" width=\"4\" height=\"4\" x=\"19.5\" y=\"21.5\" rx=\"2\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 15\" width=\"4\" height=\"4\" x=\"19.5\" y=\"21.5\" rx=\"2\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u8DEF\u5F84 5\" d=\"M12.5 19L16.0087 19\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M19.446 23.5244L17.9496 23.5139C16.8505 23.5139 15.9636 22.6131 15.9636 21.514L15.9636 16.5141C15.9636 15.404 16.8676 14.5141 17.9776 14.5141L19.446 14.5244L19.446 23.5244Z\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M19.446 23.5244L17.9496 23.5139C16.8505 23.5139 15.9636 22.6131 15.9636 21.514L15.9636 16.5141C15.9636 15.404 16.8676 14.5141 17.9776 14.5141L19.446 14.5244\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- MultidimentionalTable\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'multidimentional-table-icon'\">\r\n <mask id=\"mask_multidimentionaltable\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_multidimentionaltable)\">\r\n <use xlink:href=\"#use_multidimentionaltable\" />\r\n </g>\r\n </mask>\r\n <defs>\r\n <g id=\"use_multidimentionaltable\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(164,47,214)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_multidimentionaltable\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u591A\u7EF4\u8868\u683C\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" fill=\"rgb(0,0,0)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_multidimentionaltable)\">\r\n <use xlink:href=\"#use_multidimentionaltable\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(222,163,247)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"8\" height=\"5\" x=\"15.5\" y=\"18.5\" rx=\"1\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"8\" height=\"5\" x=\"15.5\" y=\"18.5\" rx=\"1\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 777\" d=\"M8.5 13.5L23.5 13.5\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 787\" d=\"M8.5 18.5L12.5 18.5\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 788\" d=\"M8.5 23.5L12.5 23.5\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- FolderClosed\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'folder-closed-icon'\">\r\n <g id=\"\u6587\u4EF6\u5939\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" opacity=\"0\" fill=\"rgb(216,216,216)\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" opacity=\"0\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M10.6827 3C11.4448 3 12.1642 3.32848 12.6706 3.89284L12.8502 4.11535L14.4435 6.3149C14.5736 6.49445 14.7581 6.61238 14.9591 6.65238L15.1124 6.6675L25.3046 6.6675C26.7138 6.6675 27.858 7.76563 27.9877 9.1545L28 9.41813L28 13.1331L4 13.2962L4 5.75062C4 4.32856 5.06133 3.14678 6.43445 3.01267L6.69538 3L10.6827 3Z\" fill=\"rgb(10,89,247)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u77E9\u5F62\u5907\u4EFD\" d=\"M5.06048 11L26.9994 11C28.7906 11 30.1826 12.5593 29.9802 14.339L28.6154 26.339C28.443 27.8549 27.1603 29 25.6347 29L6.42524 29C4.89956 29 3.61686 27.8549 3.44446 26.339L2.0797 14.339C1.8773 12.5593 3.26934 11 5.06048 11Z\" fill=\"rgb(77.6591,136.773,255)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u77E9\u5F62\u5907\u4EFD\" d=\"M26.9994 11L5.06048 11C3.26934 11 1.8773 12.5593 2.0797 14.339L3.44446 26.339C3.61686 27.8549 4.89956 29 6.42524 29L25.6347 29C27.1603 29 28.443 27.8549 28.6154 26.339L29.9802 14.339C30.1826 12.5593 28.7906 11 26.9994 11ZM5.06048 12L26.9994 12C27.1728 12 27.3408 12.021 27.5033 12.0631C27.6156 12.0922 27.7252 12.1312 27.8322 12.1803C27.945 12.2321 28.0512 12.2931 28.1509 12.3635C28.2745 12.4507 28.388 12.5522 28.4914 12.6681C28.5948 12.7839 28.6828 12.9081 28.7555 13.0407C28.8142 13.1477 28.8628 13.2602 28.9015 13.3781C28.9382 13.4901 28.9647 13.6034 28.9809 13.7182C29.0043 13.8845 29.0062 14.0537 28.9866 14.226L27.6218 26.226C27.6057 26.368 27.5754 26.5053 27.5309 26.6378C27.4974 26.7377 27.4558 26.8349 27.4062 26.9293C27.3545 27.0277 27.2956 27.1205 27.2295 27.2077C27.1518 27.3101 27.0642 27.4048 26.9666 27.492C26.869 27.5791 26.765 27.6554 26.6546 27.721C26.5603 27.7769 26.4614 27.825 26.3579 27.8652C26.2583 27.9039 26.157 27.9342 26.0538 27.9562C25.9172 27.9854 25.7775 28 25.6347 28L6.42524 28C6.2824 28 6.14267 27.9854 6.00606 27.9562C5.90294 27.9342 5.8016 27.9039 5.70203 27.8652C5.59843 27.825 5.49949 27.7769 5.40523 27.7209C5.29486 27.6554 5.19089 27.5791 5.09333 27.492C4.99575 27.4049 4.90817 27.3102 4.83058 27.2079C4.76434 27.1206 4.70539 27.0277 4.65372 26.9293C4.60407 26.8348 4.56248 26.7376 4.52894 26.6376C4.4845 26.5052 4.4542 26.368 4.43805 26.226L3.07329 14.226C3.0537 14.0537 3.05561 13.8844 3.07905 13.7182C3.09523 13.6034 3.12167 13.49 3.15838 13.3781C3.19704 13.2602 3.24569 13.1478 3.30431 13.0409C3.37702 12.9082 3.46509 12.7839 3.5685 12.6681C3.67191 12.5522 3.78541 12.4507 3.90901 12.3635C4.00866 12.2931 4.11488 12.2321 4.22766 12.1804C4.3347 12.1312 4.44435 12.0922 4.55659 12.0631C4.71911 12.021 4.88707 12 5.06048 12Z\" fill=\"rgb(151,151,151)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- FolderOpen\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'folder-open-icon'\">\r\n <g id=\"\u6587\u4EF6\u5939\u6253\u5F00\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" opacity=\"0\" fill=\"rgb(216,216,216)\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" opacity=\"0\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <path id=\"\u5F62\u72B6\u7ED3\u5408\" d=\"M8.68272 3.00009C9.44485 3.00009 10.1642 3.32858 10.6706 3.89294L10.8502 4.11545L12.4435 6.315C12.5736 6.49454 12.7581 6.61249 12.9591 6.65247L13.1124 6.6676L23.3046 6.6676C24.7138 6.6676 25.858 7.76572 25.9877 9.1546L26 9.41821L26 10.0002L8.31796 10.0002C6.53639 10.0002 4.96957 11.1784 4.47511 12.89L2 21.4577L2 5.7507C2 4.32864 3.06133 3.14688 4.43445 3.01276L4.69539 3.00009L8.68272 3.00009Z\" fill=\"rgb(10,89,247)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u77E9\u5F62\u5907\u4EFD\" d=\"M9.55932 12L27.5463 12C29.1323 12 30.2822 13.5109 29.8596 15.0395L26.4055 27.5329C26.1659 28.3997 25.3771 29 24.4778 29L4.10314 29C2.75891 29 1.79742 27.7004 2.19061 26.415L5.73426 14.83C6.24862 13.1484 7.80085 12 9.55932 12Z\" fill=\"rgb(77.6591,136.773,255)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u77E9\u5F62\u5907\u4EFD\" d=\"M27.5463 12L9.55932 12C7.80085 12 6.24862 13.1484 5.73426 14.83L2.19061 26.415C1.79742 27.7004 2.75891 29 4.10314 29L24.4778 29C25.3771 29 26.1659 28.3997 26.4055 27.5329L29.8596 15.0395C30.2822 13.5109 29.1323 12 27.5463 12ZM9.55932 13L27.5463 13C27.6876 13 27.8231 13.0195 27.9527 13.0584C28.0311 13.082 28.1074 13.1127 28.1816 13.1506C28.262 13.1917 28.3371 13.2395 28.407 13.2942C28.5011 13.3678 28.5856 13.4538 28.6604 13.5521C28.7352 13.6505 28.7956 13.7548 28.8415 13.8652C28.8756 13.947 28.9017 14.0322 28.9198 14.1207C28.9366 14.2022 28.9458 14.2839 28.9477 14.3658C28.9507 14.5011 28.9334 14.6369 28.8957 14.7731L25.4417 27.2665C25.4117 27.3748 25.3669 27.4731 25.3072 27.5613C25.2475 27.6495 25.1729 27.7277 25.0834 27.7958C24.994 27.8638 24.8988 27.9149 24.7978 27.9489C24.6969 27.983 24.5902 28 24.4778 28L4.10314 28C3.99633 28 3.89442 27.9846 3.79741 27.9537C3.74453 27.9369 3.6931 27.9155 3.64313 27.8896C3.58717 27.8605 3.53485 27.8268 3.48618 27.7884C3.41636 27.7334 3.35405 27.6688 3.29924 27.5948C3.24443 27.5207 3.20094 27.4422 3.16875 27.3594C3.14631 27.3016 3.12937 27.2417 3.11792 27.1797C3.1077 27.1243 3.10229 27.0689 3.10168 27.0134C3.10057 26.9116 3.11563 26.8096 3.14688 26.7075L6.69053 15.1225C6.74279 14.9516 6.80901 14.7879 6.8892 14.6314C6.95529 14.5023 7.03085 14.3782 7.11591 14.2589C7.20303 14.1367 7.29816 14.0222 7.4013 13.9155C7.51597 13.7969 7.64054 13.6878 7.77502 13.5883C7.90949 13.4888 8.05021 13.4016 8.1972 13.3266C8.32942 13.2592 8.4667 13.2017 8.60905 13.1542C8.74802 13.1077 8.88885 13.0718 9.03156 13.0463C9.20473 13.0154 9.38064 13 9.55932 13Z\" fill=\"rgb(151,151,151)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- Mind\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'mind-icon'\">\r\n <mask id=\"mask_12\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_mind)\">\r\n <use xlink:href=\"#use_12\" />\r\n </g>\r\n </mask>\r\n <defs>\r\n <g id=\"use_12\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(164,47,214)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_mind\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u601D\u7EF4\u5BFC\u56FE\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" fill=\"rgb(0,0,0)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u7F16\u7EC4 2\" mask=\"url(#mask_12)\">\r\n <use xlink:href=\"#use_12\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(222,163,247)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <g id=\"\u7F16\u7EC4 33\">\r\n <rect id=\"\u77E9\u5F62\" width=\"4\" height=\"4\" x=\"8.5\" y=\"17\" rx=\"2\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"4\" height=\"4\" x=\"8.5\" y=\"17\" rx=\"2\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 13\" width=\"4\" height=\"4\" x=\"19.5\" y=\"12.5\" rx=\"2\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 13\" width=\"4\" height=\"4\" x=\"19.5\" y=\"12.5\" rx=\"2\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 15\" width=\"4\" height=\"4\" x=\"19.5\" y=\"21.5\" rx=\"2\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 15\" width=\"4\" height=\"4\" x=\"19.5\" y=\"21.5\" rx=\"2\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u8DEF\u5F84 5\" d=\"M12.5 19L16.0087 19\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M19.446 23.5244L17.9496 23.5139C16.8505 23.5139 15.9636 22.6131 15.9636 21.514L15.9636 16.5141C15.9636 15.404 16.8676 14.5141 17.9776 14.5141L19.446 14.5244L19.446 23.5244Z\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M19.446 23.5244L17.9496 23.5139C16.8505 23.5139 15.9636 22.6131 15.9636 21.514L15.9636 16.5141C15.9636 15.404 16.8676 14.5141 17.9776 14.5141L19.446 14.5244\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- Page\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'page-icon'\">\r\n <mask id=\"mask_7\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline)\">\r\n <use xlink:href=\"#use_7\" />\r\n </g>\r\n </mask>\r\n <defs>\r\n <g id=\"use_7\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(37,194,81)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"Page\">\r\n <g id=\"\u56FE\u6807/word\u6587\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"4\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"4\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u7F16\u7EC4 2\" mask=\"url(#mask_7)\">\r\n <use xlink:href=\"#use_7\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(146,224,165)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <g id=\"\u7F16\u7EC4 34\">\r\n <path id=\"\u8DEF\u5F84\" d=\"M11.2618 22L10.5 22C9.39543 22 8.5 20.9553 8.5 19.6667L8.5 17.3333C8.5 16.0447 9.39543 15 10.5 15L11.4798 15L11.2618 22Z\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M11.2618 22L10.5 22C9.39543 22 8.5 20.9553 8.5 19.6667L8.5 17.3333C8.5 16.0447 9.39543 15 10.5 15L11.4798 15\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"4\" height=\"3\" x=\"11.5\" y=\"13.5\" rx=\"1.5\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"4\" height=\"3\" x=\"11.5\" y=\"13.5\" rx=\"1.5\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 11\" width=\"4\" height=\"3\" x=\"11.5\" y=\"20.5\" rx=\"1.5\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 11\" width=\"4\" height=\"3\" x=\"11.5\" y=\"20.5\" rx=\"1.5\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 774\" d=\"M19 13.5L23 13.5\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 775\" d=\"M19 18.5L23 18.5\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 776\" d=\"M19 23.5L23 23.5\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" />\r\n </g>\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- Wrong\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'wrong-icon'\">\r\n <!-- \u80CC\u666F\u4E09\u89D2 -->\r\n <path \r\n d=\"M7.84 0.99L13.88 12.12C14.13 12.57 13.95 13.14 13.49 13.38C13.35 13.46 13.2 13.5 13.04 13.5H0.95C0.42 13.5 0 13.08 0 12.56C0 12.4 0.03 12.25 0.11 12.12L6.15 0.99C6.4 0.53 6.98 0.36 7.44 0.61C7.61 0.69 7.75 0.83 7.84 0.99Z\" \r\n fill=\"white\"\r\n />\r\n <!-- \u611F\u53F9\u53F7\u7684\u70B9 -->\r\n <path \r\n d=\"M7 11.5C6.58 11.5 6.25 11.16 6.25 10.75C6.25 10.33 6.58 10 7 10C7.41 10 7.75 10.33 7.75 10.75C7.75 11.16 7.41 11.5 7 11.5Z\" \r\n fill=\"#F23030\"\r\n />\r\n <!-- \u611F\u53F9\u53F7\u7684\u7AD6\u7EBF -->\r\n <rect \r\n x=\"6.5\" \r\n y=\"4.5\" \r\n width=\"1\" \r\n height=\"4.5\" \r\n rx=\"0.5\" \r\n fill=\"#F23030\"\r\n />\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n</svg>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
1315
|
+
}
|
|
1316
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: McFileIconComponent, decorators: [{
|
|
1317
|
+
type: Component,
|
|
1318
|
+
args: [{ selector: 'mc-file-icon', standalone: true, imports: [CommonModule], template: "<svg\r\n [attr.width]=\"size\"\r\n [attr.height]=\"size\"\r\n viewBox=\"0 0 32 32\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" fill=\"none\"\r\n role=\"img\"\r\n [attr.aria-label]=\"title\"\r\n [class]=\"className\"\r\n>\r\n <!-- \u56FE\u7247\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'image-icon'\">\r\n <defs>\r\n <mask id=\"mask_image\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_image)\">\r\n <use xlink:href=\"#use_image\" />\r\n </g>\r\n </mask>\r\n <g id=\"use_image\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(57,121,249)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_image\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u56FE\u7247\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"6\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"6\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u56FE\u6807/\u7A7A\u6587\u4EF6\u5939 copy 2\" mask=\"url(#mask_image)\">\r\n <use xlink:href=\"#use_image\" />\r\n <g id=\"\u7F16\u7EC4 27\">\r\n <path id=\"\u692D\u5706\u5F62\" d=\"M11.5 16.5C12.3284 16.5 13 15.8284 13 15C13 14.1716 12.3284 13.5 11.5 13.5C10.6716 13.5 10 14.1716 10 15C10 15.8284 10.6716 16.5 11.5 16.5Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u692D\u5706\u5F62\" d=\"M13 15C13 15.8284 12.3284 16.5 11.5 16.5C10.6716 16.5 10 15.8284 10 15C10 14.1716 10.6716 13.5 11.5 13.5C12.3284 13.5 13 14.1716 13 15ZM11.9634 14.8081C11.9878 14.867 12 14.931 12 15C12 15.069 11.9878 15.133 11.9634 15.1919C11.939 15.2509 11.9024 15.3047 11.8536 15.3536C11.8047 15.4024 11.7509 15.439 11.6919 15.4634C11.633 15.4878 11.569 15.5 11.5 15.5C11.431 15.5 11.367 15.4878 11.3081 15.4634C11.2491 15.439 11.1953 15.4024 11.1464 15.3536C11.0976 15.3047 11.061 15.2509 11.0366 15.1919C11.0122 15.133 11 15.069 11 15C11 14.931 11.0122 14.867 11.0366 14.8081C11.061 14.7491 11.0976 14.6953 11.1464 14.6464C11.1953 14.5976 11.2491 14.561 11.3081 14.5366C11.367 14.5122 11.431 14.5 11.5 14.5C11.569 14.5 11.633 14.5122 11.6919 14.5366C11.7509 14.561 11.8047 14.5976 11.8536 14.6464C11.9024 14.6953 11.939 14.7491 11.9634 14.8081Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M22.7002 23.126L18.6447 16.9265C18.3065 16.4096 17.5571 16.3873 17.1888 16.8831L15.2857 19.4454L13.7373 18.0224C13.3287 17.647 12.6798 17.734 12.3846 18.2038L9.28364 23.1397C8.91213 23.731 9.33716 24.5 10.0355 24.5L21.9572 24.5C22.6629 24.5 23.0866 23.7165 22.7002 23.126Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M14.5454 18.765L13.7373 18.0224C13.3287 17.647 12.6798 17.734 12.3846 18.2038L9.28364 23.1397C8.91213 23.731 9.33716 24.5 10.0355 24.5L21.9572 24.5C22.6629 24.5 23.0866 23.7165 22.7002 23.126L18.6447 16.9265C18.3065 16.4096 17.5571 16.3873 17.1888 16.8831L15.8852 18.6382L15.2857 19.4454L14.5454 18.765ZM17.8958 17.6084L15.4265 20.9329L13.1597 18.8498L10.2383 23.5L21.7499 23.5L17.8958 17.6084Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(157,189,252)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- PDF\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'pdf-icon'\">\r\n <defs>\r\n <mask id=\"mask_pdf\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_pdf)\">\r\n <use xlink:href=\"#use_pdf\" />\r\n </g>\r\n </mask>\r\n <g id=\"use_pdf\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(242,48,48)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_pdf\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"pdf\">\r\n <g id=\"\u56FE\u6807/pdf\u6587\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"8\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"8\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u7F16\u7EC4 2\">\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_pdf)\">\r\n <use xlink:href=\"#use_pdf\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(250,167,163)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"path6\" d=\"M16.364 18.6456C18.7712 21.8711 23.2379 23.4328 23.4902 21.3188C23.7425 19.2048 19.0713 19.4571 14.9933 20.5482C10.9085 21.6324 7.37606 24.1215 8.83541 25.5399C10.2879 26.9584 11.7814 24.7489 13.8067 20.0504C15.8321 15.345 17.5164 11.0352 15.1979 11.0352C12.8793 11.0352 13.9499 15.42 16.364 18.6456Z\" fill=\"rgb(0,0,0)\" fill-opacity=\"0\" fill-rule=\"nonzero\" />\r\n <path id=\"path6\" d=\"M23.4902 21.3188C23.7425 19.2048 19.0713 19.4571 14.9933 20.5482C10.9085 21.6324 7.37606 24.1215 8.83541 25.5399C10.2879 26.9584 11.7814 24.7489 13.8067 20.0504C15.8321 15.345 17.5164 11.0352 15.1979 11.0352C12.8793 11.0352 13.9499 15.42 16.364 18.6456C18.7712 21.8711 23.2379 23.4328 23.4902 21.3188Z\" fill-rule=\"nonzero\" stroke=\"rgb(255,255,255)\" stroke-linejoin=\"round\" stroke-width=\"1.5\" />\r\n </g>\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u672A\u77E5\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'unknown-icon'\">\r\n <defs>\r\n <mask id=\"mask_15\" width=\"24\" height=\"28\" x=\"4\" y=\"5\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline)\">\r\n <use xlink:href=\"#use_15\" />\r\n </g>\r\n </mask>\r\n <g id=\"use_15\">\r\n <path id=\"\u8499\u7248\" d=\"M7 5L22 5L28 11L28 30C28 31.6569 26.6569 33 25 33L7 33C5.34315 33 4 31.6569 4 30L4 8C4 6.34315 5.34315 5 7 5Z\" fill=\"rgb(189,189,189)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M22 5L7 5C5.34315 5 4 6.34315 4 8L4 30C4 31.6569 5.34315 33 7 33L25 33C26.6569 33 28 31.6569 28 30L28 11L22 5ZM21.5858 6L27 11.4142L27 30C27 30.1577 26.9824 30.3113 26.9472 30.4607C26.9217 30.5687 26.8871 30.6745 26.8432 30.7782C26.7974 30.8867 26.7429 30.9896 26.6798 31.0869C26.6037 31.2041 26.5152 31.3132 26.4142 31.4142C26.3132 31.5152 26.2041 31.6037 26.0869 31.6797C25.9896 31.7429 25.8867 31.7974 25.7782 31.8432C25.6745 31.8871 25.5687 31.9217 25.4607 31.9472C25.3113 31.9824 25.1577 32 25 32L7 32C6.84229 32 6.68872 31.9824 6.53931 31.9472C6.43131 31.9217 6.32548 31.8871 6.22182 31.8432C6.11331 31.7973 6.01038 31.7428 5.91305 31.6797C5.79586 31.6037 5.68677 31.5152 5.58579 31.4142C5.48479 31.3132 5.39628 31.2041 5.32027 31.0869C5.25715 30.9896 5.20265 30.8867 5.15676 30.7782C5.11292 30.6745 5.07827 30.5687 5.05282 30.4607C5.01761 30.3113 5 30.1577 5 30L5 8C5 7.84228 5.01761 7.68871 5.05282 7.53929C5.07827 7.4313 5.11292 7.32547 5.15676 7.22182C5.20266 7.1133 5.25717 7.01037 5.32031 6.91303C5.39631 6.79585 5.4848 6.68677 5.58579 6.58579C5.68677 6.4848 5.79585 6.39631 5.91303 6.32031C6.01037 6.25717 6.1133 6.20266 6.22182 6.15676C6.32547 6.11292 6.4313 6.07827 6.53929 6.05282C6.68871 6.01761 6.84228 6 7 6L21.5858 6Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n <filter id=\"filter_0\" width=\"16\" height=\"16\" x=\"17\" y=\"0\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix result=\"hardAlpha\" in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0 \" />\r\n <feOffset dx=\"0\" dy=\"0\" />\r\n <feGaussianBlur stdDeviation=\"1.66666663\" />\r\n <feComposite k2=\"-1\" k3=\"1\" in2=\"hardAlpha\" operator=\"out\" />\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0.643137 0 0 0 0 0.643137 0 0 0 0 0.643137 0 0 0 1 0 \" />\r\n <feBlend result=\"effect_dropShadow_1\" in2=\"BackgroundImageFix\" mode=\"normal\" />\r\n <feBlend result=\"shape\" in=\"SourceGraphic\" in2=\"effect_dropShadow_1\" mode=\"normal\" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u672A\u77E5\u6587\u4EF6\">\r\n <g id=\"\u56FE\u6807/\u672A\u77E5\u6587\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"3\" rx=\"8\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"3.5\" rx=\"8\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_15)\">\r\n <use xlink:href=\"#use_15\" />\r\n <g id=\"ic_public_questionmark\">\r\n <path id=\"path4\" d=\"M15.25 26.22C15.25 25.8224 15.5724 25.5 15.97 25.5L16 25.5C16.4142 25.5 16.75 25.8358 16.75 26.25C16.75 26.6642 16.4142 27 16 27L15.97 27C15.5724 27 15.25 26.6776 15.25 26.28L15.25 26.28L15.25 26.22Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" />\r\n <path id=\"path4\" d=\"M14.25 26.22C14.25 25.9872 14.2952 25.7639 14.3856 25.5502C14.4727 25.3443 14.5954 25.1622 14.7538 25.0038C14.9122 24.8454 15.0943 24.7227 15.3002 24.6356C15.5139 24.5452 15.7372 24.5 15.97 24.5L16 24.5C16.2369 24.5 16.4641 24.546 16.6815 24.6379C16.891 24.7265 17.0763 24.8514 17.2374 25.0126C17.3986 25.1737 17.5235 25.359 17.6121 25.5685C17.704 25.7859 17.75 26.0131 17.75 26.25C17.75 26.4869 17.704 26.7141 17.6121 26.9315C17.5235 27.141 17.3986 27.3263 17.2374 27.4874C17.0763 27.6486 16.891 27.7735 16.6815 27.8621C16.4641 27.954 16.2369 28 16 28L15.97 28C15.7372 28 15.5139 27.9548 15.3002 27.8644C15.0943 27.7773 14.9122 27.6546 14.7538 27.4962C14.5954 27.3378 14.4727 27.1557 14.3856 26.9498C14.2952 26.7361 14.25 26.5128 14.25 26.28L16.25 26.28C16.25 26.2027 16.2227 26.1367 16.168 26.082C16.1133 26.0273 16.0473 26 15.97 26L16 26C15.931 26 15.872 26.0244 15.8232 26.0732C15.7744 26.122 15.75 26.181 15.75 26.25C15.75 26.319 15.7744 26.378 15.8232 26.4268C15.872 26.4756 15.931 26.5 16 26.5L15.97 26.5C16.0473 26.5 16.1133 26.4727 16.168 26.418C16.2227 26.3633 16.25 26.2973 16.25 26.22L14.25 26.22ZM16.23 26.2L16.25 26.22C16.25 26.78 15.81 27.22 15.25 27.22C14.69 27.22 14.25 26.78 14.25 26.22L14.27 26.2L16.23 26.2ZMnan nanLnan nanCnan nan nan nan nan nanCnan nan nan nan nan nanLnan nan\" fill=\"rgb(25,25,25)\" fill-opacity=\"0\" fill-rule=\"nonzero\" />\r\n <path id=\"path5\" d=\"M16 23.5C16 23.2897 15.9663 22.5794 16 22.2727C16.028 22.0177 16.086 21.7987 16.2953 21.4564C16.6719 20.8404 17.836 20.1869 18.0114 20.0597C18.9117 19.407 19.5 18.3279 19.5 17.1072C19.5 15.115 17.933 13.5 16 13.5C14.067 13.5 12.5 15.115 12.5 17.1072\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" />\r\n </g>\r\n <g filter=\"url(#filter_0)\">\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 11L24 11C22.8954 11 22 10.1046 22 9L22 5L28 11Z\" fill=\"rgb(245,245,246)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 11L24 11C22.8954 11 22 10.1046 22 9L22 5L23 6L23 9C23 9.08264 23.0096 9.1629 23.0288 9.24079C23.0413 9.29117 23.0577 9.34055 23.0782 9.38894C23.1003 9.44134 23.1265 9.49116 23.1568 9.53839C23.1955 9.59887 23.2409 9.65511 23.2929 9.70711C23.3449 9.75911 23.4011 9.80448 23.4616 9.84322C23.5089 9.87346 23.5587 9.89966 23.6111 9.92183C23.6595 9.94229 23.7088 9.95874 23.7592 9.97117C23.8371 9.99039 23.9174 10 24 10L27 10L28 11Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u4EE3\u7801\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'code-file-icon'\">\r\n <defs>\r\n <mask id=\"mask_code\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_code)\">\r\n <use xlink:href=\"#use_code\" />\r\n </g>\r\n </mask>\r\n <g id=\"use_code\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(92,179,0)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_code\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u4EE3\u7801\u7C7B\u6587\u4EF6\">\r\n <g id=\"\u56FE\u6807/\u56FE\u7247\u6587\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"8\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"8\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u7F16\u7EC4 2\">\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_code)\">\r\n <use xlink:href=\"#use_code\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(185,230,131)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <g id=\"ic_public_code\">\r\n <path id=\"ic_public_code_2_5\" d=\"M0 0L7.06296 0\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" transform=\"matrix(0.351112,-0.936333,0.936333,0.351112,14.7598,21.8066)\" />\r\n <path id=\"\u77E2\u91CF 772\" d=\"M12 15L9.05221 18.4391C9.0217 18.4747 9.02001 18.5267 9.04813 18.5642L12 22.5\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 772\" d=\"M3 0L0.0522046 3.43909C0.0217021 3.47468 0.0200084 3.52668 0.0481303 3.56417L3 7.5\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(-1,0,0,1,23,15)\" />\r\n </g>\r\n </g>\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u538B\u7F29\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'compressed-file-icon'\">\r\n <mask id=\"mask_compressed\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_compressed)\">\r\n <use xlink:href=\"#use_compressed\" />\r\n </g>\r\n </mask>\r\n <defs>\r\n <g id=\"use_compressed\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(255,136,0)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_compressed\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u538B\u7F29\u6587\u4EF6\">\r\n <g id=\"\u56FE\u6807/\u538B\u7F29\u6587\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"8\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"8\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u7F16\u7EC4 2\">\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_compressed)\">\r\n <use xlink:href=\"#use_compressed\" />\r\n <g id=\"\u7F16\u7EC4-109\">\r\n <path id=\"Rectangle-16-Copy-2\" d=\"M11.8164 9.26886L14.6559 9.26886C14.844 9.26886 14.9966 9.42141 14.9966 9.60959L14.9966 10.7454C14.9966 10.9336 14.844 11.0861 14.6559 11.0861L11.8164 11.0861L11.8164 9.26886Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" />\r\n <path id=\"Rectangle-16-Copy-4\" d=\"M11.8164 12.9036L14.6559 12.9036C14.844 12.9036 14.9966 13.0562 14.9966 13.2444L14.9966 14.7209L14.9966 14.7209L11.8164 14.7209L11.8164 12.9036Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" />\r\n <path id=\"Rectangle-16-Copy\" d=\"M0 0L2.83945 0C3.02763 0 3.18019 0.152552 3.18019 0.340734L3.18019 1.47652C3.18019 1.6647 3.02763 1.81725 2.83945 1.81725L0 1.81725L0 0Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" transform=\"matrix(-1,0,0,1,13.1802,7.45172)\" />\r\n <path id=\"Rectangle-16-Copy-6\" d=\"M0.340734 0L3.18019 0L3.18019 0L3.18019 1.81725L0.340734 1.81725C0.152552 1.81725 0 1.6647 0 1.47652L0 0.340734C0 0.152552 0.152552 0 0.340734 0Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" transform=\"matrix(-1,0,0,1,14.9966,5.63434)\" />\r\n <path id=\"Rectangle-16-Copy-6\u5907\u4EFD-3\" d=\"M0 0L3.18019 0L3.18019 1.81725L0.340734 1.81725C0.152552 1.81725 0 1.6647 0 1.47652L0 0L0 0Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" transform=\"matrix(-1,0,0,1,14.9966,2.00006)\" />\r\n <path id=\"Rectangle-16-Copy-6\u5907\u4EFD-2\" d=\"M0 0L2.83945 0C3.02763 0 3.18019 0.152552 3.18019 0.340734L3.18019 1.47652C3.18019 1.6647 3.02763 1.81725 2.83945 1.81725L0 1.81725L0 0Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" transform=\"matrix(-1,0,0,1,13.1802,3.8172)\" />\r\n <path id=\"Rectangle-16-Copy-3\" d=\"M0 0L2.83945 0C3.02763 0 3.18019 0.152552 3.18019 0.340734L3.18019 1.47652C3.18019 1.6647 3.02763 1.81725 2.83945 1.81725L0 1.81725L0 0Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" transform=\"matrix(-1,0,0,1,13.1802,11.0862)\" />\r\n <path id=\"Combined-Shape\" d=\"M15 17.687L15 14.72L10.0026 14.72L10.0026 17.687C10.0026 18.0556 10.3015 18.3545 10.6701 18.3545L14.3324 18.3545C14.7011 18.3545 15 18.0556 15 17.687ZM11.2478 15.6313L13.7465 15.6313L13.7465 16.8807C13.7465 17.0689 13.5939 17.2214 13.4058 17.2214L11.5885 17.2214C11.4003 17.2214 11.2478 17.0689 11.2478 16.8807L11.2478 15.6313Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" />\r\n </g>\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(252,213,164)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u6587\u6863\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'document-icon'\">\r\n <defs>\r\n <mask id=\"mask_document\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_document)\">\r\n <use xlink:href=\"#use_document\" />\r\n </g>\r\n </mask>\r\n <g id=\"use_document\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(57,121,249)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_document\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u6587\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"6\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"6\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u56FE\u6807/\u7A7A\u6587\u4EF6\u5939 copy 2\" mask=\"url(#mask_document)\">\r\n <use xlink:href=\"#use_document\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(157,189,252)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <g id=\"\u7F16\u7EC4 29\">\r\n <circle id=\"\u692D\u5706\u5F62\" cx=\"9.25\" cy=\"13\" r=\"0.75\" fill=\"rgb(255,255,255)\" />\r\n <circle id=\"\u692D\u5706\u5F62\" cx=\"9.25\" cy=\"18\" r=\"0.75\" fill=\"rgb(255,255,255)\" />\r\n <circle id=\"\u692D\u5706\u5F62\" cx=\"9.25\" cy=\"23\" r=\"0.75\" fill=\"rgb(255,255,255)\" />\r\n </g>\r\n <path id=\"\u77E2\u91CF 777\" d=\"M12 13L23 13\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 781\" d=\"M12 18L23 18\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 782\" d=\"M12 23L23 23\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- Excel\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'excel-icon'\">\r\n <defs>\r\n <mask id=\"mask_excel\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_excel)\">\r\n <use xlink:href=\"#use_excel\" />\r\n </g>\r\n </mask>\r\n <g id=\"use_excel\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(37,194,81)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_excel\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u8868\u683C\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" fill=\"rgb(0,0,0)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_excel)\">\r\n <use xlink:href=\"#use_excel\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(146,224,165)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <g id=\"\u7EC4\u5408 3851\">\r\n <rect id=\"\u77E9\u5F62\" width=\"15\" height=\"13\" x=\"8.5\" y=\"12.5\" rx=\"2\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"15\" height=\"13\" x=\"8.5\" y=\"12.5\" rx=\"2\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 773\" d=\"M9 19L23 19\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 773\" d=\"M0 0L14 0\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(0,-1,1,0,16,26)\" />\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- PPT\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'ppt-icon'\">\r\n <g id=\"ppt\">\r\n <g id=\"\u56FE\u6807/ppt\u6587\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"8\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"8\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u7F16\u7EC4 2\">\r\n <g id=\"\u8DEF\u5F84\">\r\n <!-- \u6A59\u8272\u80CC\u666F\u5F62\u72B6 -->\r\n <path d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(255,136,0)\" fill-rule=\"evenodd\" />\r\n \r\n <!-- \u5185\u90E8\u767D\u8272 \"P\" \u5B57\u6BCD\u548C\u88C5\u9970 -->\r\n <g fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\">\r\n <path d=\"M11.8164 9.26886L14.6559 9.26886C14.844 9.26886 14.9966 9.42141 14.9966 9.60959L14.9966 10.7454C14.9966 10.9336 14.844 11.0861 14.6559 11.0861L11.8164 11.0861L11.8164 9.26886Z\" />\r\n <path d=\"M11.8164 12.9036L14.6559 12.9036C14.844 12.9036 14.9966 13.0562 14.9966 13.2444L14.9966 14.7209L14.9966 14.7209L11.8164 14.7209L11.8164 12.9036Z\" />\r\n <path d=\"M0 0L2.83945 0C3.02763 0 3.18019 0.152552 3.18019 0.340734L3.18019 1.47652C3.18019 1.6647 3.02763 1.81725 2.83945 1.81725L0 1.81725L0 0Z\" transform=\"matrix(-1,0,0,1,13.1802,7.45172)\" />\r\n <path d=\"M0.340734 0L3.18019 0L3.18019 0L3.18019 1.81725L0.340734 1.81725C0.152552 1.81725 0 1.6647 0 1.47652L0 0.340734C0 0.152552 0.152552 0 0.340734 0Z\" transform=\"matrix(-1,0,0,1,14.9966,5.63434)\" />\r\n <path d=\"M0 0L3.18019 0L3.18019 1.81725L0.340734 1.81725C0.152552 1.81725 0 1.6647 0 1.47652L0 0L0 0Z\" transform=\"matrix(-1,0,0,1,14.9966,2.00006)\" />\r\n <path d=\"M0 0L2.83945 0C3.02763 0 3.18019 0.152552 3.18019 0.340734L3.18019 1.47652C3.18019 1.6647 3.02763 1.81725 2.83945 1.81725L0 1.81725L0 0Z\" transform=\"matrix(-1,0,0,1,13.1802,3.8172)\" />\r\n <path d=\"M0 0L2.83945 0C3.02763 0 3.18019 0.152552 3.18019 0.340734L3.18019 1.47652C3.18019 1.6647 3.02763 1.81725 2.83945 1.81725L0 1.81725L0 0Z\" transform=\"matrix(-1,0,0,1,13.1802,11.0862)\" />\r\n <path d=\"M15 17.687L15 14.72L10.0026 14.72L10.0026 17.687C10.0026 18.0556 10.3015 18.3545 10.6701 18.3545L14.3324 18.3545C14.7011 18.3545 15 18.0556 15 17.687ZM11.2478 15.6313L13.7465 15.6313L13.7465 16.8807C13.7465 17.0689 13.5939 17.2214 13.4058 17.2214L11.5885 17.2214C11.4003 17.2214 11.2478 17.0689 11.2478 16.8807L11.2478 15.6313Z\" />\r\n </g>\r\n \r\n <!-- \u6298\u89D2\u90E8\u5206 -->\r\n <path d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(252,213,164)\" fill-rule=\"evenodd\" />\r\n </g>\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- Markdown\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'markdown-icon'\">\r\n <mask id=\"mask_markdown\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_markdown)\">\r\n <use xlink:href=\"#use_markdown\" />\r\n </g>\r\n </mask>\r\n <defs>\r\n <g id=\"use_markdown\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(37,194,81)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_markdown\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"markdown\">\r\n <g id=\"\u56FE\u6807/markdown\u6587\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"4\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"4\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u7F16\u7EC4 2\" mask=\"url(#mask_markdown)\">\r\n <use xlink:href=\"#use_markdown\" />\r\n <g id=\"\u7EC4\u5408 3854\">\r\n <path id=\"\u77E2\u91CF 770\" d=\"M0 0L8 0\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" transform=\"matrix(0,1,-1,0,9,14)\" />\r\n <path id=\"\u77E2\u91CF 790\" d=\"M0 0L8 0\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" transform=\"matrix(0,1,-1,0,17,14)\" />\r\n <path id=\"\u77E2\u91CF 794\" d=\"M0 0L8 0\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" transform=\"matrix(0,1,-1,0,22,14)\" />\r\n <path id=\"\u77E2\u91CF 795\" d=\"M20 20L21.9293 21.9293C21.9683 21.9683 22.0317 21.9683 22.0707 21.9293L24 20\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 791\" d=\"M9 14L12.9106 21.8211C12.9474 21.8948 13.0526 21.8948 13.0894 21.8211L17 14\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n </g>\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(146,224,165)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- MP4\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'mp4-icon'\">\r\n <defs>\r\n <g id=\"use_mp4\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(57,121,249)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_mp4\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n <mask id=\"mask_mp4\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_mp4)\">\r\n <use xlink:href=\"#use_mp4\" />\r\n </g>\r\n </mask>\r\n </defs>\r\n <g id=\"mp4\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"8\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"8\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_mp4)\">\r\n <use xlink:href=\"#use_mp4\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(157,189,252)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u77E2\u91CF 780\" d=\"M13.5 22.5433C13.5 22.6269 13.5965 22.6736 13.6621 22.6217L19.401 18.0784C19.4515 18.0384 19.4515 17.9616 19.401 17.9216L13.6621 13.3783C13.5965 13.3264 13.5 13.3731 13.5 13.4567L13.5 22.5433Z\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- EmailFile\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'email-file-icon'\">\r\n <defs>\r\n <g id=\"use_14\">\r\n <rect id=\"\u8499\u7248\" width=\"28\" height=\"22\" x=\"2\" y=\"5\" rx=\"4\" fill=\"rgb(255,136,0)\" />\r\n <rect id=\"\u8499\u7248\" width=\"27\" height=\"21\" x=\"2.5\" y=\"5.5\" rx=\"4\" stroke=\"rgb(223,225,230)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_email\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n <mask id=\"mask_14\" width=\"28\" height=\"22\" x=\"2\" y=\"5\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_email)\">\r\n <use xlink:href=\"#use_14\" />\r\n </g>\r\n </mask>\r\n <linearGradient id=\"paint_linear_0\" x1=\"14.3386717\" x2=\"14.3386717\" y1=\"0\" y2=\"11.6952209\" gradientUnits=\"userSpaceOnUse\">\r\n <stop stop-color=\"rgb(246,247,253)\" offset=\"0\" stop-opacity=\"1\" />\r\n <stop stop-color=\"rgb(233,237,250)\" offset=\"1\" stop-opacity=\"1\" />\r\n </linearGradient>\r\n <linearGradient id=\"paint_linear_1\" x1=\"16\" x2=\"16\" y1=\"3\" y2=\"17\" gradientUnits=\"userSpaceOnUse\">\r\n <stop stop-color=\"rgb(246,247,253)\" offset=\"0\" stop-opacity=\"1\" />\r\n <stop stop-color=\"rgb(233,237,250)\" offset=\"1\" stop-opacity=\"1\" />\r\n </linearGradient>\r\n </defs>\r\n <g id=\"\u90AE\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"4\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"4\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u77E9\u5F62\" mask=\"url(#mask_14)\">\r\n <use xlink:href=\"#use_14\" />\r\n <path id=\"\u5F62\u72B6\" d=\"M0.341524 1.75256L11.7046 11.6952L0.999972 0C0.711642 0 0.43735 0.124481 0.247408 0.341492C-0.116239 0.757141 -0.074125 1.38889 0.341524 1.75256ZM27.6773 0C28.2296 0 28.6773 0.447723 28.6773 1C28.6773 1.28836 28.5528 1.56268 28.3358 1.75256L16.9727 11.6952L27.6773 0Z\" opacity=\"0\" fill=\"url(#paint_linear_0)\" fill-opacity=\"0\" fill-rule=\"evenodd\" transform=\"matrix(1,0,0,-1,1.66125,27.4999)\" />\r\n <path id=\"\u5F62\u72B6\" d=\"M0.341524 1.75256L11.7046 11.6952L0.999972 0C0.711642 0 0.43735 0.124481 0.247408 0.341492C-0.116239 0.757141 -0.074125 1.38889 0.341524 1.75256ZM27.6773 0C28.2296 0 28.6773 0.447723 28.6773 1C28.6773 1.28836 28.5528 1.56268 28.3358 1.75256L16.9727 11.6952L27.6773 0Z\" opacity=\"0\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" transform=\"matrix(1,0,0,-1,1.66125,27.4999)\" />\r\n <path id=\"\u77E9\u5F62\" d=\"M2.66145 3L29.3386 3C30.2619 3 30.692 4.14454 29.9971 4.75258L18.634 14.6952C17.1259 16.0148 14.8741 16.0148 13.366 14.6952L2.00294 4.75258C1.30804 4.14454 1.73808 3 2.66145 3Z\" fill=\"url(#paint_linear_1)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u77E9\u5F62\" d=\"M29.3386 3C30.2619 3 30.692 4.14454 29.9971 4.75258L18.634 14.6952C17.1259 16.0148 14.8741 16.0148 13.366 14.6952L2.00294 4.75258C1.30804 4.14454 1.73808 3 2.66145 3L29.3386 3Z\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 789\" d=\"M0 0L15.5563 0\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(0.707107,-0.707107,0.707107,0.707107,3,26)\" />\r\n <path id=\"\u77E2\u91CF 789\" d=\"M0 0L15.5563 0\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(-0.707107,-0.707107,-0.707107,0.707107,29,26)\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- Markdown\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'markdown-icon'\">\r\n <defs>\r\n <g id=\"use_18\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(37,194,81)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_markdown\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n <mask id=\"mask_18\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_markdown)\">\r\n <use xlink:href=\"#use_18\" />\r\n </g>\r\n </mask>\r\n </defs>\r\n <rect id=\"\u96EA\u78A7\u56FE/32px/markdown\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" />\r\n <g id=\"\u56FE\u6807/markdown\u6587\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"4\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"4\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u7F16\u7EC4 2\" mask=\"url(#mask_18)\">\r\n <use xlink:href=\"#use_18\" />\r\n <g id=\"\u7EC4\u5408 3854\">\r\n <path id=\"\u77E2\u91CF 770\" d=\"M0 0L8 0\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" transform=\"matrix(0,1,-1,0,9,14)\" />\r\n <path id=\"\u77E2\u91CF 790\" d=\"M0 0L8 0\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" transform=\"matrix(0,1,-1,0,17,14)\" />\r\n <path id=\"\u77E2\u91CF 794\" d=\"M0 0L8 0\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" transform=\"matrix(0,1,-1,0,22,14)\" />\r\n <path id=\"\u77E2\u91CF 795\" d=\"M20 20L21.9293 21.9293C21.9683 21.9683 22.0317 21.9683 22.0707 21.9293L24 20\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 791\" d=\"M9 14L12.9106 21.8211C12.9474 21.8948 13.0526 21.8948 13.0894 21.8211L17 14\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n </g>\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(146,224,165)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- Excel\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'excel-icon'\">\r\n <defs>\r\n <g id=\"use_6\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(37,194,81)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_excel\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n <mask id=\"mask_6\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_excel)\">\r\n <use xlink:href=\"#use_6\" />\r\n </g>\r\n </mask>\r\n </defs>\r\n <g id=\"\u8868\u683C\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" fill=\"rgb(0,0,0)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_6)\">\r\n <use xlink:href=\"#use_6\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(146,224,165)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <g id=\"\u7EC4\u5408 3851\">\r\n <rect id=\"\u77E9\u5F62\" width=\"15\" height=\"13\" x=\"8.5\" y=\"12.5\" rx=\"2\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"15\" height=\"13\" x=\"8.5\" y=\"12.5\" rx=\"2\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 773\" d=\"M9 19L23 19\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 773\" d=\"M0 0L14 0\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(0,-1,1,0,16,26)\" />\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- Ppt\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'ppt-icon'\">\r\n <g>\r\n <!-- \u6A59\u8272\u80CC\u666F\u5F62\u72B6 -->\r\n <path d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(255,136,0)\" fill-rule=\"evenodd\" />\r\n \r\n <!-- \u5185\u90E8\u767D\u8272 \"P\" \u5B57\u6BCD\u548C\u88C5\u9970 -->\r\n <g fill=\"#FFF\" fill-rule=\"evenodd\">\r\n <path d=\"M11.8164 9.26886L14.6559 9.26886C14.844 9.26886 14.9966 9.42141 14.9966 9.60959L14.9966 10.7454C14.9966 10.9336 14.844 11.0861 14.6559 11.0861L11.8164 11.0861L11.8164 9.26886Z\" />\r\n <path d=\"M11.8164 12.9036L14.6559 12.9036C14.844 12.9036 14.9966 13.0562 14.9966 13.2444L14.9966 14.7209L14.9966 14.7209L11.8164 14.7209L11.8164 12.9036Z\" />\r\n <path d=\"M0 0L2.83945 0C3.02763 0 3.18019 0.152552 3.18019 0.340734L3.18019 1.47652C3.18019 1.6647 3.02763 1.81725 2.83945 1.81725L0 1.81725L0 0Z\" transform=\"matrix(-1,0,0,1,13.1802,7.45172)\" />\r\n <path d=\"M0.340734 0L3.18019 0L3.18019 0L3.18019 1.81725L0.340734 1.81725C0.152552 1.81725 0 1.6647 0 1.47652L0 0.340734C0 0.152552 0.152552 0 0.340734 0Z\" transform=\"matrix(-1,0,0,1,14.9966,5.63434)\" />\r\n <path d=\"M0 0L3.18019 0L3.18019 1.81725L0.340734 1.81725C0.152552 1.81725 0 1.6647 0 1.47652L0 0L0 0Z\" transform=\"matrix(-1,0,0,1,14.9966,2.00006)\" />\r\n <path d=\"M0 0L2.83945 0C3.02763 0 3.18019 0.152552 3.18019 0.340734L3.18019 1.47652C3.18019 1.6647 3.02763 1.81725 2.83945 1.81725L0 1.81725L0 0Z\" transform=\"matrix(-1,0,0,1,13.1802,3.8172)\" />\r\n <path d=\"M0 0L2.83945 0C3.02763 0 3.18019 0.152552 3.18019 0.340734L3.18019 1.47652C3.18019 1.6647 3.02763 1.81725 2.83945 1.81725L0 1.81725L0 0Z\" transform=\"matrix(-1,0,0,1,13.1802,11.0862)\" />\r\n <path d=\"M15 17.687L15 14.72L10.0026 14.72L10.0026 17.687C10.0026 18.0556 10.3015 18.3545 10.6701 18.3545L14.3324 18.3545C14.7011 18.3545 15 18.0556 15 17.687ZM11.2478 15.6313L13.7465 15.6313L13.7465 16.8807C13.7465 17.0689 13.5939 17.2214 13.4058 17.2214L11.5885 17.2214C11.4003 17.2214 11.2478 17.0689 11.2478 16.8807L11.2478 15.6313Z\" />\r\n </g>\r\n \r\n <!-- \u6298\u89D2\u90E8\u5206 -->\r\n <path d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(252,213,164)\" fill-rule=\"evenodd\" />\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- Mp4\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'mp4-icon'\">\r\n <defs>\r\n <g id=\"use_9\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(57,121,249)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_mp4\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n <mask id=\"mask_9\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_mp4)\">\r\n <use xlink:href=\"#use_9\" />\r\n </g>\r\n </mask>\r\n </defs>\r\n <g id=\"mp4\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"8\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"8\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_9)\">\r\n <use xlink:href=\"#use_9\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(157,189,252)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u77E2\u91CF 780\" d=\"M13.5 22.5433C13.5 22.6269 13.5965 22.6736 13.6621 22.6217L19.401 18.0784C19.4515 18.0384 19.4515 17.9616 19.401 17.9216L13.6621 13.3783C13.5965 13.3264 13.5 13.3731 13.5 13.4567L13.5 22.5433Z\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- Unknown\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'unknown-icon'\">\r\n <defs>\r\n <g id=\"use_15\">\r\n <path id=\"\u8499\u7248\" d=\"M7 5L22 5L28 11L28 30C28 31.6569 26.6569 33 25 33L7 33C5.34315 33 4 31.6569 4 30L4 8C4 6.34315 5.34315 5 7 5Z\" fill=\"rgb(189,189,189)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M22 5L7 5C5.34315 5 4 6.34315 4 8L4 30C4 31.6569 5.34315 33 7 33L25 33C26.6569 33 28 31.6569 28 30L28 11L22 5ZM21.5858 6L27 11.4142L27 30C27 30.1577 26.9824 30.3113 26.9472 30.4607C26.9217 30.5687 26.8871 30.6745 26.8432 30.7782C26.7974 30.8867 26.7429 30.9896 26.6798 31.0869C26.6037 31.2041 26.5152 31.3132 26.4142 31.4142C26.3132 31.5152 26.2041 31.6037 26.0869 31.6797C25.9896 31.7429 25.8867 31.7974 25.7782 31.8432C25.6745 31.8871 25.5687 31.9217 25.4607 31.9472C25.3113 31.9824 25.1577 32 25 32L7 32C6.84229 32 6.68872 31.9824 6.53931 31.9472C6.43131 31.9217 6.32548 31.8871 6.22182 31.8432C6.11331 31.7973 6.01038 31.7428 5.91305 31.6797C5.79586 31.6037 5.68677 31.5152 5.58579 31.4142C5.48479 31.3132 5.39628 31.2041 5.32027 31.0869C5.25715 30.9896 5.20265 30.8867 5.15676 30.7782C5.11292 30.6745 5.07827 30.5687 5.05282 30.4607C5.01761 30.3113 5 30.1577 5 30L5 8C5 7.84228 5.01761 7.68871 5.05282 7.53929C5.07827 7.4313 5.11292 7.32547 5.15676 7.22182C5.20266 7.1133 5.25717 7.01037 5.32031 6.91303C5.39631 6.79585 5.4848 6.68677 5.58579 6.58579C5.68677 6.4848 5.79585 6.39631 5.91303 6.32031C6.01037 6.25717 6.1133 6.20266 6.22182 6.15676C6.32547 6.11292 6.4313 6.07827 6.53929 6.05282C6.68871 6.01761 6.84228 6 7 6L21.5858 6Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_unknown\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n <mask id=\"mask_15\" width=\"24\" height=\"28\" x=\"4\" y=\"5\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_unknown)\">\r\n <use xlink:href=\"#use_15\" />\r\n </g>\r\n </mask>\r\n <filter id=\"filter_0\" width=\"16\" height=\"16\" x=\"17\" y=\"0\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix result=\"hardAlpha\" in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0 \" />\r\n <feOffset dx=\"0\" dy=\"0\" />\r\n <feGaussianBlur stdDeviation=\"1.66666663\" />\r\n <feComposite k2=\"-1\" k3=\"1\" in2=\"hardAlpha\" operator=\"out\" />\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 0.643137 0 0 0 0 0.643137 0 0 0 0 0.643137 0 0 0 1 0 \" />\r\n <feBlend result=\"effect_dropShadow_1\" in2=\"BackgroundImageFix\" mode=\"normal\" />\r\n <feBlend result=\"shape\" in=\"SourceGraphic\" in2=\"effect_dropShadow_1\" mode=\"normal\" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u672A\u77E5\u6587\u4EF6\">\r\n <g id=\"\u56FE\u6807/\u672A\u77E5\u6587\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"3\" rx=\"8\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"3.5\" rx=\"8\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_15)\">\r\n <use xlink:href=\"#use_15\" />\r\n <g id=\"ic_public_questionmark\">\r\n <path id=\"path4\" d=\"M15.25 26.22C15.25 25.8224 15.5724 25.5 15.97 25.5L16 25.5C16.4142 25.5 16.75 25.8358 16.75 26.25C16.75 26.6642 16.4142 27 16 27L15.97 27C15.5724 27 15.25 26.6776 15.25 26.28L15.25 26.28L15.25 26.22Z\" fill=\"rgb(255,255,255)\" fill-rule=\"evenodd\" />\r\n <path id=\"path4\" d=\"M14.25 26.22C14.25 25.9872 14.2952 25.7639 14.3856 25.5502C14.4727 25.3443 14.5954 25.1622 14.7538 25.0038C14.9122 24.8454 15.0943 24.7227 15.3002 24.6356C15.5139 24.5452 15.7372 24.5 15.97 24.5L16 24.5C16.2369 24.5 16.4641 24.546 16.6815 24.6379C16.891 24.7265 17.0763 24.8514 17.2374 25.0126C17.3986 25.1737 17.5235 25.359 17.6121 25.5685C17.704 25.7859 17.75 26.0131 17.75 26.25C17.75 26.4869 17.704 26.7141 17.6121 26.9315C17.5235 27.141 17.3986 27.3263 17.2374 27.4874C17.0763 27.6486 16.891 27.7735 16.6815 27.8621C16.4641 27.954 16.2369 28 16 28L15.97 28C15.7372 28 15.5139 27.9548 15.3002 27.8644C15.0943 27.7773 14.9122 27.6546 14.7538 27.4962C14.5954 27.3378 14.4727 27.1557 14.3856 26.9498C14.2952 26.7361 14.25 26.5128 14.25 26.28L16.25 26.28C16.25 26.2027 16.2227 26.1367 16.168 26.082C16.1133 26.0273 16.0473 26 15.97 26L16 26C15.931 26 15.872 26.0244 15.8232 26.0732C15.7744 26.122 15.75 26.181 15.75 26.25C15.75 26.319 15.7744 26.378 15.8232 26.4268C15.872 26.4756 15.931 26.5 16 26.5L15.97 26.5C16.0473 26.5 16.1133 26.4727 16.168 26.418C16.2227 26.3633 16.25 26.2973 16.25 26.22L14.25 26.22ZM16.23 26.2L16.25 26.22C16.25 26.78 15.81 27.22 15.25 27.22C14.69 27.22 14.25 26.78 14.25 26.22L14.27 26.2L16.23 26.2ZMnan nanLnan nanCnan nan nan nan nan nanCnan nan nan nan nan nanLnan nan\" fill=\"rgb(25,25,25)\" fill-opacity=\"0\" fill-rule=\"nonzero\" />\r\n <path id=\"path5\" d=\"M16 23.5C16 23.2897 15.9663 22.5794 16 22.2727C16.028 22.0177 16.086 21.7987 16.2953 21.4564C16.6719 20.8404 17.836 20.1869 18.0114 20.0597C18.9117 19.407 19.5 18.3279 19.5 17.1072C19.5 15.115 17.933 13.5 16 13.5C14.067 13.5 12.5 15.115 12.5 17.1072\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" />\r\n </g>\r\n <g filter=\"url(#filter_0)\">\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 11L24 11C22.8954 11 22 10.1046 22 9L22 5L28 11Z\" fill=\"rgb(245,245,246)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 11L24 11C22.8954 11 22 10.1046 22 9L22 5L23 6L23 9C23 9.08264 23.0096 9.1629 23.0288 9.24079C23.0413 9.29117 23.0577 9.34055 23.0782 9.38894C23.1003 9.44134 23.1265 9.49116 23.1568 9.53839C23.1955 9.59887 23.2409 9.65511 23.2929 9.70711C23.3449 9.75911 23.4011 9.80448 23.4616 9.84322C23.5089 9.87346 23.5587 9.89966 23.6111 9.92183C23.6595 9.94229 23.7088 9.95874 23.7592 9.97117C23.8371 9.99039 23.9174 10 24 10L27 10L28 11Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- EmailFile\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'email-file-icon'\">\r\n <defs>\r\n\t<g id=\"use_14\">\r\n\t\t<rect id=\"\u8499\u7248\" width=\"28\" height=\"22\" x=\"2\" y=\"5\" rx=\"4\" fill=\"rgb(255,136,0)\" />\r\n\t\t<rect id=\"\u8499\u7248\" width=\"27\" height=\"21\" x=\"2.5\" y=\"5.5\" rx=\"4\" stroke=\"rgb(223,225,230)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n\t</g>\r\n\t<filter id=\"pixso_custom_mask_type_outline_email\">\r\n\t\t<feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n\t</filter>\r\n\t<mask id=\"mask_14\" width=\"28\" height=\"22\" x=\"2\" y=\"5\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n\t<g filter=\"url(#pixso_custom_mask_type_outline_email)\">\r\n\t\t<use xlink:href=\"#use_14\" />\r\n\t</g>\r\n</mask>\r\n\t<linearGradient id=\"paint_linear_0\" x1=\"14.3386717\" x2=\"14.3386717\" y1=\"0\" y2=\"11.6952209\" gradientUnits=\"userSpaceOnUse\">\r\n\t\t<stop stop-color=\"rgb(246,247,253)\" offset=\"0\" stop-opacity=\"1\" />\r\n\t\t<stop stop-color=\"rgb(233,237,250)\" offset=\"1\" stop-opacity=\"1\" />\r\n\t</linearGradient>\r\n\t<linearGradient id=\"paint_linear_1\" x1=\"16\" x2=\"16\" y1=\"3\" y2=\"17\" gradientUnits=\"userSpaceOnUse\">\r\n\t\t<stop stop-color=\"rgb(246,247,253)\" offset=\"0\" stop-opacity=\"1\" />\r\n\t\t<stop stop-color=\"rgb(233,237,250)\" offset=\"1\" stop-opacity=\"1\" />\r\n\t</linearGradient>\r\n</defs>\r\n<g id=\"\u90AE\u4EF6\">\r\n\t<rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"4\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n\t<rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"4\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n\t<g id=\"\u77E9\u5F62\" mask=\"url(#mask_14)\">\r\n\t\t<use xlink:href=\"#use_14\" />\r\n\t\t<path id=\"\u5F62\u72B6\" d=\"M2.66145 3L29.3386 3C30.2619 3 30.692 4.14454 29.9971 4.75258L18.634 14.6952C17.1259 16.0148 14.8741 16.0148 13.366 14.6952L2.00294 4.75258C1.30804 4.14454 1.73808 3 2.66145 3Z\" fill=\"url(#paint_linear_1)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n\t\t<path id=\"\u77E9\u5F62\" d=\"M29.3386 3C30.2619 3 30.692 4.14454 29.9971 4.75258L18.634 14.6952C17.1259 16.0148 14.8741 16.0148 13.366 14.6952L2.00294 4.75258C1.30804 4.14454 1.73808 3 2.66145 3L29.3386 3Z\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n\t\t<path id=\"\u77E2\u91CF 789\" d=\"M0 0L15.5563 0\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(0.707107,-0.707107,0.707107,0.707107,3,26)\" />\r\n\t\t<path id=\"\u77E2\u91CF 789\" d=\"M0 0L15.5563 0\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(-0.707107,-0.707107,-0.707107,0.707107,29,26)\" />\r\n\t</g>\r\n</g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- DrawingBoard\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'drawing-board-icon'\">\r\n <defs>\r\n <g id=\"use_drawingboard\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(92,179,0)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_drawingboard\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n <mask id=\"mask_drawingboard\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_drawingboard)\">\r\n <use xlink:href=\"#use_drawingboard\" />\r\n </g>\r\n </mask>\r\n </defs>\r\n <clipPath id=\"clipPath_drawingboard\">\r\n <rect width=\"15\" height=\"16\" x=\"9\" y=\"11\" fill=\"rgb(255,255,255)\" />\r\n </clipPath>\r\n <g id=\"\u753B\u677F\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" fill=\"rgb(0,0,0)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_drawingboard)\">\r\n <use xlink:href=\"#use_drawingboard\" />\r\n <g id=\"svg\" clip-path=\"url(#clipPath_drawingboard)\" customFrame=\"url(#clipPath_drawingboard)\">\r\n <rect id=\"svg\" width=\"15\" height=\"16\" x=\"9\" y=\"11\" />\r\n <g id=\"ic_public_office_brush-\u753B\u7B14/base/ic_public_office_brush1\">\r\n <path id=\"path6\" d=\"M13.5333 23.4382L9.875 24.8333L11.4169 20.7952L19.1124 13.1001C19.8016 12.4109 20.919 12.411 21.6081 13.1002C22.2973 13.7894 22.2973 14.9069 21.6081 15.5961L14.8912 22.3175\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" />\r\n <line id=\"path7\" x1=\"0\" x2=\"3.51560974\" y1=\"0\" y2=\"0\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"square\" stroke-linejoin=\"round\" stroke-width=\"1.5\" transform=\"matrix(0.705038,0.70917,-0.70917,0.705038,18.5347,13.6929)\" />\r\n <path id=\"path8\" d=\"M16.3501 23.632C16.7621 24.4423 17.2822 24.8475 17.9105 24.8475C18.8918 24.8475 19.3342 23.6954 20.1977 23.632C20.7734 23.5898 21.3469 23.8969 21.9183 24.5533\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 793\" d=\"M14 25.0878C14.1434 25.1785 14.5505 25.3054 15.0323 25.0878C15.514 24.8703 17.7849 24 18.2151 24C18.6452 24 18.7828 24.272 18.6452 24.6346C18.5075 24.9972 17.957 25.6318 18.129 25.9037C18.3011 26.1756 19.9355 25.8131 20.6237 25.5411C21.3118 25.2691 21.828 25.3598 22 25.5411\" opacity=\"0\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"path9\" d=\"M20.1849 23.4575C20.8232 23.4106 21.4459 23.7441 22.0503 24.4384C22.1137 24.5113 22.1061 24.6219 22.0332 24.6853C21.9603 24.7488 21.8497 24.7411 21.7863 24.6682C21.2478 24.0496 20.7235 23.7689 20.2105 23.8065C19.9376 23.8265 19.7196 23.9568 19.338 24.287C19.2903 24.3284 19.2903 24.3284 19.2421 24.3704C18.6985 24.8433 18.3888 25.0225 17.9105 25.0225C17.2076 25.0225 16.6332 24.5751 16.1941 23.7113C16.1503 23.6251 16.1846 23.5198 16.2708 23.476C16.3569 23.4322 16.4623 23.4665 16.5061 23.5527C16.8908 24.3095 17.3568 24.6725 17.9105 24.6725C18.2771 24.6725 18.5295 24.5264 19.0123 24.1063C19.0605 24.0644 19.0605 24.0644 19.109 24.0223C19.5446 23.6454 19.8136 23.4847 20.1849 23.4575Z\" fill=\"rgb(255,255,255)\" fill-opacity=\"0\" fill-rule=\"nonzero\" />\r\n <path id=\"path9\" d=\"M22.0503 24.4384C22.1137 24.5113 22.1061 24.6219 22.0332 24.6853C21.9603 24.7488 21.8497 24.7411 21.7863 24.6682C21.2478 24.0496 20.7235 23.7689 20.2105 23.8065C19.9376 23.8265 19.7196 23.9568 19.338 24.287C19.2903 24.3284 19.2903 24.3284 19.2421 24.3704C18.6985 24.8433 18.3888 25.0225 17.9105 25.0225C17.2076 25.0225 16.6332 24.5751 16.1941 23.7113C16.1503 23.6251 16.1846 23.5198 16.2708 23.476C16.3569 23.4322 16.4623 23.4665 16.5061 23.5527C16.8908 24.3095 17.3568 24.6725 17.9105 24.6725C18.2771 24.6725 18.5295 24.5264 19.0123 24.1063C19.0605 24.0644 19.0605 24.0644 19.109 24.0223C19.5446 23.6454 19.8136 23.4847 20.1849 23.4575C20.8232 23.4106 21.4459 23.7441 22.0503 24.4384Z\" fill-rule=\"nonzero\" stroke=\"rgb(255,255,255)\" stroke-opacity=\"0\" stroke-linejoin=\"round\" stroke-width=\"0.699999988\" />\r\n </g>\r\n </g>\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(185,230,131)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84 6\" d=\"M8.5 21.3938L12.2173 17.4814L16.3341 22L23.5 14L8.5 21.3938Z\" opacity=\"0\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84 6\" d=\"M8.5 21.3938L12.2173 17.4814L16.3341 22L23.5 14\" opacity=\"0\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- EmailFile\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'email-file-icon'\">\r\n <mask id=\"mask_emailfile\" width=\"28\" height=\"22\" x=\"2\" y=\"5\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_emailfile)\">\r\n <use xlink:href=\"#use_emailfile\" />\r\n </g>\r\n </mask>\r\n <defs>\r\n <g id=\"use_emailfile\">\r\n <rect id=\"\u8499\u7248\" width=\"28\" height=\"22\" x=\"2\" y=\"5\" rx=\"4\" fill=\"rgb(255,136,0)\" />\r\n <rect id=\"\u8499\u7248\" width=\"27\" height=\"21\" x=\"2.5\" y=\"5.5\" rx=\"4\" stroke=\"rgb(223,225,230)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_emailfile\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n <linearGradient id=\"paint_linear_0_emailfile\" x1=\"14.3386717\" x2=\"14.3386717\" y1=\"0\" y2=\"11.6952209\" gradientUnits=\"userSpaceOnUse\">\r\n <stop stop-color=\"rgb(246,247,253)\" offset=\"0\" stop-opacity=\"1\" />\r\n <stop stop-color=\"rgb(233,237,250)\" offset=\"1\" stop-opacity=\"1\" />\r\n </linearGradient>\r\n <linearGradient id=\"paint_linear_1_emailfile\" x1=\"16\" x2=\"16\" y1=\"3\" y2=\"17\" gradientUnits=\"userSpaceOnUse\">\r\n <stop stop-color=\"rgb(246,247,253)\" offset=\"0\" stop-opacity=\"1\" />\r\n <stop stop-color=\"rgb(233,237,250)\" offset=\"1\" stop-opacity=\"1\" />\r\n </linearGradient>\r\n </defs>\r\n <g id=\"\u90AE\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"4\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"4\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u77E9\u5F62\" mask=\"url(#mask_emailfile)\">\r\n <use xlink:href=\"#use_emailfile\" />\r\n <path id=\"\u5F62\u72B6\" d=\"M0.341524 1.75256L11.7046 11.6952L0.999972 0C0.711642 0 0.43735 0.124481 0.247408 0.341492C-0.116239 0.757141 -0.074125 1.38889 0.341524 1.75256ZM27.6773 0C28.2296 0 28.6773 0.447723 28.6773 1C28.6773 1.28836 28.5528 1.56268 28.3358 1.75256L16.9727 11.6952L27.6773 0Z\" opacity=\"0\" fill=\"url(#paint_linear_0_emailfile)\" fill-opacity=\"0\" fill-rule=\"evenodd\" transform=\"matrix(1,0,0,-1,1.66125,27.4999)\" />\r\n <path id=\"\u5F62\u72B6\" d=\"M0.341524 1.75256L11.7046 11.6952L0.999972 0C0.711642 0 0.43735 0.124481 0.247408 0.341492C-0.116239 0.757141 -0.074125 1.38889 0.341524 1.75256ZM27.6773 0C28.2296 0 28.6773 0.447723 28.6773 1C28.6773 1.28836 28.5528 1.56268 28.3358 1.75256L16.9727 11.6952L27.6773 0Z\" opacity=\"0\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" transform=\"matrix(1,0,0,-1,1.66125,27.4999)\" />\r\n <path id=\"\u77E9\u5F62\" d=\"M2.66145 3L29.3386 3C30.2619 3 30.692 4.14454 29.9971 4.75258L18.634 14.6952C17.1259 16.0148 14.8741 16.0148 13.366 14.6952L2.00294 4.75258C1.30804 4.14454 1.73808 3 2.66145 3Z\" fill=\"url(#paint_linear_1_emailfile)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u77E9\u5F62\" d=\"M29.3386 3C30.2619 3 30.692 4.14454 29.9971 4.75258L18.634 14.6952C17.1259 16.0148 14.8741 16.0148 13.366 14.6952L2.00294 4.75258C1.30804 4.14454 1.73808 3 2.66145 3L29.3386 3Z\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 789\" d=\"M0 0L15.5563 0\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(0.707107,-0.707107,0.707107,0.707107,3,26)\" />\r\n <path id=\"\u77E2\u91CF 789\" d=\"M0 0L15.5563 0\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(-0.707107,-0.707107,-0.707107,0.707107,29,26)\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- FlowChart\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'flow-chart-icon'\">\r\n <mask id=\"mask_flowchart\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_flowchart)\">\r\n <use xlink:href=\"#use_flowchart\" />\r\n </g>\r\n </mask>\r\n <defs>\r\n <g id=\"use_flowchart\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(242,48,48)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_flowchart\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u6D41\u7A0B\u56FE\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" fill=\"rgb(0,0,0)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u7F16\u7EC4 2\" mask=\"url(#mask_flowchart)\">\r\n <use xlink:href=\"#use_flowchart\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(250,167,163)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M6.54991 5L2.5 5C1.11929 5 -1.09279e-07 3.88071 -1.09279e-07 2.5C-1.09279e-07 1.11929 1.11929 0 2.5 0L12 0L6.54991 5Z\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" fill-rule=\"evenodd\" transform=\"matrix(-1,0,0,1,23.5,13)\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M6.54991 5L2.5 5C1.11929 5 -1.09279e-07 3.88071 -1.09279e-07 2.5C-1.09279e-07 1.11929 1.11929 0 2.5 0L12 0\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(-1,0,0,1,23.5,13)\" />\r\n <path id=\"\u8DEF\u5F84\u5907\u4EFD\" d=\"M8.64563 5L2.5 5C1.11929 5 -1.09278e-07 3.88071 -1.09278e-07 2.5C-1.09278e-07 1.11929 1.11929 0 2.5 0L11.9084 0L8.64563 5Z\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" fill-rule=\"evenodd\" transform=\"matrix(1,0,0,-1,9,23)\" />\r\n <path id=\"\u8DEF\u5F84\u5907\u4EFD\" d=\"M8.64563 5L2.5 5C1.11929 5 -1.09278e-07 3.88071 -1.09278e-07 2.5C-1.09278e-07 1.11929 1.11929 0 2.5 0L11.9084 0\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(1,0,0,-1,9,23)\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"3\" height=\"3\" x=\"20.5\" y=\"21.5\" rx=\"1.5\" fill=\"rgb(18,119,255)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"3\" height=\"3\" x=\"20.5\" y=\"21.5\" rx=\"1.5\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 16\" width=\"3\" height=\"3\" x=\"0\" y=\"0\" rx=\"1.5\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" transform=\"matrix(0.707107,0.707107,-0.707107,0.707107,10.5,10.8787)\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 16\" width=\"3\" height=\"3\" x=\"0\" y=\"0\" rx=\"1.5\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" transform=\"matrix(0.707107,0.707107,-0.707107,0.707107,10.5,10.8787)\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- DrawingBoard\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'drawing-board-icon'\">\r\n <mask id=\"mask_4\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_drawingboard)\">\r\n <use xlink:href=\"#use_4\" />\r\n </g>\r\n </mask>\r\n <defs>\r\n <g id=\"use_4\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(92,179,0)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_drawingboard\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n <clipPath id=\"clipPath_2\">\r\n <rect width=\"15\" height=\"16\" x=\"9\" y=\"11\" fill=\"rgb(255,255,255)\" />\r\n </clipPath>\r\n </defs>\r\n <g id=\"\u753B\u677F\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" fill=\"rgb(0,0,0)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_4)\">\r\n <use xlink:href=\"#use_4\" />\r\n <g id=\"svg\" clip-path=\"url(#clipPath_2)\">\r\n <rect id=\"svg\" width=\"15\" height=\"16\" x=\"9\" y=\"11\" />\r\n <g id=\"ic_public_office_brush-\u753B\u7B14/base/ic_public_office_brush1\">\r\n <path id=\"path6\" d=\"M13.5333 23.4382L9.875 24.8333L11.4169 20.7952L19.1124 13.1001C19.8016 12.4109 20.919 12.411 21.6081 13.1002C22.2973 13.7894 22.2973 14.9069 21.6081 15.5961L14.8912 22.3175\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" />\r\n <line id=\"path7\" x1=\"0\" x2=\"3.51560974\" y1=\"0\" y2=\"0\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"square\" stroke-linejoin=\"round\" stroke-width=\"1.5\" transform=\"matrix(0.705038,0.70917,-0.70917,0.705038,18.5347,13.6929)\" />\r\n <path id=\"path8\" d=\"M16.3501 23.632C16.7621 24.4423 17.2822 24.8475 17.9105 24.8475C18.8918 24.8475 19.3342 23.6954 20.1977 23.632C20.7734 23.5898 21.3469 23.8969 21.9183 24.5533\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 793\" d=\"M14 25.0878C14.1434 25.1785 14.5505 25.3054 15.0323 25.0878C15.514 24.8703 17.7849 24 18.2151 24C18.6452 24 18.7828 24.272 18.6452 24.6346C18.5075 24.9972 17.957 25.6318 18.129 25.9037C18.3011 26.1756 19.9355 25.8131 20.6237 25.5411C21.3118 25.2691 21.828 25.3598 22 25.5411\" opacity=\"0\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"path9\" d=\"M20.1849 23.4575C20.8232 23.4106 21.4459 23.7441 22.0503 24.4384C22.1137 24.5113 22.1061 24.6219 22.0332 24.6853C21.9603 24.7488 21.8497 24.7411 21.7863 24.6682C21.2478 24.0496 20.7235 23.7689 20.2105 23.8065C19.9376 23.8265 19.7196 23.9568 19.338 24.287C19.2903 24.3284 19.2903 24.3284 19.2421 24.3704C18.6985 24.8433 18.3888 25.0225 17.9105 25.0225C17.2076 25.0225 16.6332 24.5751 16.1941 23.7113C16.1503 23.6251 16.1846 23.5198 16.2708 23.476C16.3569 23.4322 16.4623 23.4665 16.5061 23.5527C16.8908 24.3095 17.3568 24.6725 17.9105 24.6725C18.2771 24.6725 18.5295 24.5264 19.0123 24.1063C19.0605 24.0644 19.0605 24.0644 19.109 24.0223C19.5446 23.6454 19.8136 23.4847 20.1849 23.4575Z\" fill=\"rgb(255,255,255)\" fill-opacity=\"0\" fill-rule=\"nonzero\" />\r\n <path id=\"path9\" d=\"M22.0503 24.4384C22.1137 24.5113 22.1061 24.6219 22.0332 24.6853C21.9603 24.7488 21.8497 24.7411 21.7863 24.6682C21.2478 24.0496 20.7235 23.7689 20.2105 23.8065C19.9376 23.8265 19.7196 23.9568 19.338 24.287C19.2903 24.3284 19.2903 24.3284 19.2421 24.3704C18.6985 24.8433 18.3888 25.0225 17.9105 25.0225C17.2076 25.0225 16.6332 24.5751 16.1941 23.7113C16.1503 23.6251 16.1846 23.5198 16.2708 23.476C16.3569 23.4322 16.4623 23.4665 16.5061 23.5527C16.8908 24.3095 17.3568 24.6725 17.9105 24.6725C18.2771 24.6725 18.5295 24.5264 19.0123 24.1063C19.0605 24.0644 19.0605 24.0644 19.109 24.0223C19.5446 23.6454 19.8136 23.4847 20.1849 23.4575C20.8232 23.4106 21.4459 23.7441 22.0503 24.4384Z\" fill-rule=\"nonzero\" stroke=\"rgb(255,255,255)\" stroke-opacity=\"0\" stroke-linejoin=\"round\" stroke-width=\"0.699999988\" />\r\n </g>\r\n </g>\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(185,230,131)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84 6\" d=\"M8.5 21.3938L12.2173 17.4814L16.3341 22L23.5 14L8.5 21.3938Z\" opacity=\"0\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84 6\" d=\"M8.5 21.3938L12.2173 17.4814L16.3341 22L23.5 14\" opacity=\"0\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- DrawingBoard\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'drawing-board-icon'\">\r\n <mask id=\"mask_4\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n\t<g filter=\"url(#pixso_custom_mask_type_outline_drawingboard)\">\r\n\t\t<use xlink:href=\"#use_4\" />\r\n\t</g>\r\n</mask>\r\n<defs>\r\n\t<g id=\"use_4\">\r\n\t\t<path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(92,179,0)\" fill-rule=\"evenodd\" />\r\n\t\t<path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n\t</g>\r\n\t<filter id=\"pixso_custom_mask_type_outline_drawingboard\">\r\n\t\t<feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n\t</filter>\r\n\t<clipPath id=\"clipPath_2\">\r\n\t\t<rect width=\"15\" height=\"16\" x=\"9\" y=\"11\" fill=\"rgb(255,255,255)\" />\r\n\t</clipPath>\r\n</defs>\r\n<g id=\"\u753B\u677F\">\r\n\t<rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" fill=\"rgb(0,0,0)\" fill-opacity=\"0\" />\r\n\t<rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n\t<g id=\"\u8DEF\u5F84\" mask=\"url(#mask_4)\">\r\n\t\t<use xlink:href=\"#use_4\" />\r\n\t\t<g id=\"svg\" clip-path=\"url(#clipPath_2)\">\r\n\t\t\t<rect id=\"svg\" width=\"15\" height=\"16\" x=\"9\" y=\"11\" />\r\n\t\t\t<g id=\"ic_public_office_brush-\u753B\u7B14/base/ic_public_office_brush1\">\r\n\t\t\t\t<path id=\"path6\" d=\"M13.5333 23.4382L9.875 24.8333L11.4169 20.7952L19.1124 13.1001C19.8016 12.4109 20.919 12.411 21.6081 13.1002C22.2973 13.7894 22.2973 14.9069 21.6081 15.5961L14.8912 22.3175\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" />\r\n\t\t\t\t<line id=\"path7\" x1=\"0\" x2=\"3.51560974\" y1=\"0\" y2=\"0\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"square\" stroke-linejoin=\"round\" stroke-width=\"1.5\" transform=\"matrix(0.705038,0.70917,-0.70917,0.705038,18.5347,13.6929)\" />\r\n\t\t\t\t<path id=\"path8\" d=\"M16.3501 23.632C16.7621 24.4423 17.2822 24.8475 17.9105 24.8475C18.8918 24.8475 19.3342 23.6954 20.1977 23.632C20.7734 23.5898 21.3469 23.8969 21.9183 24.5533\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" />\r\n\t\t\t</g>\r\n\t\t</g>\r\n\t\t<path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(185,230,131)\" fill-rule=\"evenodd\" />\r\n\t\t<path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n\t</g>\r\n</g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- Mind\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'mind-icon'\">\r\n <mask id=\"mask_mind\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_mind)\">\r\n <use xlink:href=\"#use_mind\" />\r\n </g>\r\n </mask>\r\n <defs>\r\n <g id=\"use_mind\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(164,47,214)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_mind\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u601D\u7EF4\u5BFC\u56FE\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" fill=\"rgb(0,0,0)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u7F16\u7EC4 2\" mask=\"url(#mask_mind)\">\r\n <use xlink:href=\"#use_mind\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(222,163,247)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <g id=\"\u7F16\u7EC4 33\">\r\n <rect id=\"\u77E9\u5F62\" width=\"4\" height=\"4\" x=\"8.5\" y=\"17\" rx=\"2\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"4\" height=\"4\" x=\"8.5\" y=\"17\" rx=\"2\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 13\" width=\"4\" height=\"4\" x=\"19.5\" y=\"12.5\" rx=\"2\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 13\" width=\"4\" height=\"4\" x=\"19.5\" y=\"12.5\" rx=\"2\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 15\" width=\"4\" height=\"4\" x=\"19.5\" y=\"21.5\" rx=\"2\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 15\" width=\"4\" height=\"4\" x=\"19.5\" y=\"21.5\" rx=\"2\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u8DEF\u5F84 5\" d=\"M12.5 19L16.0087 19\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M19.446 23.5244L17.9496 23.5139C16.8505 23.5139 15.9636 22.6131 15.9636 21.514L15.9636 16.5141C15.9636 15.404 16.8676 14.5141 17.9776 14.5141L19.446 14.5244L19.446 23.5244Z\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M19.446 23.5244L17.9496 23.5139C16.8505 23.5139 15.9636 22.6131 15.9636 21.514L15.9636 16.5141C15.9636 15.404 16.8676 14.5141 17.9776 14.5141L19.446 14.5244\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- MultidimentionalTable\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'multidimentional-table-icon'\">\r\n <mask id=\"mask_multidimentionaltable\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_multidimentionaltable)\">\r\n <use xlink:href=\"#use_multidimentionaltable\" />\r\n </g>\r\n </mask>\r\n <defs>\r\n <g id=\"use_multidimentionaltable\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(164,47,214)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_multidimentionaltable\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u591A\u7EF4\u8868\u683C\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" fill=\"rgb(0,0,0)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u8DEF\u5F84\" mask=\"url(#mask_multidimentionaltable)\">\r\n <use xlink:href=\"#use_multidimentionaltable\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(222,163,247)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"8\" height=\"5\" x=\"15.5\" y=\"18.5\" rx=\"1\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"8\" height=\"5\" x=\"15.5\" y=\"18.5\" rx=\"1\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 777\" d=\"M8.5 13.5L23.5 13.5\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 787\" d=\"M8.5 18.5L12.5 18.5\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 788\" d=\"M8.5 23.5L12.5 23.5\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" />\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- FolderClosed\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'folder-closed-icon'\">\r\n <g id=\"\u6587\u4EF6\u5939\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" opacity=\"0\" fill=\"rgb(216,216,216)\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" opacity=\"0\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M10.6827 3C11.4448 3 12.1642 3.32848 12.6706 3.89284L12.8502 4.11535L14.4435 6.3149C14.5736 6.49445 14.7581 6.61238 14.9591 6.65238L15.1124 6.6675L25.3046 6.6675C26.7138 6.6675 27.858 7.76563 27.9877 9.1545L28 9.41813L28 13.1331L4 13.2962L4 5.75062C4 4.32856 5.06133 3.14678 6.43445 3.01267L6.69538 3L10.6827 3Z\" fill=\"rgb(10,89,247)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u77E9\u5F62\u5907\u4EFD\" d=\"M5.06048 11L26.9994 11C28.7906 11 30.1826 12.5593 29.9802 14.339L28.6154 26.339C28.443 27.8549 27.1603 29 25.6347 29L6.42524 29C4.89956 29 3.61686 27.8549 3.44446 26.339L2.0797 14.339C1.8773 12.5593 3.26934 11 5.06048 11Z\" fill=\"rgb(77.6591,136.773,255)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u77E9\u5F62\u5907\u4EFD\" d=\"M26.9994 11L5.06048 11C3.26934 11 1.8773 12.5593 2.0797 14.339L3.44446 26.339C3.61686 27.8549 4.89956 29 6.42524 29L25.6347 29C27.1603 29 28.443 27.8549 28.6154 26.339L29.9802 14.339C30.1826 12.5593 28.7906 11 26.9994 11ZM5.06048 12L26.9994 12C27.1728 12 27.3408 12.021 27.5033 12.0631C27.6156 12.0922 27.7252 12.1312 27.8322 12.1803C27.945 12.2321 28.0512 12.2931 28.1509 12.3635C28.2745 12.4507 28.388 12.5522 28.4914 12.6681C28.5948 12.7839 28.6828 12.9081 28.7555 13.0407C28.8142 13.1477 28.8628 13.2602 28.9015 13.3781C28.9382 13.4901 28.9647 13.6034 28.9809 13.7182C29.0043 13.8845 29.0062 14.0537 28.9866 14.226L27.6218 26.226C27.6057 26.368 27.5754 26.5053 27.5309 26.6378C27.4974 26.7377 27.4558 26.8349 27.4062 26.9293C27.3545 27.0277 27.2956 27.1205 27.2295 27.2077C27.1518 27.3101 27.0642 27.4048 26.9666 27.492C26.869 27.5791 26.765 27.6554 26.6546 27.721C26.5603 27.7769 26.4614 27.825 26.3579 27.8652C26.2583 27.9039 26.157 27.9342 26.0538 27.9562C25.9172 27.9854 25.7775 28 25.6347 28L6.42524 28C6.2824 28 6.14267 27.9854 6.00606 27.9562C5.90294 27.9342 5.8016 27.9039 5.70203 27.8652C5.59843 27.825 5.49949 27.7769 5.40523 27.7209C5.29486 27.6554 5.19089 27.5791 5.09333 27.492C4.99575 27.4049 4.90817 27.3102 4.83058 27.2079C4.76434 27.1206 4.70539 27.0277 4.65372 26.9293C4.60407 26.8348 4.56248 26.7376 4.52894 26.6376C4.4845 26.5052 4.4542 26.368 4.43805 26.226L3.07329 14.226C3.0537 14.0537 3.05561 13.8844 3.07905 13.7182C3.09523 13.6034 3.12167 13.49 3.15838 13.3781C3.19704 13.2602 3.24569 13.1478 3.30431 13.0409C3.37702 12.9082 3.46509 12.7839 3.5685 12.6681C3.67191 12.5522 3.78541 12.4507 3.90901 12.3635C4.00866 12.2931 4.11488 12.2321 4.22766 12.1804C4.3347 12.1312 4.44435 12.0922 4.55659 12.0631C4.71911 12.021 4.88707 12 5.06048 12Z\" fill=\"rgb(151,151,151)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- FolderOpen\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'folder-open-icon'\">\r\n <g id=\"\u6587\u4EF6\u5939\u6253\u5F00\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" opacity=\"0\" fill=\"rgb(216,216,216)\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" opacity=\"0\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <path id=\"\u5F62\u72B6\u7ED3\u5408\" d=\"M8.68272 3.00009C9.44485 3.00009 10.1642 3.32858 10.6706 3.89294L10.8502 4.11545L12.4435 6.315C12.5736 6.49454 12.7581 6.61249 12.9591 6.65247L13.1124 6.6676L23.3046 6.6676C24.7138 6.6676 25.858 7.76572 25.9877 9.1546L26 9.41821L26 10.0002L8.31796 10.0002C6.53639 10.0002 4.96957 11.1784 4.47511 12.89L2 21.4577L2 5.7507C2 4.32864 3.06133 3.14688 4.43445 3.01276L4.69539 3.00009L8.68272 3.00009Z\" fill=\"rgb(10,89,247)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u77E9\u5F62\u5907\u4EFD\" d=\"M9.55932 12L27.5463 12C29.1323 12 30.2822 13.5109 29.8596 15.0395L26.4055 27.5329C26.1659 28.3997 25.3771 29 24.4778 29L4.10314 29C2.75891 29 1.79742 27.7004 2.19061 26.415L5.73426 14.83C6.24862 13.1484 7.80085 12 9.55932 12Z\" fill=\"rgb(77.6591,136.773,255)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u77E9\u5F62\u5907\u4EFD\" d=\"M27.5463 12L9.55932 12C7.80085 12 6.24862 13.1484 5.73426 14.83L2.19061 26.415C1.79742 27.7004 2.75891 29 4.10314 29L24.4778 29C25.3771 29 26.1659 28.3997 26.4055 27.5329L29.8596 15.0395C30.2822 13.5109 29.1323 12 27.5463 12ZM9.55932 13L27.5463 13C27.6876 13 27.8231 13.0195 27.9527 13.0584C28.0311 13.082 28.1074 13.1127 28.1816 13.1506C28.262 13.1917 28.3371 13.2395 28.407 13.2942C28.5011 13.3678 28.5856 13.4538 28.6604 13.5521C28.7352 13.6505 28.7956 13.7548 28.8415 13.8652C28.8756 13.947 28.9017 14.0322 28.9198 14.1207C28.9366 14.2022 28.9458 14.2839 28.9477 14.3658C28.9507 14.5011 28.9334 14.6369 28.8957 14.7731L25.4417 27.2665C25.4117 27.3748 25.3669 27.4731 25.3072 27.5613C25.2475 27.6495 25.1729 27.7277 25.0834 27.7958C24.994 27.8638 24.8988 27.9149 24.7978 27.9489C24.6969 27.983 24.5902 28 24.4778 28L4.10314 28C3.99633 28 3.89442 27.9846 3.79741 27.9537C3.74453 27.9369 3.6931 27.9155 3.64313 27.8896C3.58717 27.8605 3.53485 27.8268 3.48618 27.7884C3.41636 27.7334 3.35405 27.6688 3.29924 27.5948C3.24443 27.5207 3.20094 27.4422 3.16875 27.3594C3.14631 27.3016 3.12937 27.2417 3.11792 27.1797C3.1077 27.1243 3.10229 27.0689 3.10168 27.0134C3.10057 26.9116 3.11563 26.8096 3.14688 26.7075L6.69053 15.1225C6.74279 14.9516 6.80901 14.7879 6.8892 14.6314C6.95529 14.5023 7.03085 14.3782 7.11591 14.2589C7.20303 14.1367 7.29816 14.0222 7.4013 13.9155C7.51597 13.7969 7.64054 13.6878 7.77502 13.5883C7.90949 13.4888 8.05021 13.4016 8.1972 13.3266C8.32942 13.2592 8.4667 13.2017 8.60905 13.1542C8.74802 13.1077 8.88885 13.0718 9.03156 13.0463C9.20473 13.0154 9.38064 13 9.55932 13Z\" fill=\"rgb(151,151,151)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- Mind\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'mind-icon'\">\r\n <mask id=\"mask_12\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline_mind)\">\r\n <use xlink:href=\"#use_12\" />\r\n </g>\r\n </mask>\r\n <defs>\r\n <g id=\"use_12\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(164,47,214)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline_mind\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"\u601D\u7EF4\u5BFC\u56FE\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" fill=\"rgb(0,0,0)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u7F16\u7EC4 2\" mask=\"url(#mask_12)\">\r\n <use xlink:href=\"#use_12\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(222,163,247)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <g id=\"\u7F16\u7EC4 33\">\r\n <rect id=\"\u77E9\u5F62\" width=\"4\" height=\"4\" x=\"8.5\" y=\"17\" rx=\"2\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"4\" height=\"4\" x=\"8.5\" y=\"17\" rx=\"2\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 13\" width=\"4\" height=\"4\" x=\"19.5\" y=\"12.5\" rx=\"2\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 13\" width=\"4\" height=\"4\" x=\"19.5\" y=\"12.5\" rx=\"2\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 15\" width=\"4\" height=\"4\" x=\"19.5\" y=\"21.5\" rx=\"2\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 15\" width=\"4\" height=\"4\" x=\"19.5\" y=\"21.5\" rx=\"2\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u8DEF\u5F84 5\" d=\"M12.5 19L16.0087 19\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M19.446 23.5244L17.9496 23.5139C16.8505 23.5139 15.9636 22.6131 15.9636 21.514L15.9636 16.5141C15.9636 15.404 16.8676 14.5141 17.9776 14.5141L19.446 14.5244L19.446 23.5244Z\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M19.446 23.5244L17.9496 23.5139C16.8505 23.5139 15.9636 22.6131 15.9636 21.514L15.9636 16.5141C15.9636 15.404 16.8676 14.5141 17.9776 14.5141L19.446 14.5244\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- Page\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'page-icon'\">\r\n <mask id=\"mask_7\" width=\"24\" height=\"28\" x=\"4\" y=\"2\" maskUnits=\"userSpaceOnUse\" mask-type=\"outline\">\r\n <g filter=\"url(#pixso_custom_mask_type_outline)\">\r\n <use xlink:href=\"#use_7\" />\r\n </g>\r\n </mask>\r\n <defs>\r\n <g id=\"use_7\">\r\n <path id=\"\u8499\u7248\" d=\"M7 2L20 2L28 10L28 27C28 28.6569 26.6569 30 25 30L7 30C5.34315 30 4 28.6569 4 27L4 5C4 3.34315 5.34315 2 7 2Z\" fill=\"rgb(37,194,81)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8499\u7248\" d=\"M20 2L7 2C5.34315 2 4 3.34315 4 5L4 27C4 28.6569 5.34315 30 7 30L25 30C26.6569 30 28 28.6569 28 27L28 10L20 2ZM19.5858 3L27 10.4142L27 27C27 27.1577 26.9824 27.3113 26.9472 27.4607C26.9217 27.5687 26.8871 27.6745 26.8432 27.7782C26.7974 27.8867 26.7429 27.9896 26.6798 28.0869C26.6037 28.2041 26.5152 28.3132 26.4142 28.4142C26.3132 28.5152 26.2041 28.6037 26.0869 28.6797C25.9896 28.7429 25.8867 28.7974 25.7782 28.8432C25.6745 28.8871 25.5687 28.9217 25.4607 28.9472C25.3113 28.9824 25.1577 29 25 29L7 29C6.84229 29 6.68872 28.9824 6.53931 28.9472C6.43131 28.9217 6.32548 28.8871 6.22182 28.8432C6.11331 28.7973 6.01038 28.7428 5.91305 28.6797C5.79586 28.6037 5.68677 28.5152 5.58579 28.4142C5.48479 28.3132 5.39628 28.2041 5.32027 28.0869C5.25715 27.9896 5.20265 27.8867 5.15676 27.7782C5.11292 27.6745 5.07827 27.5687 5.05282 27.4607C5.01761 27.3113 5 27.1577 5 27L5 5C5 4.84228 5.01761 4.68871 5.05282 4.53929C5.07827 4.4313 5.11292 4.32547 5.15676 4.22182C5.20266 4.1133 5.25717 4.01037 5.32031 3.91303C5.39631 3.79585 5.4848 3.68677 5.58579 3.58579C5.68677 3.4848 5.79585 3.39631 5.91303 3.32031C6.01037 3.25717 6.1133 3.20266 6.22182 3.15676C6.32547 3.11292 6.4313 3.07827 6.53929 3.05282C6.68871 3.01761 6.84228 3 7 3L19.5858 3Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n </g>\r\n <filter id=\"pixso_custom_mask_type_outline\">\r\n <feColorMatrix type=\"matrix\" values=\"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 255 0 \" />\r\n </filter>\r\n </defs>\r\n <g id=\"Page\">\r\n <g id=\"\u56FE\u6807/word\u6587\u4EF6\">\r\n <rect id=\"\u77E9\u5F62\" width=\"32\" height=\"32\" x=\"0\" y=\"0\" rx=\"4\" fill=\"rgb(238,240,245)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"31\" height=\"31\" x=\"0.5\" y=\"0.5\" rx=\"4\" stroke=\"rgb(151,151,151)\" stroke-opacity=\"0\" stroke-width=\"1\" />\r\n <g id=\"\u7F16\u7EC4 2\" mask=\"url(#mask_7)\">\r\n <use xlink:href=\"#use_7\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L28 10Z\" fill=\"rgb(146,224,165)\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M28 10L21.5 10C20.6716 10 20 9.32843 20 8.5L20 2L21 3L21 8.5C21 8.56903 21.0122 8.63301 21.0366 8.69194C21.061 8.75087 21.0976 8.80474 21.1464 8.85355C21.1953 8.90237 21.2491 8.93898 21.3081 8.96339C21.367 8.9878 21.431 9 21.5 9L27 9L28 10Z\" fill=\"rgb(223,225,230)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <g id=\"\u7F16\u7EC4 34\">\r\n <path id=\"\u8DEF\u5F84\" d=\"M11.2618 22L10.5 22C9.39543 22 8.5 20.9553 8.5 19.6667L8.5 17.3333C8.5 16.0447 9.39543 15 10.5 15L11.4798 15L11.2618 22Z\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" fill-rule=\"evenodd\" />\r\n <path id=\"\u8DEF\u5F84\" d=\"M11.2618 22L10.5 22C9.39543 22 8.5 20.9553 8.5 19.6667L8.5 17.3333C8.5 16.0447 9.39543 15 10.5 15L11.4798 15\" fill-rule=\"evenodd\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"4\" height=\"3\" x=\"11.5\" y=\"13.5\" rx=\"1.5\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\" width=\"4\" height=\"3\" x=\"11.5\" y=\"13.5\" rx=\"1.5\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 11\" width=\"4\" height=\"3\" x=\"11.5\" y=\"20.5\" rx=\"1.5\" fill=\"rgb(216,216,216)\" fill-opacity=\"0\" />\r\n <rect id=\"\u77E9\u5F62\u5907\u4EFD 11\" width=\"4\" height=\"3\" x=\"11.5\" y=\"20.5\" rx=\"1.5\" stroke=\"rgb(255,255,255)\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 774\" d=\"M19 13.5L23 13.5\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 775\" d=\"M19 18.5L23 18.5\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" />\r\n <path id=\"\u77E2\u91CF 776\" d=\"M19 23.5L23 23.5\" stroke=\"rgb(255,255,255)\" stroke-linecap=\"round\" stroke-width=\"1.5\" />\r\n </g>\r\n </g>\r\n </g>\r\n </g>\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n\r\n <!-- Wrong\u6587\u4EF6\u56FE\u6807 -->\r\n <ng-container *ngIf=\"iconType === 'wrong-icon'\">\r\n <!-- \u80CC\u666F\u4E09\u89D2 -->\r\n <path \r\n d=\"M7.84 0.99L13.88 12.12C14.13 12.57 13.95 13.14 13.49 13.38C13.35 13.46 13.2 13.5 13.04 13.5H0.95C0.42 13.5 0 13.08 0 12.56C0 12.4 0.03 12.25 0.11 12.12L6.15 0.99C6.4 0.53 6.98 0.36 7.44 0.61C7.61 0.69 7.75 0.83 7.84 0.99Z\" \r\n fill=\"white\"\r\n />\r\n <!-- \u611F\u53F9\u53F7\u7684\u70B9 -->\r\n <path \r\n d=\"M7 11.5C6.58 11.5 6.25 11.16 6.25 10.75C6.25 10.33 6.58 10 7 10C7.41 10 7.75 10.33 7.75 10.75C7.75 11.16 7.41 11.5 7 11.5Z\" \r\n fill=\"#F23030\"\r\n />\r\n <!-- \u611F\u53F9\u53F7\u7684\u7AD6\u7EBF -->\r\n <rect \r\n x=\"6.5\" \r\n y=\"4.5\" \r\n width=\"1\" \r\n height=\"4.5\" \r\n rx=\"0.5\" \r\n fill=\"#F23030\"\r\n />\r\n </ng-container>\r\n\r\n <!-- \u5176\u4ED6\u56FE\u6807\u7C7B\u578B\u53EF\u4EE5\u5728\u8FD9\u91CC\u6DFB\u52A0 -->\r\n</svg>" }]
|
|
1319
|
+
}], propDecorators: { iconType: [{
|
|
1320
|
+
type: Input
|
|
1321
|
+
}], size: [{
|
|
1322
|
+
type: Input
|
|
1323
|
+
}], title: [{
|
|
1324
|
+
type: Input
|
|
1325
|
+
}], customClass: [{
|
|
1326
|
+
type: Input
|
|
1327
|
+
}] } });
|
|
1328
|
+
|
|
1329
|
+
class LocaleModule {
|
|
1330
|
+
/**
|
|
1331
|
+
* 静态方法,用于配置模块并提供服务
|
|
1332
|
+
* 可以在AppModule中使用LocaleModule.forRoot()来初始化
|
|
1333
|
+
*/
|
|
1334
|
+
static forRoot() {
|
|
1335
|
+
return {
|
|
1336
|
+
ngModule: LocaleModule,
|
|
1337
|
+
providers: [
|
|
1338
|
+
LocaleService
|
|
1339
|
+
]
|
|
1340
|
+
};
|
|
1341
|
+
}
|
|
1342
|
+
/**
|
|
1343
|
+
* 普通导入方法,用于特性模块中导入
|
|
1344
|
+
* 避免服务被多次实例化
|
|
1345
|
+
*/
|
|
1346
|
+
static forChild() {
|
|
1347
|
+
return {
|
|
1348
|
+
ngModule: LocaleModule,
|
|
1349
|
+
providers: [] // 子模块不提供服务实例
|
|
1350
|
+
};
|
|
1351
|
+
}
|
|
1352
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LocaleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1353
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.10", ngImport: i0, type: LocaleModule }); }
|
|
1354
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LocaleModule }); }
|
|
1355
|
+
}
|
|
1356
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LocaleModule, decorators: [{
|
|
1357
|
+
type: NgModule,
|
|
1358
|
+
args: [{
|
|
1359
|
+
declarations: [],
|
|
1360
|
+
imports: [],
|
|
1361
|
+
exports: []
|
|
1362
|
+
}]
|
|
1363
|
+
}] });
|
|
1364
|
+
|
|
1365
|
+
// 导出Locale服务
|
|
1366
|
+
|
|
1367
|
+
class McFileListComponent extends BaseComponent {
|
|
1368
|
+
constructor(localeService, sanitizer) {
|
|
1369
|
+
super();
|
|
1370
|
+
this.localeService = localeService;
|
|
1371
|
+
this.sanitizer = sanitizer;
|
|
1372
|
+
this.fileItems = [];
|
|
1373
|
+
this.context = 'dialog';
|
|
1374
|
+
this.remove = new EventEmitter();
|
|
1375
|
+
this.retryUpload = new EventEmitter();
|
|
1376
|
+
this.download = new EventEmitter();
|
|
1377
|
+
this.preview = new EventEmitter();
|
|
1378
|
+
this.retryDownload = new EventEmitter();
|
|
1379
|
+
this.hoveredFileUid = null;
|
|
1380
|
+
this.isPreviewVisible = false;
|
|
1381
|
+
this.previewFile = null;
|
|
1382
|
+
}
|
|
1383
|
+
ngOnInit() {
|
|
1384
|
+
this.foundation = new FileListFoundation(this.adapter);
|
|
1385
|
+
this.foundation.init();
|
|
1386
|
+
}
|
|
1387
|
+
get adapter() {
|
|
1388
|
+
return {
|
|
1389
|
+
emitRemove: (uid) => {
|
|
1390
|
+
const file = this.fileItems.find((item) => item.uid === uid);
|
|
1391
|
+
if (file) {
|
|
1392
|
+
this.remove.emit(file);
|
|
1393
|
+
}
|
|
1394
|
+
},
|
|
1395
|
+
emitRetryUpload: (uid) => {
|
|
1396
|
+
const file = this.fileItems.find((item) => item.uid === uid);
|
|
1397
|
+
if (file) {
|
|
1398
|
+
this.retryUpload.emit(file);
|
|
1399
|
+
}
|
|
1400
|
+
},
|
|
1401
|
+
emitDownload: (file) => {
|
|
1402
|
+
this.download.emit([file, new Event('download')]);
|
|
1403
|
+
},
|
|
1404
|
+
emitPreview: (file) => {
|
|
1405
|
+
this.preview.emit(file);
|
|
1406
|
+
},
|
|
1407
|
+
emitRetryDownload: (uid) => {
|
|
1408
|
+
const file = this.fileItems.find((item) => item.uid === uid);
|
|
1409
|
+
if (file) {
|
|
1410
|
+
this.retryDownload.emit(file);
|
|
1411
|
+
}
|
|
1412
|
+
},
|
|
1413
|
+
updateFileItem: (uid, updates) => {
|
|
1414
|
+
const index = this.fileItems.findIndex((item) => item.uid === uid);
|
|
1415
|
+
if (index !== -1) {
|
|
1416
|
+
this.fileItems[index] = { ...this.fileItems[index], ...updates };
|
|
1417
|
+
}
|
|
1418
|
+
},
|
|
1419
|
+
getProp: (key) => {
|
|
1420
|
+
return this[key];
|
|
1421
|
+
},
|
|
1422
|
+
getProps: () => {
|
|
1423
|
+
return {
|
|
1424
|
+
fileItems: this.fileItems,
|
|
1425
|
+
context: this.context,
|
|
1426
|
+
};
|
|
1427
|
+
},
|
|
1428
|
+
getState: (key) => {
|
|
1429
|
+
return this[key];
|
|
1430
|
+
},
|
|
1431
|
+
getStates: () => {
|
|
1432
|
+
return {
|
|
1433
|
+
isPreviewVisible: this.isPreviewVisible,
|
|
1434
|
+
previewFile: this.previewFile,
|
|
1435
|
+
hoveredFileUid: this.hoveredFileUid,
|
|
1436
|
+
};
|
|
1437
|
+
},
|
|
1438
|
+
setState: (s, callback) => {
|
|
1439
|
+
Object.assign(this, s);
|
|
1440
|
+
if (callback) {
|
|
1441
|
+
callback();
|
|
1442
|
+
}
|
|
1443
|
+
},
|
|
1444
|
+
getCache: (c) => {
|
|
1445
|
+
return undefined;
|
|
1446
|
+
},
|
|
1447
|
+
getCaches: () => {
|
|
1448
|
+
return {};
|
|
1449
|
+
},
|
|
1450
|
+
setCache: (key, value) => {
|
|
1451
|
+
// 空实现
|
|
1452
|
+
},
|
|
1453
|
+
nextTick: (cb) => {
|
|
1454
|
+
setTimeout(cb, 0);
|
|
1455
|
+
},
|
|
1456
|
+
};
|
|
1457
|
+
}
|
|
1458
|
+
formatFileSize(bytes) {
|
|
1459
|
+
return this.foundation.formatFileSize(bytes);
|
|
1460
|
+
}
|
|
1461
|
+
getPreviewType(file) {
|
|
1462
|
+
return this.foundation.getPreviewType(file);
|
|
1463
|
+
}
|
|
1464
|
+
getIconComponent(file) {
|
|
1465
|
+
return this.foundation.getIconComponent(file);
|
|
1466
|
+
}
|
|
1467
|
+
getFileTypeString(filename) {
|
|
1468
|
+
return this.foundation.getFileType(filename);
|
|
1469
|
+
}
|
|
1470
|
+
handleRemove(file) {
|
|
1471
|
+
this.foundation.handleRemove(file.uid);
|
|
1472
|
+
}
|
|
1473
|
+
handleRetryUpload(file) {
|
|
1474
|
+
this.foundation.handleRetryUpload(file.uid);
|
|
1475
|
+
}
|
|
1476
|
+
handleDownload(file, event) {
|
|
1477
|
+
this.foundation.handleDownload(file);
|
|
1478
|
+
}
|
|
1479
|
+
handlePreview(file) {
|
|
1480
|
+
// 只有当文件有可供预览的 URL (url 或 thumbUrl) 时,才触发预览
|
|
1481
|
+
if (file.url || file['thumbUrl']) {
|
|
1482
|
+
this.previewFile = file;
|
|
1483
|
+
this.isPreviewVisible = true;
|
|
1484
|
+
this.foundation.handlePreview(file);
|
|
1485
|
+
}
|
|
1486
|
+
}
|
|
1487
|
+
// 确保 previewFile?.name 有默认值
|
|
1488
|
+
get previewFileName() {
|
|
1489
|
+
return this.previewFile?.name || '';
|
|
1490
|
+
}
|
|
1491
|
+
handleRetryDownload(file) {
|
|
1492
|
+
this.foundation.handleRetryDownload(file.uid);
|
|
1493
|
+
}
|
|
1494
|
+
closePreview() {
|
|
1495
|
+
this.isPreviewVisible = false;
|
|
1496
|
+
this.previewFile = null;
|
|
1497
|
+
}
|
|
1498
|
+
handleKeyDown(event) {
|
|
1499
|
+
if (event.key === 'Escape' && this.isPreviewVisible) {
|
|
1500
|
+
this.closePreview();
|
|
1501
|
+
}
|
|
1502
|
+
}
|
|
1503
|
+
// 国际化翻译方法
|
|
1504
|
+
t(key, params) {
|
|
1505
|
+
try {
|
|
1506
|
+
return this.localeService.translate(key, params);
|
|
1507
|
+
}
|
|
1508
|
+
catch (error) {
|
|
1509
|
+
console.warn(`Translation error for key: ${key}`, error);
|
|
1510
|
+
return key;
|
|
1511
|
+
}
|
|
1512
|
+
}
|
|
1513
|
+
// 安全处理 URL
|
|
1514
|
+
sanitizeUrl(url) {
|
|
1515
|
+
if (!url) {
|
|
1516
|
+
return this.sanitizer.bypassSecurityTrustResourceUrl('');
|
|
1517
|
+
}
|
|
1518
|
+
return this.sanitizer.bypassSecurityTrustResourceUrl(url);
|
|
1519
|
+
}
|
|
1520
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: McFileListComponent, deps: [{ token: LocaleService }, { token: i2.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1521
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: McFileListComponent, isStandalone: true, selector: "mc-file-list", inputs: { fileItems: "fileItems", context: "context" }, outputs: { remove: "remove", retryUpload: "retryUpload", download: "download", preview: "preview", retryDownload: "retryDownload" }, host: { listeners: { "document:keydown": "handleKeyDown($event)" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"mc-file-list\" [class]=\"`mc-file-list--context-${context}`\">\r\n <div class=\"mc-file-list__container\">\r\n <div\r\n *ngFor=\"let file of fileItems\"\r\n class=\"mc-file-item\"\r\n [class]=\"file.status ? `mc-file-item--${file.status}` : ''\"\r\n (mouseenter)=\"hoveredFileUid = file.uid\"\r\n (mouseleave)=\"hoveredFileUid = null\"\r\n >\r\n <!-- \u6587\u4EF6\u56FE\u6807\u548C\u8FDB\u5EA6 -->\r\n <div class=\"mc-file-item__icon-container\">\r\n <!-- \u56FE\u7247\u9884\u89C8 -->\r\n <ng-container *ngIf=\"getPreviewType(file) === 'image' && (file['thumbUrl'] || file.url)\">\r\n <img [src]=\"sanitizeUrl(file['thumbUrl'] || file.url)\" [alt]=\"file.name\" class=\"mc-file-item__image-preview\" (click)=\"handlePreview(file)\">\r\n </ng-container>\r\n <!-- \u539F\u6765\u7684\u56FE\u6807 -->\r\n <ng-container *ngIf=\"!(getPreviewType(file) === 'image' && (file['thumbUrl'] || file.url))\">\r\n <mc-file-icon class=\"mc-file-item__icon\" [iconType]=\"getIconComponent(file)\" [size]=\"36\" [title]=\"file.name\"></mc-file-icon>\r\n </ng-container>\r\n <!-- \u8FDB\u5EA6\u8986\u76D6\u5C42 (\u540C\u65F6\u5904\u7406\u4E0A\u4F20\u548C\u4E0B\u8F7D) -->\r\n <div *ngIf=\"file.status === 'uploading' || file.status === 'downloading' || file.status === 'error' || file.status === 'uploadError' || file.status === 'downloadError'\" class=\"mc-file-item__progress-overlay\">\r\n <div class=\"mc-file-item__progress-mask\"></div>\r\n <!-- \u5931\u8D25\u72B6\u6001\uFF1A\u663E\u793A Wrong \u56FE\u6807 -->\r\n <ng-container *ngIf=\"file.status === 'error' || file.status === 'uploadError' || file.status === 'downloadError'\">\r\n <svg class=\"mc-file-item__wrong-icon\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 14 14\" fill=\"none\">\r\n <!-- \u80CC\u666F\u4E09\u89D2 -->\r\n <path \r\n d=\"M7.84 0.99L13.88 12.12C14.13 12.57 13.95 13.14 13.49 13.38C13.35 13.46 13.2 13.5 13.04 13.5H0.95C0.42 13.5 0 13.08 0 12.56C0 12.4 0.03 12.25 0.11 12.12L6.15 0.99C6.4 0.53 6.98 0.36 7.44 0.61C7.61 0.69 7.75 0.83 7.84 0.99Z\" \r\n fill=\"white\"\r\n />\r\n <!-- \u611F\u53F9\u53F7\u7684\u70B9 -->\r\n <path \r\n d=\"M7 11.5C6.58 11.5 6.25 11.16 6.25 10.75C6.25 10.33 6.58 10 7 10C7.41 10 7.75 10.33 7.75 10.75C7.75 11.16 7.41 11.5 7 11.5Z\" \r\n fill=\"#F23030\"\r\n />\r\n <!-- \u611F\u53F9\u53F7\u7684\u7AD6\u7EBF -->\r\n <rect \r\n x=\"6.5\" \r\n y=\"4.5\" \r\n width=\"1\" \r\n height=\"4.5\" \r\n rx=\"0.5\" \r\n fill=\"#F23030\"\r\n />\r\n </svg>\r\n </ng-container>\r\n <ng-container *ngIf=\"file.status === 'uploading' || file.status === 'downloading'\">\r\n <svg class=\"mc-file-item__progress-ring\" viewBox=\"0 0 36 36\">\r\n <path class=\"mc-file-item__progress-ring-track\" d=\"M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831\" />\r\n <path\r\n class=\"mc-file-item__progress-ring-circle\"\r\n stroke-dasharray=\"100, 100\"\r\n [style.strokeDashoffset]=\"100 - (file.percentage || 0)\"\r\n d=\"M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831\"\r\n />\r\n </svg>\r\n </ng-container>\r\n </div>\r\n </div>\r\n\r\n <!-- \u6587\u4EF6\u4FE1\u606F -->\r\n <div class=\"mc-file-item__info\">\r\n <div class=\"mc-file-item__name\" [title]=\"file.name\">{{ file.name }}</div>\r\n <div class=\"mc-file-item__meta\">\r\n <!-- 1. \u5931\u8D25\u72B6\u6001 (\u7EDF\u4E00\u5904\u7406\u4E0A\u4F20\u548C\u4E0B\u8F7D\u5931\u8D25) -->\r\n <ng-container *ngIf=\"file.status === 'error' || file.status === 'uploadError' || file.status === 'downloadError'\">\r\n <span \r\n class=\"mc-file-item__status mc-file-item__status--error\" \r\n [title]=\"typeof file.error === 'string' ? file.error : (file.status === 'downloadError' ? t('FileList.downloadFailed') : t('FileList.uploadFailed'))\"\r\n >\r\n {{ file.status === 'downloadError' ? t('FileList.downloadFailed') : t('FileList.uploadFailed') }}\r\n </span>\r\n <span\r\n class=\"mc-file-item__meta-action\"\r\n (click)=\"file.status === 'downloadError' ? handleRetryDownload(file) : handleRetryUpload(file)\"\r\n >{{ t('FileList.retry') }}</span>\r\n </ng-container>\r\n <!-- 2. \u60AC\u505C\u72B6\u6001 -->\r\n <ng-container *ngIf=\"hoveredFileUid === file.uid && file.status === 'success'\">\r\n <span class=\"mc-file-item__meta-action\" (click)=\"handleDownload(file, $event)\">{{ t('FileList.download') }}</span>\r\n <span class=\"mc-file-item__meta-action\" (click)=\"handlePreview(file)\">{{ t('FileList.preview') }}</span>\r\n </ng-container>\r\n <!-- 3. \u4E0A\u4F20/\u4E0B\u8F7D\u4E2D\u72B6\u6001 -->\r\n <ng-container *ngIf=\"file.status === 'uploading' || file.status === 'downloading'\">\r\n <span class=\"mc-file-item__status\">{{ t(`FileList.${file.status}`) }}</span>\r\n </ng-container>\r\n <!-- 4. \u9ED8\u8BA4\u72B6\u6001 -->\r\n <ng-container *ngIf=\"!file.status || file.status === 'success' && hoveredFileUid !== file.uid\">\r\n <span class=\"mc-file-item__file-type\">{{ getFileTypeString(file.name) }}</span>\r\n <span class=\"mc-file-item__size\">{{ formatFileSize(file.size) }}</span>\r\n </ng-container>\r\n </div>\r\n </div>\r\n <!-- \u5220\u9664\u6309\u94AE -->\r\n <div class=\"mc-file-item__actions\" *ngIf=\"context === 'input'\">\r\n <!-- \u5220\u9664\u6309\u94AE -->\r\n <button (click)=\"handleRemove(file)\" class=\"mc-file-item__action-btn mc-file-item__action-btn--remove\" [title]=\"t('FileList.remove')\">\r\n X\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- \u4F7F\u7528 mc-teleport \u7EC4\u4EF6\u52A0\u8F7D\u6587\u4EF6\u9884\u89C8 -->\r\n <mc-teleport [to]=\"'body'\">\r\n <div *ngIf=\"isPreviewVisible && previewFile\" class=\"mc-file-preview__overlay\" (click.self)=\"closePreview()\">\r\n <!-- \u56FE\u7247\u9884\u89C8 -->\r\n <img *ngIf=\"getPreviewType(previewFile) === 'image'\" [src]=\"sanitizeUrl(previewFile?.['thumbUrl'] || previewFile?.url)\" [alt]=\"previewFile?.name\" class=\"mc-file-preview__content\" />\r\n <!-- \u89C6\u9891\u9884\u89C8 -->\r\n <video *ngIf=\"getPreviewType(previewFile) === 'video'\" [src]=\"sanitizeUrl(previewFile?.url)\" controls class=\"mc-file-preview__content\"></video>\r\n <!-- PDF \u548C \u6587\u672C\u6587\u4EF6\u9884\u89C8 (\u4F7F\u7528 iframe) -->\r\n <iframe *ngIf=\"getPreviewType(previewFile) === 'iframe'\" [src]=\"sanitizeUrl(previewFile?.url)\" class=\"mc-file-preview__content mc-file-preview__iframe\"></iframe>\r\n <!-- \u5176\u4ED6\u6587\u4EF6\u7C7B\u578B\u7684\u5360\u4F4D\u7B26 -->\r\n <div *ngIf=\"getPreviewType(previewFile) === 'unsupported'\" class=\"mc-file-preview__unsupported\">\r\n <span>{{ t('FileList.unsupportedPreview', { fileName: previewFileName }) }}</span>\r\n <span class=\"mc-file-preview__unsupported-tip\">{{ t('FileList.tryDownload') }}</span>\r\n </div>\r\n <!-- \u5173\u95ED\u6309\u94AE -->\r\n <button class=\"mc-file-preview__close-btn\" (click)=\"closePreview()\" [title]=\"t('FileList.close')\">\u2715</button>\r\n </div>\r\n </mc-teleport>\r\n</div>", styles: [".mc-file-list{background-color:var(--devui-base-bg, #ffffff);padding:0 10px}.mc-file-list--context-input{position:relative;padding-bottom:5px}.mc-file-list--context-input .mc-file-list__container{overflow-y:auto}.mc-file-list--context-input:after{content:\"\";position:absolute;bottom:0;left:50%;transform:translate(-50%);width:97%;height:1px;background-color:var(--devui-dividing-line, #f2f2f3)}.mc-file-list--context-dialog{padding:0 10px}.mc-file-list--context-dialog .mc-file-list__container{max-height:none;overflow-y:visible}.mc-file-list--context-dialog .mc-file-item{border-color:var(--devui-line, #d7d8da)}.mc-file-list--context-dialog .mc-file-item--downloadError,.mc-file-list--context-dialog .mc-file-item--downloading{background-color:var(--devui-base-bg, #ffffff)}.mc-file-list__container{display:flex;padding:2px 0;flex-wrap:wrap}.mc-file-list__container::-webkit-scrollbar{width:4px}.mc-file-list__container::-webkit-scrollbar-track{background:var(--devui-global-bg, #f6f6f8)}.mc-file-list__container::-webkit-scrollbar-thumb{background:var(--devui-disabled-bg, #f5f5f5);border-radius:2px}.mc-file-item{position:relative;width:192px;height:58px;margin:5px;display:flex;align-items:center;padding:4px 8px;border:1px solid var(--devui-line, #d7d8da);transition:all .3s ease;border-radius:var(--devui-border-radius-card, 6px)}.mc-file-item:hover .mc-file-item__actions{opacity:1}.mc-file-item__image-preview{width:36px;height:36px;object-fit:cover;border-radius:var(--devui-border-radius, 2px);cursor:pointer}.mc-file-item--success,.mc-file-item--uploadError,.mc-file-item--downloadError{background-color:var(--devui-base-bg, #ffffff)}.mc-file-item__icon-container{margin-right:10px;flex-shrink:0;position:relative;display:flex;align-items:center;justify-content:center;width:36px;height:36px}.mc-file-item__icon{position:relative;display:flex;align-items:center;justify-content:center}.mc-file-item__type-icon{display:inline-block}.mc-file-item__info{flex:1;min-width:0}.mc-file-item__name{font-size:var(--devui-font-size-sm, 12px);color:var(--devui-text, #252b3a);margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mc-file-item__meta{display:flex;align-items:center;font-size:var(--devui-font-size-sm, 12px);color:var(--devui-aide-text, #71757f);gap:8px}.mc-file-item__meta-action{color:var(--devui-link, #526ecc);cursor:pointer}.mc-file-item__size{color:var(--devui-aide-text, #71757f)}.mc-file-item__status--error{color:var(--devui-danger, #f66f6a)}.mc-file-item__progress-overlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;border-radius:7px;overflow:hidden}.mc-file-item__progress-mask{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#0006}.mc-file-item__wrong-icon{position:relative;z-index:999}.mc-file-item__progress-ring{position:relative;width:17.5px;height:17.5px}.mc-file-item__progress-ring-track,.mc-file-item__progress-ring-circle{fill:transparent;stroke-width:5}.mc-file-item__progress-ring-track{stroke:var(--devui-disabled-bg, #f5f5f5);stroke-opacity:.3}.mc-file-item__progress-ring-circle{stroke:var(--devui-base-bg, #ffffff);stroke-linecap:round;transition:stroke-dashoffset .3s}.mc-file-item__actions{position:absolute;top:-6px;right:-6px;opacity:0;display:flex;align-items:center;justify-content:center;transition:opacity .3s ease}.mc-file-item__action-btn{border:none;background:#c2c2c2;cursor:pointer;border-radius:50%;font-size:8px;width:12px;height:12px;line-height:11px;padding:0;transition:all .3s ease}.mc-file-item__action-btn--remove{color:var(--devui-light-text, #ffffff)}.mc-file-preview__overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000b3;display:flex;align-items:center;justify-content:center;z-index:2000}.mc-file-preview__content{max-width:90vw;max-height:90vh;object-fit:contain}.mc-file-preview__iframe{width:80vw;height:90vh;border:none}.mc-file-preview__unsupported{padding:40px 60px;background-color:var(--devui-base-bg, #ffffff);border-radius:var(--devui-border-radius, 2px);color:var(--devui-text, #252b3a);font-size:var(--devui-font-size, 12px)}.mc-file-preview__close-btn{position:absolute;top:40px;right:40px;width:40px;height:40px;border-radius:50%;background:#1e1e1e80;color:#fff;border:none;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1;transition:background-color .2s}.mc-file-preview__close-btn:hover{background:#0009}.mc-file-preview-fade-enter-active,.mc-file-preview-fade-leave-active{transition:opacity .3s ease}.mc-file-preview-fade-enter-from,.mc-file-preview-fade-leave-to{opacity:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: McFileIconComponent, selector: "mc-file-icon", inputs: ["iconType", "size", "title", "customClass"] }, { kind: "component", type: McTeleportComponent, selector: "mc-teleport", inputs: ["to"] }] }); }
|
|
1522
|
+
}
|
|
1523
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: McFileListComponent, decorators: [{
|
|
1524
|
+
type: Component,
|
|
1525
|
+
args: [{ selector: 'mc-file-list', standalone: true, imports: [CommonModule, McFileIconComponent, McTeleportComponent], template: "<div class=\"mc-file-list\" [class]=\"`mc-file-list--context-${context}`\">\r\n <div class=\"mc-file-list__container\">\r\n <div\r\n *ngFor=\"let file of fileItems\"\r\n class=\"mc-file-item\"\r\n [class]=\"file.status ? `mc-file-item--${file.status}` : ''\"\r\n (mouseenter)=\"hoveredFileUid = file.uid\"\r\n (mouseleave)=\"hoveredFileUid = null\"\r\n >\r\n <!-- \u6587\u4EF6\u56FE\u6807\u548C\u8FDB\u5EA6 -->\r\n <div class=\"mc-file-item__icon-container\">\r\n <!-- \u56FE\u7247\u9884\u89C8 -->\r\n <ng-container *ngIf=\"getPreviewType(file) === 'image' && (file['thumbUrl'] || file.url)\">\r\n <img [src]=\"sanitizeUrl(file['thumbUrl'] || file.url)\" [alt]=\"file.name\" class=\"mc-file-item__image-preview\" (click)=\"handlePreview(file)\">\r\n </ng-container>\r\n <!-- \u539F\u6765\u7684\u56FE\u6807 -->\r\n <ng-container *ngIf=\"!(getPreviewType(file) === 'image' && (file['thumbUrl'] || file.url))\">\r\n <mc-file-icon class=\"mc-file-item__icon\" [iconType]=\"getIconComponent(file)\" [size]=\"36\" [title]=\"file.name\"></mc-file-icon>\r\n </ng-container>\r\n <!-- \u8FDB\u5EA6\u8986\u76D6\u5C42 (\u540C\u65F6\u5904\u7406\u4E0A\u4F20\u548C\u4E0B\u8F7D) -->\r\n <div *ngIf=\"file.status === 'uploading' || file.status === 'downloading' || file.status === 'error' || file.status === 'uploadError' || file.status === 'downloadError'\" class=\"mc-file-item__progress-overlay\">\r\n <div class=\"mc-file-item__progress-mask\"></div>\r\n <!-- \u5931\u8D25\u72B6\u6001\uFF1A\u663E\u793A Wrong \u56FE\u6807 -->\r\n <ng-container *ngIf=\"file.status === 'error' || file.status === 'uploadError' || file.status === 'downloadError'\">\r\n <svg class=\"mc-file-item__wrong-icon\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 14 14\" fill=\"none\">\r\n <!-- \u80CC\u666F\u4E09\u89D2 -->\r\n <path \r\n d=\"M7.84 0.99L13.88 12.12C14.13 12.57 13.95 13.14 13.49 13.38C13.35 13.46 13.2 13.5 13.04 13.5H0.95C0.42 13.5 0 13.08 0 12.56C0 12.4 0.03 12.25 0.11 12.12L6.15 0.99C6.4 0.53 6.98 0.36 7.44 0.61C7.61 0.69 7.75 0.83 7.84 0.99Z\" \r\n fill=\"white\"\r\n />\r\n <!-- \u611F\u53F9\u53F7\u7684\u70B9 -->\r\n <path \r\n d=\"M7 11.5C6.58 11.5 6.25 11.16 6.25 10.75C6.25 10.33 6.58 10 7 10C7.41 10 7.75 10.33 7.75 10.75C7.75 11.16 7.41 11.5 7 11.5Z\" \r\n fill=\"#F23030\"\r\n />\r\n <!-- \u611F\u53F9\u53F7\u7684\u7AD6\u7EBF -->\r\n <rect \r\n x=\"6.5\" \r\n y=\"4.5\" \r\n width=\"1\" \r\n height=\"4.5\" \r\n rx=\"0.5\" \r\n fill=\"#F23030\"\r\n />\r\n </svg>\r\n </ng-container>\r\n <ng-container *ngIf=\"file.status === 'uploading' || file.status === 'downloading'\">\r\n <svg class=\"mc-file-item__progress-ring\" viewBox=\"0 0 36 36\">\r\n <path class=\"mc-file-item__progress-ring-track\" d=\"M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831\" />\r\n <path\r\n class=\"mc-file-item__progress-ring-circle\"\r\n stroke-dasharray=\"100, 100\"\r\n [style.strokeDashoffset]=\"100 - (file.percentage || 0)\"\r\n d=\"M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831\"\r\n />\r\n </svg>\r\n </ng-container>\r\n </div>\r\n </div>\r\n\r\n <!-- \u6587\u4EF6\u4FE1\u606F -->\r\n <div class=\"mc-file-item__info\">\r\n <div class=\"mc-file-item__name\" [title]=\"file.name\">{{ file.name }}</div>\r\n <div class=\"mc-file-item__meta\">\r\n <!-- 1. \u5931\u8D25\u72B6\u6001 (\u7EDF\u4E00\u5904\u7406\u4E0A\u4F20\u548C\u4E0B\u8F7D\u5931\u8D25) -->\r\n <ng-container *ngIf=\"file.status === 'error' || file.status === 'uploadError' || file.status === 'downloadError'\">\r\n <span \r\n class=\"mc-file-item__status mc-file-item__status--error\" \r\n [title]=\"typeof file.error === 'string' ? file.error : (file.status === 'downloadError' ? t('FileList.downloadFailed') : t('FileList.uploadFailed'))\"\r\n >\r\n {{ file.status === 'downloadError' ? t('FileList.downloadFailed') : t('FileList.uploadFailed') }}\r\n </span>\r\n <span\r\n class=\"mc-file-item__meta-action\"\r\n (click)=\"file.status === 'downloadError' ? handleRetryDownload(file) : handleRetryUpload(file)\"\r\n >{{ t('FileList.retry') }}</span>\r\n </ng-container>\r\n <!-- 2. \u60AC\u505C\u72B6\u6001 -->\r\n <ng-container *ngIf=\"hoveredFileUid === file.uid && file.status === 'success'\">\r\n <span class=\"mc-file-item__meta-action\" (click)=\"handleDownload(file, $event)\">{{ t('FileList.download') }}</span>\r\n <span class=\"mc-file-item__meta-action\" (click)=\"handlePreview(file)\">{{ t('FileList.preview') }}</span>\r\n </ng-container>\r\n <!-- 3. \u4E0A\u4F20/\u4E0B\u8F7D\u4E2D\u72B6\u6001 -->\r\n <ng-container *ngIf=\"file.status === 'uploading' || file.status === 'downloading'\">\r\n <span class=\"mc-file-item__status\">{{ t(`FileList.${file.status}`) }}</span>\r\n </ng-container>\r\n <!-- 4. \u9ED8\u8BA4\u72B6\u6001 -->\r\n <ng-container *ngIf=\"!file.status || file.status === 'success' && hoveredFileUid !== file.uid\">\r\n <span class=\"mc-file-item__file-type\">{{ getFileTypeString(file.name) }}</span>\r\n <span class=\"mc-file-item__size\">{{ formatFileSize(file.size) }}</span>\r\n </ng-container>\r\n </div>\r\n </div>\r\n <!-- \u5220\u9664\u6309\u94AE -->\r\n <div class=\"mc-file-item__actions\" *ngIf=\"context === 'input'\">\r\n <!-- \u5220\u9664\u6309\u94AE -->\r\n <button (click)=\"handleRemove(file)\" class=\"mc-file-item__action-btn mc-file-item__action-btn--remove\" [title]=\"t('FileList.remove')\">\r\n X\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- \u4F7F\u7528 mc-teleport \u7EC4\u4EF6\u52A0\u8F7D\u6587\u4EF6\u9884\u89C8 -->\r\n <mc-teleport [to]=\"'body'\">\r\n <div *ngIf=\"isPreviewVisible && previewFile\" class=\"mc-file-preview__overlay\" (click.self)=\"closePreview()\">\r\n <!-- \u56FE\u7247\u9884\u89C8 -->\r\n <img *ngIf=\"getPreviewType(previewFile) === 'image'\" [src]=\"sanitizeUrl(previewFile?.['thumbUrl'] || previewFile?.url)\" [alt]=\"previewFile?.name\" class=\"mc-file-preview__content\" />\r\n <!-- \u89C6\u9891\u9884\u89C8 -->\r\n <video *ngIf=\"getPreviewType(previewFile) === 'video'\" [src]=\"sanitizeUrl(previewFile?.url)\" controls class=\"mc-file-preview__content\"></video>\r\n <!-- PDF \u548C \u6587\u672C\u6587\u4EF6\u9884\u89C8 (\u4F7F\u7528 iframe) -->\r\n <iframe *ngIf=\"getPreviewType(previewFile) === 'iframe'\" [src]=\"sanitizeUrl(previewFile?.url)\" class=\"mc-file-preview__content mc-file-preview__iframe\"></iframe>\r\n <!-- \u5176\u4ED6\u6587\u4EF6\u7C7B\u578B\u7684\u5360\u4F4D\u7B26 -->\r\n <div *ngIf=\"getPreviewType(previewFile) === 'unsupported'\" class=\"mc-file-preview__unsupported\">\r\n <span>{{ t('FileList.unsupportedPreview', { fileName: previewFileName }) }}</span>\r\n <span class=\"mc-file-preview__unsupported-tip\">{{ t('FileList.tryDownload') }}</span>\r\n </div>\r\n <!-- \u5173\u95ED\u6309\u94AE -->\r\n <button class=\"mc-file-preview__close-btn\" (click)=\"closePreview()\" [title]=\"t('FileList.close')\">\u2715</button>\r\n </div>\r\n </mc-teleport>\r\n</div>", styles: [".mc-file-list{background-color:var(--devui-base-bg, #ffffff);padding:0 10px}.mc-file-list--context-input{position:relative;padding-bottom:5px}.mc-file-list--context-input .mc-file-list__container{overflow-y:auto}.mc-file-list--context-input:after{content:\"\";position:absolute;bottom:0;left:50%;transform:translate(-50%);width:97%;height:1px;background-color:var(--devui-dividing-line, #f2f2f3)}.mc-file-list--context-dialog{padding:0 10px}.mc-file-list--context-dialog .mc-file-list__container{max-height:none;overflow-y:visible}.mc-file-list--context-dialog .mc-file-item{border-color:var(--devui-line, #d7d8da)}.mc-file-list--context-dialog .mc-file-item--downloadError,.mc-file-list--context-dialog .mc-file-item--downloading{background-color:var(--devui-base-bg, #ffffff)}.mc-file-list__container{display:flex;padding:2px 0;flex-wrap:wrap}.mc-file-list__container::-webkit-scrollbar{width:4px}.mc-file-list__container::-webkit-scrollbar-track{background:var(--devui-global-bg, #f6f6f8)}.mc-file-list__container::-webkit-scrollbar-thumb{background:var(--devui-disabled-bg, #f5f5f5);border-radius:2px}.mc-file-item{position:relative;width:192px;height:58px;margin:5px;display:flex;align-items:center;padding:4px 8px;border:1px solid var(--devui-line, #d7d8da);transition:all .3s ease;border-radius:var(--devui-border-radius-card, 6px)}.mc-file-item:hover .mc-file-item__actions{opacity:1}.mc-file-item__image-preview{width:36px;height:36px;object-fit:cover;border-radius:var(--devui-border-radius, 2px);cursor:pointer}.mc-file-item--success,.mc-file-item--uploadError,.mc-file-item--downloadError{background-color:var(--devui-base-bg, #ffffff)}.mc-file-item__icon-container{margin-right:10px;flex-shrink:0;position:relative;display:flex;align-items:center;justify-content:center;width:36px;height:36px}.mc-file-item__icon{position:relative;display:flex;align-items:center;justify-content:center}.mc-file-item__type-icon{display:inline-block}.mc-file-item__info{flex:1;min-width:0}.mc-file-item__name{font-size:var(--devui-font-size-sm, 12px);color:var(--devui-text, #252b3a);margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mc-file-item__meta{display:flex;align-items:center;font-size:var(--devui-font-size-sm, 12px);color:var(--devui-aide-text, #71757f);gap:8px}.mc-file-item__meta-action{color:var(--devui-link, #526ecc);cursor:pointer}.mc-file-item__size{color:var(--devui-aide-text, #71757f)}.mc-file-item__status--error{color:var(--devui-danger, #f66f6a)}.mc-file-item__progress-overlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;border-radius:7px;overflow:hidden}.mc-file-item__progress-mask{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#0006}.mc-file-item__wrong-icon{position:relative;z-index:999}.mc-file-item__progress-ring{position:relative;width:17.5px;height:17.5px}.mc-file-item__progress-ring-track,.mc-file-item__progress-ring-circle{fill:transparent;stroke-width:5}.mc-file-item__progress-ring-track{stroke:var(--devui-disabled-bg, #f5f5f5);stroke-opacity:.3}.mc-file-item__progress-ring-circle{stroke:var(--devui-base-bg, #ffffff);stroke-linecap:round;transition:stroke-dashoffset .3s}.mc-file-item__actions{position:absolute;top:-6px;right:-6px;opacity:0;display:flex;align-items:center;justify-content:center;transition:opacity .3s ease}.mc-file-item__action-btn{border:none;background:#c2c2c2;cursor:pointer;border-radius:50%;font-size:8px;width:12px;height:12px;line-height:11px;padding:0;transition:all .3s ease}.mc-file-item__action-btn--remove{color:var(--devui-light-text, #ffffff)}.mc-file-preview__overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000b3;display:flex;align-items:center;justify-content:center;z-index:2000}.mc-file-preview__content{max-width:90vw;max-height:90vh;object-fit:contain}.mc-file-preview__iframe{width:80vw;height:90vh;border:none}.mc-file-preview__unsupported{padding:40px 60px;background-color:var(--devui-base-bg, #ffffff);border-radius:var(--devui-border-radius, 2px);color:var(--devui-text, #252b3a);font-size:var(--devui-font-size, 12px)}.mc-file-preview__close-btn{position:absolute;top:40px;right:40px;width:40px;height:40px;border-radius:50%;background:#1e1e1e80;color:#fff;border:none;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1;transition:background-color .2s}.mc-file-preview__close-btn:hover{background:#0009}.mc-file-preview-fade-enter-active,.mc-file-preview-fade-leave-active{transition:opacity .3s ease}.mc-file-preview-fade-enter-from,.mc-file-preview-fade-leave-to{opacity:0}\n"] }]
|
|
1526
|
+
}], ctorParameters: () => [{ type: LocaleService }, { type: i2.DomSanitizer }], propDecorators: { fileItems: [{
|
|
1527
|
+
type: Input
|
|
1528
|
+
}], context: [{
|
|
1529
|
+
type: Input
|
|
1530
|
+
}], remove: [{
|
|
1531
|
+
type: Output
|
|
1532
|
+
}], retryUpload: [{
|
|
1533
|
+
type: Output
|
|
1534
|
+
}], download: [{
|
|
1535
|
+
type: Output
|
|
1536
|
+
}], preview: [{
|
|
1537
|
+
type: Output
|
|
1538
|
+
}], retryDownload: [{
|
|
1539
|
+
type: Output
|
|
1540
|
+
}], handleKeyDown: [{
|
|
1541
|
+
type: HostListener,
|
|
1542
|
+
args: ['document:keydown', ['$event']]
|
|
1543
|
+
}] } });
|
|
1544
|
+
|
|
1545
|
+
class McFileListModule {
|
|
1546
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: McFileListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1547
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.10", ngImport: i0, type: McFileListModule, imports: [CommonModule, McFileListComponent], exports: [McFileListComponent] }); }
|
|
1548
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: McFileListModule, imports: [CommonModule, McFileListComponent] }); }
|
|
1549
|
+
}
|
|
1550
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: McFileListModule, decorators: [{
|
|
1551
|
+
type: NgModule,
|
|
1552
|
+
args: [{
|
|
1553
|
+
imports: [CommonModule, McFileListComponent],
|
|
1554
|
+
exports: [McFileListComponent],
|
|
1555
|
+
}]
|
|
1556
|
+
}] });
|
|
1557
|
+
|
|
1033
1558
|
class HeaderComponent {
|
|
1034
1559
|
constructor() {
|
|
1035
1560
|
this.logoImg = '';
|
|
@@ -1103,44 +1628,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImpo
|
|
|
1103
1628
|
args: [{ selector: 'mc-send-icon', standalone: true, template: "<svg\r\n width=\"16px\"\r\n height=\"16px\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n>\r\n <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <path\r\n d=\"M13.5105149,2.56164948 C14.1211149,2.35546948 14.7829149,2.68328948 14.9892149,3.29376948 C15.0349149,3.42925948 15.0552149,3.57159948 15.0495149,3.71368948 L15.0495149,3.71368948 L15.0351149,3.85546948 L13.6575149,12.2717195 C13.5237149,13.0892195 12.7524149,13.6435195 11.9348149,13.5097195 C11.8542149,13.4965195 11.7751149,13.4768195 11.6980149,13.4508195 L11.6980149,13.4508195 L11.5840149,13.4071195 L9.3049349,12.4260195 L8.4482449,13.5422195 C8.1958049,13.8708195 7.8205549,14.0786195 7.4128449,14.1207195 L7.4128449,14.1207195 L7.2585449,14.1286195 C6.4787649,14.1286195 5.8381349,13.5337195 5.7653849,12.7731195 L5.7653849,12.7731195 L5.7585449,12.6286195 L5.7602549,10.5258195 L5.7756349,10.4384195 L5.7944349,10.3824195 L5.8266649,10.3168995 L5.8735349,10.2503695 L5.9177249,10.2039195 L12.6909149,3.89392948 L2.3403349,7.38903948 C2.2329149,7.42529948 2.1418449,7.49676948 2.0808149,7.59063948 L2.0808149,7.59063948 L2.0412649,7.66497948 C1.9440949,7.89044948 2.0258749,8.14788948 2.2236349,8.27917948 L2.2236349,8.27917948 L2.3029749,8.32214948 L4.4799849,9.26177948 C4.7333949,9.37121948 4.8503449,9.66546948 4.7409649,9.91894948 C4.6435549,10.1443495 4.4003949,10.2616595 4.1694349,10.2081295 L4.1694349,10.2081295 L4.0837449,10.1798795 L1.9072249,9.24047948 C1.1462449,8.91284948 0.795166898,8.03039948 1.1225549,7.26953948 C1.2700249,6.92755948 1.5380849,6.65435948 1.8730449,6.50018948 L1.8730449,6.50018948 L2.0205049,6.44158948 Z M6.7578149,11.3299195 L6.7585449,12.6286195 L6.7666013,12.7185103 C6.80894095,12.9517898 7.0131049,13.1286195 7.2585449,13.1286195 C7.3828149,13.1286195 7.5014649,13.0824195 7.5925349,13.0008195 L7.5925349,13.0008195 L7.6550349,12.9332195 L8.3569349,12.0179195 L6.7578149,11.3299195 Z M13.9888149,4.05090948 L7.1599149,10.4129195 L11.9795149,12.4886195 C11.9980149,12.4966195 12.0173149,12.5035195 12.0369149,12.5093195 L12.0369149,12.5093195 L12.0964149,12.5228195 C12.3386149,12.5624195 12.5686149,12.4209195 12.6482149,12.1975195 L12.6482149,12.1975195 L12.6706149,12.1101195 L13.9888149,4.05090948 Z\"\r\n ></path>\r\n </g>\r\n</svg>\r\n", styles: [":host{display:contents}:host svg{margin-right:4px}\n"] }]
|
|
1104
1629
|
}] });
|
|
1105
1630
|
|
|
1106
|
-
class LocaleModule {
|
|
1107
|
-
/**
|
|
1108
|
-
* 静态方法,用于配置模块并提供服务
|
|
1109
|
-
* 可以在AppModule中使用LocaleModule.forRoot()来初始化
|
|
1110
|
-
*/
|
|
1111
|
-
static forRoot() {
|
|
1112
|
-
return {
|
|
1113
|
-
ngModule: LocaleModule,
|
|
1114
|
-
providers: [
|
|
1115
|
-
LocaleService
|
|
1116
|
-
]
|
|
1117
|
-
};
|
|
1118
|
-
}
|
|
1119
|
-
/**
|
|
1120
|
-
* 普通导入方法,用于特性模块中导入
|
|
1121
|
-
* 避免服务被多次实例化
|
|
1122
|
-
*/
|
|
1123
|
-
static forChild() {
|
|
1124
|
-
return {
|
|
1125
|
-
ngModule: LocaleModule,
|
|
1126
|
-
providers: [] // 子模块不提供服务实例
|
|
1127
|
-
};
|
|
1128
|
-
}
|
|
1129
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LocaleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1130
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.10", ngImport: i0, type: LocaleModule }); }
|
|
1131
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LocaleModule }); }
|
|
1132
|
-
}
|
|
1133
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LocaleModule, decorators: [{
|
|
1134
|
-
type: NgModule,
|
|
1135
|
-
args: [{
|
|
1136
|
-
declarations: [],
|
|
1137
|
-
imports: [],
|
|
1138
|
-
exports: []
|
|
1139
|
-
}]
|
|
1140
|
-
}] });
|
|
1141
|
-
|
|
1142
|
-
// 导出Locale服务
|
|
1143
|
-
|
|
1144
1631
|
class InputButtonFoundation extends BaseFoundation {
|
|
1145
1632
|
constructor(adapter) {
|
|
1146
1633
|
super({ ...adapter });
|
|
@@ -2170,306 +2657,580 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImpo
|
|
|
2170
2657
|
}]
|
|
2171
2658
|
}] });
|
|
2172
2659
|
|
|
2173
|
-
|
|
2174
|
-
(
|
|
2175
|
-
|
|
2176
|
-
|
|
2177
|
-
|
|
2178
|
-
|
|
2179
|
-
|
|
2180
|
-
|
|
2181
|
-
ListVariant["Filled"] = "filled";
|
|
2182
|
-
ListVariant["Bordered"] = "bordered";
|
|
2183
|
-
ListVariant["None"] = "none";
|
|
2184
|
-
})(ListVariant || (ListVariant = {}));
|
|
2660
|
+
class LayoutAsideComponent {
|
|
2661
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutAsideComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2662
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: LayoutAsideComponent, isStandalone: true, selector: "mc-layout-aside", ngImport: i0, template: "<div class=\"mc-layout-aside\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n", styles: [""] }); }
|
|
2663
|
+
}
|
|
2664
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutAsideComponent, decorators: [{
|
|
2665
|
+
type: Component,
|
|
2666
|
+
args: [{ selector: 'mc-layout-aside', standalone: true, template: "<div class=\"mc-layout-aside\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n" }]
|
|
2667
|
+
}] });
|
|
2185
2668
|
|
|
2186
|
-
|
|
2187
|
-
|
|
2188
|
-
|
|
2189
|
-
|
|
2190
|
-
|
|
2669
|
+
class LayoutAsideModule {
|
|
2670
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutAsideModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
2671
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.10", ngImport: i0, type: LayoutAsideModule, imports: [CommonModule,
|
|
2672
|
+
LayoutAsideComponent], exports: [LayoutAsideComponent] }); }
|
|
2673
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutAsideModule, imports: [CommonModule] }); }
|
|
2674
|
+
}
|
|
2675
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutAsideModule, decorators: [{
|
|
2676
|
+
type: NgModule,
|
|
2677
|
+
args: [{
|
|
2678
|
+
declarations: [],
|
|
2679
|
+
imports: [
|
|
2680
|
+
CommonModule,
|
|
2681
|
+
LayoutAsideComponent,
|
|
2682
|
+
],
|
|
2683
|
+
exports: [
|
|
2684
|
+
LayoutAsideComponent,
|
|
2685
|
+
]
|
|
2686
|
+
}]
|
|
2687
|
+
}] });
|
|
2191
2688
|
|
|
2192
|
-
class
|
|
2689
|
+
class LayoutContentFoundation extends BaseFoundation {
|
|
2193
2690
|
constructor(adapter) {
|
|
2194
2691
|
super({ ...adapter });
|
|
2195
2692
|
}
|
|
2196
|
-
getListClasses() {
|
|
2197
|
-
const { direction, autoWrap } = this.getProps();
|
|
2198
|
-
return {
|
|
2199
|
-
'mc-list': true,
|
|
2200
|
-
'mc-list-horizontal': direction === ListDirection.Horizontal,
|
|
2201
|
-
'mc-list-nowrap': direction === ListDirection.Horizontal && !autoWrap,
|
|
2202
|
-
};
|
|
2203
|
-
}
|
|
2204
2693
|
}
|
|
2205
2694
|
|
|
2206
|
-
class
|
|
2695
|
+
class ArrowDownIconComponent {
|
|
2696
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ArrowDownIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2697
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: ArrowDownIconComponent, isStandalone: true, selector: "mc-arrow-down-icon", ngImport: i0, template: "<svg t=\"1773994085709\" class=\"icon\" viewBox=\"0 0 1024 1024\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" p-id=\"4044\" width=\"16\" height=\"16\">\r\n <path d=\"M898.133333 512c-12.8-12.8-32-12.8-44.8-2.133333L544 800V149.333333c0-17.066667-14.933333-32-32-32s-32 14.933333-32 32v650.666667L170.666667 509.866667c-12.8-12.8-34.133333-10.666667-44.8 2.133333-12.8 12.8-10.666667 34.133333 2.133333 44.8l362.666667 341.333333c2.133333 2.133333 6.4 4.266667 8.533333 6.4 4.266667 2.133333 6.4 2.133333 10.666667 2.133334s8.533333 0 10.666666-2.133334c4.266667-2.133333 6.4-4.266667 8.533334-6.4l362.666666-341.333333c17.066667-12.8 19.2-32 6.4-44.8z\" fill=\"#666666\" p-id=\"4045\"></path>\r\n</svg>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }] }); }
|
|
2698
|
+
}
|
|
2699
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ArrowDownIconComponent, decorators: [{
|
|
2700
|
+
type: Component,
|
|
2701
|
+
args: [{ selector: 'mc-arrow-down-icon', standalone: true, imports: [CommonModule], template: "<svg t=\"1773994085709\" class=\"icon\" viewBox=\"0 0 1024 1024\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" p-id=\"4044\" width=\"16\" height=\"16\">\r\n <path d=\"M898.133333 512c-12.8-12.8-32-12.8-44.8-2.133333L544 800V149.333333c0-17.066667-14.933333-32-32-32s-32 14.933333-32 32v650.666667L170.666667 509.866667c-12.8-12.8-34.133333-10.666667-44.8 2.133333-12.8 12.8-10.666667 34.133333 2.133333 44.8l362.666667 341.333333c2.133333 2.133333 6.4 4.266667 8.533333 6.4 4.266667 2.133333 6.4 2.133333 10.666667 2.133334s8.533333 0 10.666666-2.133334c4.266667-2.133333 6.4-4.266667 8.533334-6.4l362.666666-341.333333c17.066667-12.8 19.2-32 6.4-44.8z\" fill=\"#666666\" p-id=\"4045\"></path>\r\n</svg>\r\n" }]
|
|
2702
|
+
}] });
|
|
2703
|
+
|
|
2704
|
+
class ArrowUpIconComponent {
|
|
2705
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ArrowUpIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2706
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: ArrowUpIconComponent, isStandalone: true, selector: "mc-arrow-up-icon", ngImport: i0, template: "<svg t=\"1773991901622\" class=\"icon\" viewBox=\"0 0 1024 1024\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" p-id=\"3858\" width=\"16\" height=\"16\">\r\n <path d=\"M896 467.2l-362.666667-341.333333c-2.133333-2.133333-6.4-4.266667-8.533333-6.4-4.266667-2.133333-6.4-2.133333-10.666667-2.133334s-8.533333 0-10.666666 2.133334c-4.266667 2.133333-6.4 4.266667-8.533334 6.4l-362.666666 341.333333c-12.8 12.8-12.8 32-2.133334 44.8 12.8 12.8 32 12.8 44.8 2.133333l309.333334-290.133333V874.666667c0 17.066667 14.933333 32 32 32s32-14.933333 32-32V224L853.333333 514.133333c6.4 6.4 14.933333 8.533333 21.333334 8.533334 8.533333 0 17.066667-4.266667 23.466666-10.666667 12.8-12.8 10.666667-32-2.133333-44.8z\" fill=\"#666666\" p-id=\"3859\"></path>\r\n</svg>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }] }); }
|
|
2707
|
+
}
|
|
2708
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ArrowUpIconComponent, decorators: [{
|
|
2709
|
+
type: Component,
|
|
2710
|
+
args: [{ selector: 'mc-arrow-up-icon', standalone: true, imports: [CommonModule], template: "<svg t=\"1773991901622\" class=\"icon\" viewBox=\"0 0 1024 1024\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" p-id=\"3858\" width=\"16\" height=\"16\">\r\n <path d=\"M896 467.2l-362.666667-341.333333c-2.133333-2.133333-6.4-4.266667-8.533333-6.4-4.266667-2.133333-6.4-2.133333-10.666667-2.133334s-8.533333 0-10.666666 2.133334c-4.266667 2.133333-6.4 4.266667-8.533334 6.4l-362.666666 341.333333c-12.8 12.8-12.8 32-2.133334 44.8 12.8 12.8 32 12.8 44.8 2.133333l309.333334-290.133333V874.666667c0 17.066667 14.933333 32 32 32s32-14.933333 32-32V224L853.333333 514.133333c6.4 6.4 14.933333 8.533333 21.333334 8.533334 8.533333 0 17.066667-4.266667 23.466666-10.666667 12.8-12.8 10.666667-32-2.133333-44.8z\" fill=\"#666666\" p-id=\"3859\"></path>\r\n</svg>\r\n" }]
|
|
2711
|
+
}] });
|
|
2712
|
+
|
|
2713
|
+
class LayoutContentComponent extends BaseComponent {
|
|
2207
2714
|
constructor() {
|
|
2208
|
-
super();
|
|
2715
|
+
super(...arguments);
|
|
2209
2716
|
// 组件属性
|
|
2210
|
-
this.
|
|
2211
|
-
this.
|
|
2212
|
-
this.
|
|
2213
|
-
this.
|
|
2214
|
-
this.
|
|
2215
|
-
this.
|
|
2216
|
-
this.
|
|
2217
|
-
this.
|
|
2218
|
-
|
|
2219
|
-
|
|
2220
|
-
|
|
2221
|
-
|
|
2222
|
-
|
|
2717
|
+
this.autoScroll = true;
|
|
2718
|
+
this.showScrollArrow = true;
|
|
2719
|
+
this.onScrollerScroll = new EventEmitter();
|
|
2720
|
+
this.onScrollerWheel = new EventEmitter();
|
|
2721
|
+
this.showUpArrow = false;
|
|
2722
|
+
this.showDownArrow = false;
|
|
2723
|
+
this.userControl = false;
|
|
2724
|
+
this.contentResizeOb = new ResizeObserver(() => {
|
|
2725
|
+
this.updateScroll();
|
|
2726
|
+
});
|
|
2727
|
+
this.wheelHandler = (event) => {
|
|
2728
|
+
if (!this.scrollerRef.nativeElement) {
|
|
2729
|
+
return;
|
|
2730
|
+
}
|
|
2731
|
+
const isBottom = Math.abs(this.scrollerRef.nativeElement.scrollTop +
|
|
2732
|
+
this.scrollerRef.nativeElement.clientHeight -
|
|
2733
|
+
this.scrollerRef.nativeElement.scrollHeight) < 32;
|
|
2734
|
+
if (event.deltaY !== 0) {
|
|
2735
|
+
this.userControl = !isBottom;
|
|
2736
|
+
}
|
|
2737
|
+
this.onScrollerWheel.emit(event);
|
|
2738
|
+
};
|
|
2739
|
+
this.scrollHandler = debounce((event) => {
|
|
2740
|
+
const target = event.target;
|
|
2741
|
+
if (!target) {
|
|
2742
|
+
return;
|
|
2743
|
+
}
|
|
2744
|
+
this.showUpArrow = target.scrollTop !== 0;
|
|
2745
|
+
this.showDownArrow =
|
|
2746
|
+
target.scrollTop + target.clientHeight + 32 < target.scrollHeight;
|
|
2747
|
+
this.onScrollerScroll.emit(event);
|
|
2748
|
+
}, 100);
|
|
2749
|
+
this.scrollToPosition = (position) => {
|
|
2750
|
+
if (this.scrollerRef.nativeElement) {
|
|
2751
|
+
this.scrollerRef.nativeElement.scrollTo({
|
|
2752
|
+
top: position,
|
|
2753
|
+
behavior: 'smooth',
|
|
2754
|
+
});
|
|
2755
|
+
}
|
|
2756
|
+
};
|
|
2757
|
+
this.scrollToBottom = () => {
|
|
2758
|
+
this.scrollToPosition(this.scrollerRef.nativeElement?.scrollHeight ?? 0);
|
|
2759
|
+
};
|
|
2760
|
+
this.scrollToTop = () => {
|
|
2761
|
+
this.scrollToPosition(0);
|
|
2762
|
+
};
|
|
2763
|
+
this.updateScroll = (force = false) => {
|
|
2764
|
+
if (!this.autoScroll) {
|
|
2765
|
+
return;
|
|
2766
|
+
}
|
|
2767
|
+
if (this.userControl && !force) {
|
|
2768
|
+
return;
|
|
2769
|
+
}
|
|
2770
|
+
this.scrollToBottom();
|
|
2771
|
+
};
|
|
2223
2772
|
}
|
|
2224
2773
|
ngOnInit() {
|
|
2225
|
-
this.foundation = new
|
|
2774
|
+
this.foundation = new LayoutContentFoundation(this.adapter);
|
|
2226
2775
|
this.foundation.init();
|
|
2227
|
-
|
|
2776
|
+
}
|
|
2777
|
+
ngAfterViewInit() {
|
|
2778
|
+
this.contentResizeOb.observe(this.contentRef.nativeElement);
|
|
2779
|
+
this.scrollHandler({ target: this.scrollerRef.nativeElement });
|
|
2228
2780
|
this.initListener();
|
|
2229
2781
|
}
|
|
2230
2782
|
ngOnDestroy() {
|
|
2231
|
-
|
|
2783
|
+
this.contentResizeOb.disconnect();
|
|
2232
2784
|
this.removeListener();
|
|
2785
|
+
super.ngOnDestroy();
|
|
2233
2786
|
}
|
|
2234
2787
|
get adapter() {
|
|
2235
2788
|
return {
|
|
2236
2789
|
...super.adapter,
|
|
2237
2790
|
getProps: () => ({
|
|
2238
|
-
|
|
2239
|
-
|
|
2240
|
-
variant: this.variant,
|
|
2241
|
-
enableLazyLoad: this.enableLazyLoad,
|
|
2242
|
-
enableShortKey: this.enableShortKey,
|
|
2243
|
-
data: this.data,
|
|
2244
|
-
inputEl: this.inputEl,
|
|
2245
|
-
selectable: this.selectable,
|
|
2791
|
+
autoScroll: this.autoScroll,
|
|
2792
|
+
showScrollArrow: this.showScrollArrow,
|
|
2246
2793
|
}),
|
|
2247
2794
|
};
|
|
2248
2795
|
}
|
|
2249
|
-
// 计算属性
|
|
2250
|
-
get listClasses() {
|
|
2251
|
-
return this.foundation.getListClasses();
|
|
2252
|
-
}
|
|
2253
|
-
initListenDom() {
|
|
2254
|
-
if (this.inputEl) {
|
|
2255
|
-
const el = this.inputEl;
|
|
2256
|
-
if (InputTagNames.includes(el.tagName)) {
|
|
2257
|
-
this.listenDom = el;
|
|
2258
|
-
}
|
|
2259
|
-
else {
|
|
2260
|
-
this.listenDom =
|
|
2261
|
-
el.querySelector('textarea') || el.querySelector('input') || document;
|
|
2262
|
-
}
|
|
2263
|
-
}
|
|
2264
|
-
else {
|
|
2265
|
-
this.listenDom = document;
|
|
2266
|
-
}
|
|
2267
|
-
}
|
|
2268
2796
|
initListener() {
|
|
2269
|
-
|
|
2270
|
-
|
|
2271
|
-
}
|
|
2797
|
+
this.scrollerRef.nativeElement?.addEventListener('scroll', this.scrollHandler);
|
|
2798
|
+
this.scrollerRef.nativeElement?.addEventListener('wheel', this.wheelHandler);
|
|
2272
2799
|
}
|
|
2273
2800
|
removeListener() {
|
|
2274
|
-
this.
|
|
2275
|
-
|
|
2276
|
-
onListScroll(e) {
|
|
2277
|
-
if (!this.enableLazyLoad || this.direction !== ListDirection.Vertical) {
|
|
2278
|
-
return;
|
|
2279
|
-
}
|
|
2280
|
-
const targetEl = e.target;
|
|
2281
|
-
const scrollHeight = targetEl.scrollHeight;
|
|
2282
|
-
const clientHeight = targetEl.clientHeight;
|
|
2283
|
-
const scrollTop = targetEl.scrollTop;
|
|
2284
|
-
if (scrollHeight - clientHeight - scrollTop < LazyLoadThreshold) {
|
|
2285
|
-
this.loadMore.emit(e);
|
|
2286
|
-
}
|
|
2287
|
-
}
|
|
2288
|
-
onItemClick(clickedItem) {
|
|
2289
|
-
if (clickedItem.disabled) {
|
|
2290
|
-
return;
|
|
2291
|
-
}
|
|
2292
|
-
if (this.selectable) {
|
|
2293
|
-
for (let i = 0; i < this.data.length; i++) {
|
|
2294
|
-
this.data[i].active = this.data[i].value === clickedItem.value;
|
|
2295
|
-
}
|
|
2296
|
-
}
|
|
2297
|
-
this.select.emit({ ...clickedItem });
|
|
2298
|
-
}
|
|
2299
|
-
onKeyDown(e) {
|
|
2300
|
-
if (e.code === ArrowUp$1) {
|
|
2301
|
-
this.preSelectIndex =
|
|
2302
|
-
this.preSelectIndex === 0
|
|
2303
|
-
? this.data.length - 1
|
|
2304
|
-
: this.preSelectIndex - 1;
|
|
2305
|
-
}
|
|
2306
|
-
if (e.code === ArrowDown$1) {
|
|
2307
|
-
this.preSelectIndex =
|
|
2308
|
-
this.preSelectIndex === this.data.length - 1
|
|
2309
|
-
? 0
|
|
2310
|
-
: this.preSelectIndex + 1;
|
|
2311
|
-
}
|
|
2312
|
-
if (e.code === Enter) {
|
|
2313
|
-
if (this.selectable) {
|
|
2314
|
-
this.onItemClick(this.data[this.preSelectIndex]);
|
|
2315
|
-
}
|
|
2316
|
-
}
|
|
2801
|
+
this.scrollerRef.nativeElement?.removeEventListener('scroll', this.scrollHandler);
|
|
2802
|
+
this.scrollerRef.nativeElement?.removeEventListener('wheel', this.wheelHandler);
|
|
2317
2803
|
}
|
|
2318
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type:
|
|
2319
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type:
|
|
2804
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutContentComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
2805
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: LayoutContentComponent, isStandalone: true, selector: "mc-layout-content", inputs: { autoScroll: "autoScroll", showScrollArrow: "showScrollArrow" }, outputs: { onScrollerScroll: "onScrollerScroll", onScrollerWheel: "onScrollerWheel" }, viewQueries: [{ propertyName: "scrollerRef", first: true, predicate: ["scrollerRef"], descendants: true }, { propertyName: "contentRef", first: true, predicate: ["contentRef"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"mc-layout-content-container\">\r\n <div class=\"mc-layout-content-scroller\" #scrollerRef>\r\n <div class=\"mc-layout-content\" #contentRef>\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"showScrollArrow\">\r\n <div *ngIf=\"showUpArrow\" class=\"mc-layout-content-arrow up\" (click)=\"scrollToTop()\">\r\n <div>\r\n <mc-arrow-up-icon />\r\n </div>\r\n </div>\r\n <div *ngIf=\"showDownArrow\" class=\"mc-layout-content-arrow down\" (click)=\"scrollToBottom()\">\r\n <div>\r\n <mc-arrow-down-icon />\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n", styles: [".mc-layout-content-container{position:relative;flex:auto;display:flex;flex-direction:column;min-height:0;margin-right:-20px}.mc-layout-content-container .mc-layout-content-scroller{flex:1;overflow:auto;padding-right:8px;scrollbar-width:thin;scrollbar-gutter:stable}.mc-layout-content-container .mc-layout-content-arrow{position:absolute;left:50%;transform:translate(-50%);z-index:9;display:flex;justify-content:center;align-items:center;width:32px;height:32px;cursor:pointer}.mc-layout-content-container .mc-layout-content-arrow.up{top:20px}.mc-layout-content-container .mc-layout-content-arrow.down{bottom:20px}.mc-layout-content-container .mc-layout-content-arrow:hover>div{transform:scale(1.3);box-shadow:var(--devui-shadow-length-connected-overlay, 0 2px 12px 0) var(--devui-shadow, rgba(37, 43, 58, .24))}.mc-layout-content-container .mc-layout-content-arrow div{display:flex;justify-content:center;align-items:center;width:24px;height:24px;background-color:var(--devui-base-bg, #ffffff);border-radius:var(--devui-border-radius-full, 100px);box-shadow:var(--devui-box-shadow-length-base, 0 1px 6px 0) var(--devui-shadow, rgba(0, 0, 0, .16));transition:transform .3s var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)),box-shadow .3s var(--devui-animation-duration-base, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ArrowUpIconComponent, selector: "mc-arrow-up-icon" }, { kind: "component", type: ArrowDownIconComponent, selector: "mc-arrow-down-icon" }] }); }
|
|
2320
2806
|
}
|
|
2321
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type:
|
|
2807
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutContentComponent, decorators: [{
|
|
2322
2808
|
type: Component,
|
|
2323
|
-
args: [{ selector: 'mc-
|
|
2324
|
-
}],
|
|
2325
|
-
type: Input
|
|
2326
|
-
}], autoWrap: [{
|
|
2327
|
-
type: Input
|
|
2328
|
-
}], variant: [{
|
|
2329
|
-
type: Input
|
|
2330
|
-
}], enableLazyLoad: [{
|
|
2331
|
-
type: Input
|
|
2332
|
-
}], enableShortKey: [{
|
|
2333
|
-
type: Input
|
|
2334
|
-
}], data: [{
|
|
2335
|
-
type: Input
|
|
2336
|
-
}], inputEl: [{
|
|
2337
|
-
type: Input
|
|
2338
|
-
}], selectable: [{
|
|
2809
|
+
args: [{ selector: 'mc-layout-content', standalone: true, imports: [CommonModule, ArrowUpIconComponent, ArrowDownIconComponent], template: "<div class=\"mc-layout-content-container\">\r\n <div class=\"mc-layout-content-scroller\" #scrollerRef>\r\n <div class=\"mc-layout-content\" #contentRef>\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"showScrollArrow\">\r\n <div *ngIf=\"showUpArrow\" class=\"mc-layout-content-arrow up\" (click)=\"scrollToTop()\">\r\n <div>\r\n <mc-arrow-up-icon />\r\n </div>\r\n </div>\r\n <div *ngIf=\"showDownArrow\" class=\"mc-layout-content-arrow down\" (click)=\"scrollToBottom()\">\r\n <div>\r\n <mc-arrow-down-icon />\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n", styles: [".mc-layout-content-container{position:relative;flex:auto;display:flex;flex-direction:column;min-height:0;margin-right:-20px}.mc-layout-content-container .mc-layout-content-scroller{flex:1;overflow:auto;padding-right:8px;scrollbar-width:thin;scrollbar-gutter:stable}.mc-layout-content-container .mc-layout-content-arrow{position:absolute;left:50%;transform:translate(-50%);z-index:9;display:flex;justify-content:center;align-items:center;width:32px;height:32px;cursor:pointer}.mc-layout-content-container .mc-layout-content-arrow.up{top:20px}.mc-layout-content-container .mc-layout-content-arrow.down{bottom:20px}.mc-layout-content-container .mc-layout-content-arrow:hover>div{transform:scale(1.3);box-shadow:var(--devui-shadow-length-connected-overlay, 0 2px 12px 0) var(--devui-shadow, rgba(37, 43, 58, .24))}.mc-layout-content-container .mc-layout-content-arrow div{display:flex;justify-content:center;align-items:center;width:24px;height:24px;background-color:var(--devui-base-bg, #ffffff);border-radius:var(--devui-border-radius-full, 100px);box-shadow:var(--devui-box-shadow-length-base, 0 1px 6px 0) var(--devui-shadow, rgba(0, 0, 0, .16));transition:transform .3s var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)),box-shadow .3s var(--devui-animation-duration-base, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}\n"] }]
|
|
2810
|
+
}], propDecorators: { autoScroll: [{
|
|
2339
2811
|
type: Input
|
|
2340
|
-
}],
|
|
2812
|
+
}], showScrollArrow: [{
|
|
2341
2813
|
type: Input
|
|
2342
|
-
}],
|
|
2814
|
+
}], onScrollerScroll: [{
|
|
2343
2815
|
type: Output
|
|
2344
|
-
}],
|
|
2816
|
+
}], onScrollerWheel: [{
|
|
2345
2817
|
type: Output
|
|
2346
|
-
}],
|
|
2347
|
-
type:
|
|
2348
|
-
args: ['
|
|
2818
|
+
}], scrollerRef: [{
|
|
2819
|
+
type: ViewChild,
|
|
2820
|
+
args: ['scrollerRef']
|
|
2821
|
+
}], contentRef: [{
|
|
2822
|
+
type: ViewChild,
|
|
2823
|
+
args: ['contentRef']
|
|
2349
2824
|
}] } });
|
|
2350
2825
|
|
|
2351
|
-
class
|
|
2352
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type:
|
|
2353
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.10", ngImport: i0, type:
|
|
2354
|
-
|
|
2826
|
+
class LayoutContentModule {
|
|
2827
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutContentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
2828
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.10", ngImport: i0, type: LayoutContentModule, imports: [CommonModule,
|
|
2829
|
+
LayoutContentComponent], exports: [LayoutContentComponent] }); }
|
|
2830
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutContentModule, imports: [CommonModule,
|
|
2831
|
+
LayoutContentComponent] }); }
|
|
2355
2832
|
}
|
|
2356
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type:
|
|
2833
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutContentModule, decorators: [{
|
|
2357
2834
|
type: NgModule,
|
|
2358
2835
|
args: [{
|
|
2359
2836
|
declarations: [],
|
|
2360
|
-
imports: [
|
|
2361
|
-
|
|
2837
|
+
imports: [
|
|
2838
|
+
CommonModule,
|
|
2839
|
+
LayoutContentComponent,
|
|
2840
|
+
],
|
|
2841
|
+
exports: [
|
|
2842
|
+
LayoutContentComponent,
|
|
2843
|
+
]
|
|
2362
2844
|
}]
|
|
2363
2845
|
}] });
|
|
2364
2846
|
|
|
2365
|
-
class
|
|
2366
|
-
|
|
2367
|
-
|
|
2368
|
-
|
|
2369
|
-
|
|
2370
|
-
|
|
2371
|
-
|
|
2372
|
-
|
|
2373
|
-
|
|
2374
|
-
|
|
2375
|
-
|
|
2376
|
-
|
|
2377
|
-
|
|
2378
|
-
|
|
2379
|
-
|
|
2380
|
-
|
|
2381
|
-
|
|
2382
|
-
|
|
2383
|
-
|
|
2847
|
+
class LayoutHeaderComponent {
|
|
2848
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2849
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: LayoutHeaderComponent, isStandalone: true, selector: "mc-layout-header", ngImport: i0, template: "<div class=\"mc-layout-header\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n", styles: [".mc-layout-header{flex:0 0 auto;min-height:40px}\n"] }); }
|
|
2850
|
+
}
|
|
2851
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutHeaderComponent, decorators: [{
|
|
2852
|
+
type: Component,
|
|
2853
|
+
args: [{ selector: 'mc-layout-header', standalone: true, template: "<div class=\"mc-layout-header\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n", styles: [".mc-layout-header{flex:0 0 auto;min-height:40px}\n"] }]
|
|
2854
|
+
}] });
|
|
2855
|
+
|
|
2856
|
+
class LayoutHeaderModule {
|
|
2857
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutHeaderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
2858
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.10", ngImport: i0, type: LayoutHeaderModule, imports: [CommonModule,
|
|
2859
|
+
LayoutHeaderComponent], exports: [LayoutHeaderComponent] }); }
|
|
2860
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutHeaderModule, imports: [CommonModule] }); }
|
|
2861
|
+
}
|
|
2862
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutHeaderModule, decorators: [{
|
|
2863
|
+
type: NgModule,
|
|
2864
|
+
args: [{
|
|
2865
|
+
declarations: [],
|
|
2866
|
+
imports: [
|
|
2867
|
+
CommonModule,
|
|
2868
|
+
LayoutHeaderComponent,
|
|
2869
|
+
],
|
|
2870
|
+
exports: [
|
|
2871
|
+
LayoutHeaderComponent,
|
|
2872
|
+
]
|
|
2873
|
+
}]
|
|
2874
|
+
}] });
|
|
2875
|
+
|
|
2876
|
+
class LayoutComponent {
|
|
2877
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2878
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: LayoutComponent, isStandalone: true, selector: "mc-layout", ngImport: i0, template: "<div class=\"mc-layout\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n", styles: [".mc-layout{display:flex;flex:auto;flex-direction:column}.mc-layout-aside{flex-direction:row}\n"] }); }
|
|
2879
|
+
}
|
|
2880
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutComponent, decorators: [{
|
|
2881
|
+
type: Component,
|
|
2882
|
+
args: [{ selector: 'mc-layout', standalone: true, template: "<div class=\"mc-layout\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n", styles: [".mc-layout{display:flex;flex:auto;flex-direction:column}.mc-layout-aside{flex-direction:row}\n"] }]
|
|
2883
|
+
}] });
|
|
2884
|
+
|
|
2885
|
+
class LayoutModule {
|
|
2886
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
2887
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.10", ngImport: i0, type: LayoutModule, imports: [CommonModule,
|
|
2888
|
+
LayoutComponent], exports: [LayoutComponent] }); }
|
|
2889
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutModule, imports: [CommonModule] }); }
|
|
2890
|
+
}
|
|
2891
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutModule, decorators: [{
|
|
2892
|
+
type: NgModule,
|
|
2893
|
+
args: [{
|
|
2894
|
+
declarations: [],
|
|
2895
|
+
imports: [
|
|
2896
|
+
CommonModule,
|
|
2897
|
+
LayoutComponent,
|
|
2898
|
+
],
|
|
2899
|
+
exports: [
|
|
2900
|
+
LayoutComponent,
|
|
2901
|
+
]
|
|
2902
|
+
}]
|
|
2903
|
+
}] });
|
|
2904
|
+
|
|
2905
|
+
class LayoutSenderComponent {
|
|
2906
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutSenderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2907
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: LayoutSenderComponent, isStandalone: true, selector: "mc-layout-sender", ngImport: i0, template: "<div class=\"mc-layout-sender\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n", styles: [""] }); }
|
|
2908
|
+
}
|
|
2909
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutSenderComponent, decorators: [{
|
|
2910
|
+
type: Component,
|
|
2911
|
+
args: [{ selector: 'mc-layout-sender', standalone: true, template: "<div class=\"mc-layout-sender\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n" }]
|
|
2912
|
+
}] });
|
|
2913
|
+
|
|
2914
|
+
class LayoutSenderModule {
|
|
2915
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutSenderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
2916
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.10", ngImport: i0, type: LayoutSenderModule, imports: [CommonModule,
|
|
2917
|
+
LayoutSenderComponent], exports: [LayoutSenderComponent] }); }
|
|
2918
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutSenderModule, imports: [CommonModule] }); }
|
|
2919
|
+
}
|
|
2920
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutSenderModule, decorators: [{
|
|
2921
|
+
type: NgModule,
|
|
2922
|
+
args: [{
|
|
2923
|
+
declarations: [],
|
|
2924
|
+
imports: [
|
|
2925
|
+
CommonModule,
|
|
2926
|
+
LayoutSenderComponent,
|
|
2927
|
+
],
|
|
2928
|
+
exports: [
|
|
2929
|
+
LayoutSenderComponent,
|
|
2930
|
+
]
|
|
2931
|
+
}]
|
|
2932
|
+
}] });
|
|
2933
|
+
|
|
2934
|
+
var ListDirection;
|
|
2935
|
+
(function (ListDirection) {
|
|
2936
|
+
ListDirection["Horizontal"] = "horizontal";
|
|
2937
|
+
ListDirection["Vertical"] = "vertical";
|
|
2938
|
+
})(ListDirection || (ListDirection = {}));
|
|
2939
|
+
var ListVariant;
|
|
2940
|
+
(function (ListVariant) {
|
|
2941
|
+
ListVariant["Transparent"] = "transparent";
|
|
2942
|
+
ListVariant["Filled"] = "filled";
|
|
2943
|
+
ListVariant["Bordered"] = "bordered";
|
|
2944
|
+
ListVariant["None"] = "none";
|
|
2945
|
+
})(ListVariant || (ListVariant = {}));
|
|
2946
|
+
|
|
2947
|
+
const LazyLoadThreshold = 50;
|
|
2948
|
+
const InputTagNames = ['TEXTAREA', 'INPUT'];
|
|
2949
|
+
const ArrowUp$1 = 'ArrowUp';
|
|
2950
|
+
const ArrowDown$1 = 'ArrowDown';
|
|
2951
|
+
const Enter = 'Enter';
|
|
2952
|
+
|
|
2953
|
+
class ListFoundation extends BaseFoundation {
|
|
2954
|
+
constructor(adapter) {
|
|
2955
|
+
super({ ...adapter });
|
|
2384
2956
|
}
|
|
2385
|
-
|
|
2386
|
-
|
|
2957
|
+
getListClasses() {
|
|
2958
|
+
const { direction, autoWrap } = this.getProps();
|
|
2959
|
+
return {
|
|
2960
|
+
'mc-list': true,
|
|
2961
|
+
'mc-list-horizontal': direction === ListDirection.Horizontal,
|
|
2962
|
+
'mc-list-nowrap': direction === ListDirection.Horizontal && !autoWrap,
|
|
2963
|
+
};
|
|
2387
2964
|
}
|
|
2388
|
-
|
|
2389
|
-
|
|
2965
|
+
}
|
|
2966
|
+
|
|
2967
|
+
class ListComponent extends BaseComponent {
|
|
2968
|
+
constructor() {
|
|
2969
|
+
super();
|
|
2970
|
+
// 组件属性
|
|
2971
|
+
this.direction = ListDirection.Vertical;
|
|
2972
|
+
this.autoWrap = true;
|
|
2973
|
+
this.variant = ListVariant.Transparent;
|
|
2974
|
+
this.enableLazyLoad = false;
|
|
2975
|
+
this.enableShortKey = false;
|
|
2976
|
+
this.data = [];
|
|
2977
|
+
this.selectable = true;
|
|
2978
|
+
this.preSelectIndex = this.enableShortKey ? 0 : -1;
|
|
2979
|
+
this.loadMore = new EventEmitter();
|
|
2980
|
+
this.select = new EventEmitter();
|
|
2981
|
+
// 内容投影模板引用
|
|
2982
|
+
this.itemTemplate = null;
|
|
2983
|
+
this.ListVariant = ListVariant;
|
|
2390
2984
|
}
|
|
2391
|
-
|
|
2392
|
-
|
|
2393
|
-
|
|
2394
|
-
|
|
2395
|
-
|
|
2396
|
-
}
|
|
2397
|
-
else {
|
|
2398
|
-
this.xssWhiteList[rule['key']] = rule['value'];
|
|
2399
|
-
}
|
|
2400
|
-
});
|
|
2401
|
-
}
|
|
2985
|
+
ngOnInit() {
|
|
2986
|
+
this.foundation = new ListFoundation(this.adapter);
|
|
2987
|
+
this.foundation.init();
|
|
2988
|
+
this.initListenDom();
|
|
2989
|
+
this.initListener();
|
|
2402
2990
|
}
|
|
2403
|
-
|
|
2404
|
-
|
|
2405
|
-
|
|
2406
|
-
const { plugin, opts } = item;
|
|
2407
|
-
mdt.use(plugin, opts);
|
|
2408
|
-
});
|
|
2409
|
-
}
|
|
2991
|
+
ngOnDestroy() {
|
|
2992
|
+
super.ngOnDestroy();
|
|
2993
|
+
this.removeListener();
|
|
2410
2994
|
}
|
|
2411
|
-
|
|
2412
|
-
return
|
|
2413
|
-
|
|
2414
|
-
|
|
2415
|
-
|
|
2416
|
-
|
|
2417
|
-
|
|
2418
|
-
|
|
2419
|
-
|
|
2420
|
-
|
|
2421
|
-
|
|
2422
|
-
|
|
2995
|
+
get adapter() {
|
|
2996
|
+
return {
|
|
2997
|
+
...super.adapter,
|
|
2998
|
+
getProps: () => ({
|
|
2999
|
+
direction: this.direction,
|
|
3000
|
+
autoWrap: this.autoWrap,
|
|
3001
|
+
variant: this.variant,
|
|
3002
|
+
enableLazyLoad: this.enableLazyLoad,
|
|
3003
|
+
enableShortKey: this.enableShortKey,
|
|
3004
|
+
data: this.data,
|
|
3005
|
+
inputEl: this.inputEl,
|
|
3006
|
+
selectable: this.selectable,
|
|
3007
|
+
}),
|
|
3008
|
+
};
|
|
2423
3009
|
}
|
|
2424
|
-
|
|
2425
|
-
|
|
2426
|
-
|
|
2427
|
-
constructor(config = {}) {
|
|
2428
|
-
this.config = config;
|
|
2429
|
-
this.mermaidInstance = null;
|
|
2430
|
-
this.isLoading = false;
|
|
2431
|
-
this.lastValidResult = '';
|
|
2432
|
-
this.viewStateMap = new WeakMap();
|
|
2433
|
-
this.containerHeight = 400;
|
|
3010
|
+
// 计算属性
|
|
3011
|
+
get listClasses() {
|
|
3012
|
+
return this.foundation.getListClasses();
|
|
2434
3013
|
}
|
|
2435
|
-
|
|
2436
|
-
if (this.
|
|
2437
|
-
|
|
2438
|
-
|
|
2439
|
-
|
|
2440
|
-
|
|
2441
|
-
|
|
2442
|
-
|
|
2443
|
-
|
|
2444
|
-
|
|
2445
|
-
else {
|
|
2446
|
-
setTimeout(checkInstance, 50);
|
|
2447
|
-
}
|
|
2448
|
-
};
|
|
2449
|
-
checkInstance();
|
|
2450
|
-
});
|
|
2451
|
-
}
|
|
2452
|
-
this.isLoading = true;
|
|
2453
|
-
try {
|
|
2454
|
-
const { default: mermaid } = await import('mermaid');
|
|
2455
|
-
mermaid.initialize({
|
|
2456
|
-
theme: this.config.theme || 'default',
|
|
2457
|
-
startOnLoad: false,
|
|
2458
|
-
suppressErrorRendering: true,
|
|
2459
|
-
...this.config
|
|
2460
|
-
});
|
|
2461
|
-
this.mermaidInstance = mermaid;
|
|
2462
|
-
return mermaid;
|
|
3014
|
+
initListenDom() {
|
|
3015
|
+
if (this.inputEl) {
|
|
3016
|
+
const el = this.inputEl;
|
|
3017
|
+
if (InputTagNames.includes(el.tagName)) {
|
|
3018
|
+
this.listenDom = el;
|
|
3019
|
+
}
|
|
3020
|
+
else {
|
|
3021
|
+
this.listenDom =
|
|
3022
|
+
el.querySelector('textarea') || el.querySelector('input') || document;
|
|
3023
|
+
}
|
|
2463
3024
|
}
|
|
2464
|
-
|
|
2465
|
-
|
|
2466
|
-
throw new Error('Failed to load mermaid library');
|
|
3025
|
+
else {
|
|
3026
|
+
this.listenDom = document;
|
|
2467
3027
|
}
|
|
2468
|
-
|
|
2469
|
-
|
|
3028
|
+
}
|
|
3029
|
+
initListener() {
|
|
3030
|
+
if (this.enableShortKey) {
|
|
3031
|
+
this.listenDom.addEventListener('keydown', this.onKeyDown.bind(this));
|
|
2470
3032
|
}
|
|
2471
3033
|
}
|
|
2472
|
-
|
|
3034
|
+
removeListener() {
|
|
3035
|
+
this.listenDom.removeEventListener('keydown', this.onKeyDown.bind(this));
|
|
3036
|
+
}
|
|
3037
|
+
onListScroll(e) {
|
|
3038
|
+
if (!this.enableLazyLoad || this.direction !== ListDirection.Vertical) {
|
|
3039
|
+
return;
|
|
3040
|
+
}
|
|
3041
|
+
const targetEl = e.target;
|
|
3042
|
+
const scrollHeight = targetEl.scrollHeight;
|
|
3043
|
+
const clientHeight = targetEl.clientHeight;
|
|
3044
|
+
const scrollTop = targetEl.scrollTop;
|
|
3045
|
+
if (scrollHeight - clientHeight - scrollTop < LazyLoadThreshold) {
|
|
3046
|
+
this.loadMore.emit(e);
|
|
3047
|
+
}
|
|
3048
|
+
}
|
|
3049
|
+
onItemClick(clickedItem) {
|
|
3050
|
+
if (clickedItem.disabled) {
|
|
3051
|
+
return;
|
|
3052
|
+
}
|
|
3053
|
+
if (this.selectable) {
|
|
3054
|
+
for (let i = 0; i < this.data.length; i++) {
|
|
3055
|
+
this.data[i].active = this.data[i].value === clickedItem.value;
|
|
3056
|
+
}
|
|
3057
|
+
}
|
|
3058
|
+
this.select.emit({ ...clickedItem });
|
|
3059
|
+
}
|
|
3060
|
+
onKeyDown(e) {
|
|
3061
|
+
if (e.code === ArrowUp$1) {
|
|
3062
|
+
this.preSelectIndex =
|
|
3063
|
+
this.preSelectIndex === 0
|
|
3064
|
+
? this.data.length - 1
|
|
3065
|
+
: this.preSelectIndex - 1;
|
|
3066
|
+
}
|
|
3067
|
+
if (e.code === ArrowDown$1) {
|
|
3068
|
+
this.preSelectIndex =
|
|
3069
|
+
this.preSelectIndex === this.data.length - 1
|
|
3070
|
+
? 0
|
|
3071
|
+
: this.preSelectIndex + 1;
|
|
3072
|
+
}
|
|
3073
|
+
if (e.code === Enter) {
|
|
3074
|
+
if (this.selectable) {
|
|
3075
|
+
this.onItemClick(this.data[this.preSelectIndex]);
|
|
3076
|
+
}
|
|
3077
|
+
}
|
|
3078
|
+
}
|
|
3079
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3080
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: ListComponent, isStandalone: true, selector: "mc-list", inputs: { direction: "direction", autoWrap: "autoWrap", variant: "variant", enableLazyLoad: "enableLazyLoad", enableShortKey: "enableShortKey", data: "data", inputEl: "inputEl", selectable: "selectable", preSelectIndex: "preSelectIndex" }, outputs: { loadMore: "loadMore", select: "select" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: ["item"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div [ngClass]=\"listClasses\" (scroll)=\"onListScroll($event)\">\r\n <ng-container *ngFor=\"let item of data; let index = index\">\r\n <ng-container *ngIf=\"variant === ListVariant.None\">\r\n <ng-container\r\n *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\">\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"variant !== ListVariant.None\">\r\n <div\r\n class=\"mc-list-item\"\r\n [class]=\"variant\"\r\n [ngClass]=\"{\r\n 'mc-list-item-disabled': item.disabled,\r\n 'mc-list-item-active': item.active,\r\n 'mc-list-item-pre-selection': index === preSelectIndex\r\n }\"\r\n (click)=\"onItemClick(item)\"\r\n >\r\n <ng-container *ngIf=\"itemTemplate; else defaultLabel\">\r\n <ng-container\r\n *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\">\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-template #defaultLabel>\r\n {{ item['label'] }}\r\n </ng-template>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n</div>\r\n", styles: [".mc-list{width:100%;max-height:300px;box-sizing:border-box;overflow:auto}.mc-list.mc-list-horizontal .mc-list-item{width:unset}.mc-list:not(.mc-list-horizontal) .mc-list-item:not(:first-child){margin-top:4px}.mc-list .mc-list-item{width:100%;line-height:20px;padding:8px;color:var(--devui-text, #252b3a);font-size:var(--devui-font-size, 14px);border-radius:var(--devui-border-radius, 2px);box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;transition:color var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)),background-color var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.mc-list .mc-list-item.filled{background-color:var(--devui-gray-form-control-bg, #f5f5f5)}.mc-list .mc-list-item.bordered{border:1px solid var(--devui-dividing-line, #f2f2f3)}.mc-list .mc-list-item:hover,.mc-list .mc-list-item.mc-list-item-pre-selection{color:var(--devui-list-item-hover-text, #252b3a);background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.mc-list .mc-list-item.mc-list-item-active{color:var(--devui-list-item-active-text, #252b3a);background-color:var(--devui-list-item-active-bg, #f2f5fc)}.mc-list .mc-list-item.mc-list-item-disabled{color:var(--devui-disabled-text, #cfd0d3);background-color:var(--devui-disabled-bg, #f5f5f5);cursor:not-allowed}.mc-list-horizontal{display:flex;flex-wrap:wrap;gap:12px}.mc-list-horizontal.mc-list-nowrap{flex-wrap:nowrap}.mc-list-horizontal.mc-list-nowrap .mc-list-item{flex:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
|
|
3081
|
+
}
|
|
3082
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ListComponent, decorators: [{
|
|
3083
|
+
type: Component,
|
|
3084
|
+
args: [{ selector: 'mc-list', standalone: true, imports: [CommonModule], template: "<div [ngClass]=\"listClasses\" (scroll)=\"onListScroll($event)\">\r\n <ng-container *ngFor=\"let item of data; let index = index\">\r\n <ng-container *ngIf=\"variant === ListVariant.None\">\r\n <ng-container\r\n *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\">\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"variant !== ListVariant.None\">\r\n <div\r\n class=\"mc-list-item\"\r\n [class]=\"variant\"\r\n [ngClass]=\"{\r\n 'mc-list-item-disabled': item.disabled,\r\n 'mc-list-item-active': item.active,\r\n 'mc-list-item-pre-selection': index === preSelectIndex\r\n }\"\r\n (click)=\"onItemClick(item)\"\r\n >\r\n <ng-container *ngIf=\"itemTemplate; else defaultLabel\">\r\n <ng-container\r\n *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\">\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-template #defaultLabel>\r\n {{ item['label'] }}\r\n </ng-template>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n</div>\r\n", styles: [".mc-list{width:100%;max-height:300px;box-sizing:border-box;overflow:auto}.mc-list.mc-list-horizontal .mc-list-item{width:unset}.mc-list:not(.mc-list-horizontal) .mc-list-item:not(:first-child){margin-top:4px}.mc-list .mc-list-item{width:100%;line-height:20px;padding:8px;color:var(--devui-text, #252b3a);font-size:var(--devui-font-size, 14px);border-radius:var(--devui-border-radius, 2px);box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;transition:color var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)),background-color var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.mc-list .mc-list-item.filled{background-color:var(--devui-gray-form-control-bg, #f5f5f5)}.mc-list .mc-list-item.bordered{border:1px solid var(--devui-dividing-line, #f2f2f3)}.mc-list .mc-list-item:hover,.mc-list .mc-list-item.mc-list-item-pre-selection{color:var(--devui-list-item-hover-text, #252b3a);background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.mc-list .mc-list-item.mc-list-item-active{color:var(--devui-list-item-active-text, #252b3a);background-color:var(--devui-list-item-active-bg, #f2f5fc)}.mc-list .mc-list-item.mc-list-item-disabled{color:var(--devui-disabled-text, #cfd0d3);background-color:var(--devui-disabled-bg, #f5f5f5);cursor:not-allowed}.mc-list-horizontal{display:flex;flex-wrap:wrap;gap:12px}.mc-list-horizontal.mc-list-nowrap{flex-wrap:nowrap}.mc-list-horizontal.mc-list-nowrap .mc-list-item{flex:none}\n"] }]
|
|
3085
|
+
}], ctorParameters: () => [], propDecorators: { direction: [{
|
|
3086
|
+
type: Input
|
|
3087
|
+
}], autoWrap: [{
|
|
3088
|
+
type: Input
|
|
3089
|
+
}], variant: [{
|
|
3090
|
+
type: Input
|
|
3091
|
+
}], enableLazyLoad: [{
|
|
3092
|
+
type: Input
|
|
3093
|
+
}], enableShortKey: [{
|
|
3094
|
+
type: Input
|
|
3095
|
+
}], data: [{
|
|
3096
|
+
type: Input
|
|
3097
|
+
}], inputEl: [{
|
|
3098
|
+
type: Input
|
|
3099
|
+
}], selectable: [{
|
|
3100
|
+
type: Input
|
|
3101
|
+
}], preSelectIndex: [{
|
|
3102
|
+
type: Input
|
|
3103
|
+
}], loadMore: [{
|
|
3104
|
+
type: Output
|
|
3105
|
+
}], select: [{
|
|
3106
|
+
type: Output
|
|
3107
|
+
}], itemTemplate: [{
|
|
3108
|
+
type: ContentChild,
|
|
3109
|
+
args: ['item']
|
|
3110
|
+
}] } });
|
|
3111
|
+
|
|
3112
|
+
class ListModule {
|
|
3113
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
3114
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.10", ngImport: i0, type: ListModule, imports: [CommonModule, ListComponent], exports: [ListComponent] }); }
|
|
3115
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ListModule, imports: [CommonModule, ListComponent] }); }
|
|
3116
|
+
}
|
|
3117
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ListModule, decorators: [{
|
|
3118
|
+
type: NgModule,
|
|
3119
|
+
args: [{
|
|
3120
|
+
declarations: [],
|
|
3121
|
+
imports: [CommonModule, ListComponent],
|
|
3122
|
+
exports: [ListComponent],
|
|
3123
|
+
}]
|
|
3124
|
+
}] });
|
|
3125
|
+
|
|
3126
|
+
class MDCardService {
|
|
3127
|
+
constructor() {
|
|
3128
|
+
this.xssWhiteList = getDefaultWhiteList();
|
|
3129
|
+
this.cssWhiteList = getDefaultCSSWhiteList();
|
|
3130
|
+
this.setDefaultXss();
|
|
3131
|
+
}
|
|
3132
|
+
setDefaultXss() {
|
|
3133
|
+
this.xssWhiteList['input'] = ['type', 'checked', 'disabled', 'class'];
|
|
3134
|
+
this.xssWhiteList['label'] = ['for'];
|
|
3135
|
+
this.xssWhiteList['ul'] = ['class'];
|
|
3136
|
+
this.xssWhiteList['div'] = ['class', 'key'];
|
|
3137
|
+
this.xssWhiteList['a'] = ['href', 'class', 'target', 'name'];
|
|
3138
|
+
this.xssWhiteList['ol'] = ['start'];
|
|
3139
|
+
this.xssWhiteList['p'] = ['class'];
|
|
3140
|
+
this.xssWhiteList['span'] = ['style', 'class', 'title', 'id'];
|
|
3141
|
+
this.xssWhiteList['svg'] = ['style', 'class', 'width', 'height', 'viewbox', 'preserveaspectratio', 'id', 'fill', 'stroke'];
|
|
3142
|
+
this.xssWhiteList['path'] = ['style', 'class', 'd', 'id', 'fill', 'stroke'];
|
|
3143
|
+
this.xssWhiteList['th'] = ['style'];
|
|
3144
|
+
this.xssWhiteList['td'] = ['style'];
|
|
3145
|
+
}
|
|
3146
|
+
getXssWhiteList() {
|
|
3147
|
+
return this.xssWhiteList;
|
|
3148
|
+
}
|
|
3149
|
+
setXssWhiteList(list) {
|
|
3150
|
+
this.xssWhiteList = list;
|
|
3151
|
+
}
|
|
3152
|
+
setCustomXssRules(rules) {
|
|
3153
|
+
if (rules) {
|
|
3154
|
+
rules.forEach((rule) => {
|
|
3155
|
+
if (rule['value'] === null) {
|
|
3156
|
+
delete this.xssWhiteList[rule['key']];
|
|
3157
|
+
}
|
|
3158
|
+
else {
|
|
3159
|
+
this.xssWhiteList[rule['key']] = rule['value'];
|
|
3160
|
+
}
|
|
3161
|
+
});
|
|
3162
|
+
}
|
|
3163
|
+
}
|
|
3164
|
+
setMdPlugins(plugins, mdt) {
|
|
3165
|
+
if (plugins && plugins.length) {
|
|
3166
|
+
plugins.forEach(item => {
|
|
3167
|
+
const { plugin, opts } = item;
|
|
3168
|
+
mdt.use(plugin, opts);
|
|
3169
|
+
});
|
|
3170
|
+
}
|
|
3171
|
+
}
|
|
3172
|
+
filterHtml(html) {
|
|
3173
|
+
return filterXSS(html, {
|
|
3174
|
+
whiteList: this.xssWhiteList,
|
|
3175
|
+
css: {
|
|
3176
|
+
whiteList: Object.assign({}, this.cssWhiteList, {
|
|
3177
|
+
top: true,
|
|
3178
|
+
left: true,
|
|
3179
|
+
bottom: true,
|
|
3180
|
+
right: true,
|
|
3181
|
+
}),
|
|
3182
|
+
},
|
|
3183
|
+
});
|
|
3184
|
+
}
|
|
3185
|
+
}
|
|
3186
|
+
|
|
3187
|
+
class MermaidService {
|
|
3188
|
+
constructor(config = {}) {
|
|
3189
|
+
this.config = config;
|
|
3190
|
+
this.mermaidInstance = null;
|
|
3191
|
+
this.isLoading = false;
|
|
3192
|
+
this.lastValidResult = '';
|
|
3193
|
+
this.viewStateMap = new WeakMap();
|
|
3194
|
+
this.containerHeight = 400;
|
|
3195
|
+
}
|
|
3196
|
+
async loadMermaid() {
|
|
3197
|
+
if (this.mermaidInstance) {
|
|
3198
|
+
return this.mermaidInstance;
|
|
3199
|
+
}
|
|
3200
|
+
if (this.isLoading) {
|
|
3201
|
+
return new Promise((resolve) => {
|
|
3202
|
+
const checkInstance = () => {
|
|
3203
|
+
if (this.mermaidInstance) {
|
|
3204
|
+
resolve(this.mermaidInstance);
|
|
3205
|
+
}
|
|
3206
|
+
else {
|
|
3207
|
+
setTimeout(checkInstance, 50);
|
|
3208
|
+
}
|
|
3209
|
+
};
|
|
3210
|
+
checkInstance();
|
|
3211
|
+
});
|
|
3212
|
+
}
|
|
3213
|
+
this.isLoading = true;
|
|
3214
|
+
try {
|
|
3215
|
+
const { default: mermaid } = await import('mermaid');
|
|
3216
|
+
mermaid.initialize({
|
|
3217
|
+
theme: this.config.theme || 'default',
|
|
3218
|
+
startOnLoad: false,
|
|
3219
|
+
suppressErrorRendering: true,
|
|
3220
|
+
...this.config
|
|
3221
|
+
});
|
|
3222
|
+
this.mermaidInstance = mermaid;
|
|
3223
|
+
return mermaid;
|
|
3224
|
+
}
|
|
3225
|
+
catch (error) {
|
|
3226
|
+
console.error('Failed to load mermaid:', error);
|
|
3227
|
+
throw new Error('Failed to load mermaid library');
|
|
3228
|
+
}
|
|
3229
|
+
finally {
|
|
3230
|
+
this.isLoading = false;
|
|
3231
|
+
}
|
|
3232
|
+
}
|
|
3233
|
+
async renderToContainer(container, code, theme = 'light') {
|
|
2473
3234
|
const svgStr = await this.renderMermaid(code, theme);
|
|
2474
3235
|
container.innerHTML = svgStr;
|
|
2475
3236
|
const svg = container.querySelector('svg');
|
|
@@ -3964,784 +4725,370 @@ class MentionFoundation extends BaseFoundation {
|
|
|
3964
4725
|
if (triggerIndex < 0 ||
|
|
3965
4726
|
(triggerIndex > 0 && onlyInputStart) ||
|
|
3966
4727
|
triggerIndex < separatorPos ||
|
|
3967
|
-
lastMentionChar === MentionSeparator) {
|
|
3968
|
-
continue;
|
|
3969
|
-
}
|
|
3970
|
-
else {
|
|
3971
|
-
const searchValue = mentionStr.slice(trigger.length);
|
|
3972
|
-
return { trigger, triggerIndex, searchValue };
|
|
3973
|
-
}
|
|
3974
|
-
}
|
|
3975
|
-
return null;
|
|
3976
|
-
}
|
|
3977
|
-
// 处理箭头键
|
|
3978
|
-
handleArrowKey(direction) {
|
|
3979
|
-
let newIndex = (this.getCurrentActiveIndex() + direction) % this.props.optionsCount;
|
|
3980
|
-
if (newIndex < 0) {
|
|
3981
|
-
newIndex = this.props.optionsCount - 1;
|
|
3982
|
-
}
|
|
3983
|
-
this._adapter.activeIndexChange(newIndex);
|
|
3984
|
-
}
|
|
3985
|
-
// 获取当前活动索引
|
|
3986
|
-
getCurrentActiveIndex() {
|
|
3987
|
-
// 默认返回0,实际实现可能需要根据adapter获取
|
|
3988
|
-
return 0;
|
|
3989
|
-
}
|
|
3990
|
-
// 处理选择事件
|
|
3991
|
-
handleSelect() {
|
|
3992
|
-
if (!this.inputEl || this.currentTriggerIndex === -1)
|
|
3993
|
-
return;
|
|
3994
|
-
const value = this.inputEl.value;
|
|
3995
|
-
const beforeTrigger = value.substring(0, this.currentTriggerIndex);
|
|
3996
|
-
const afterCursor = value.substring(this.currentCursorIndex);
|
|
3997
|
-
// 这里需要根据实际选择的项进行替换,暂时使用示例实现
|
|
3998
|
-
const selectedValue = `${beforeTrigger}@selected ${afterCursor}`;
|
|
3999
|
-
this.inputEl.value = selectedValue;
|
|
4000
|
-
// 设置光标位置
|
|
4001
|
-
const newCursorPosition = beforeTrigger.length + '@selected '.length;
|
|
4002
|
-
this.inputEl.setSelectionRange(newCursorPosition, newCursorPosition);
|
|
4003
|
-
// 关闭选择面板
|
|
4004
|
-
this.resetMention();
|
|
4005
|
-
// 触发input事件以更新绑定值
|
|
4006
|
-
this.inputEl.dispatchEvent(new Event('input', { bubbles: true }));
|
|
4007
|
-
}
|
|
4008
|
-
// 更新覆盖层位置
|
|
4009
|
-
updateOverlayPosition() {
|
|
4010
|
-
return new Promise((resolve) => {
|
|
4011
|
-
if (!this.originEl || !this.overlayEl) {
|
|
4012
|
-
resolve(undefined);
|
|
4013
|
-
return;
|
|
4014
|
-
}
|
|
4015
|
-
// 设置宽度
|
|
4016
|
-
if (this.props.fitHostWidth) {
|
|
4017
|
-
const originRect = this.originEl.getBoundingClientRect();
|
|
4018
|
-
this.overlayEl.style.width = `${originRect.width}px`;
|
|
4019
|
-
}
|
|
4020
|
-
else {
|
|
4021
|
-
this.overlayEl.style.width = '';
|
|
4022
|
-
}
|
|
4023
|
-
// 清理之前的autoUpdate
|
|
4024
|
-
if (this.autoUpdateCleanup) {
|
|
4025
|
-
this.autoUpdateCleanup();
|
|
4026
|
-
this.autoUpdateCleanup = null;
|
|
4027
|
-
}
|
|
4028
|
-
// 设置位置:使用@floating-ui/dom计算位置,与Vue版本保持一致
|
|
4029
|
-
computePosition(this.originEl, this.overlayEl, {
|
|
4030
|
-
strategy: 'fixed',
|
|
4031
|
-
placement: 'top-start',
|
|
4032
|
-
middleware: [offset(4)],
|
|
4033
|
-
}).then(({ x, y }) => {
|
|
4034
|
-
this.overlayEl.style.top = `${y}px`;
|
|
4035
|
-
this.overlayEl.style.left = `${x}px`;
|
|
4036
|
-
this.overlayEl.style.position = 'fixed';
|
|
4037
|
-
// 返回位置信息,用于Vue组件同步样式
|
|
4038
|
-
resolve({
|
|
4039
|
-
top: `${y}px`,
|
|
4040
|
-
left: `${x}px`,
|
|
4041
|
-
width: this.props.fitHostWidth ? `${this.originEl.getBoundingClientRect().width}px` : ''
|
|
4042
|
-
});
|
|
4043
|
-
// 设置autoUpdate,自动处理滚动、调整大小和视口变化事件
|
|
4044
|
-
this.autoUpdateCleanup = autoUpdate(this.originEl, this.overlayEl, () => {
|
|
4045
|
-
if (this.originEl && this.overlayEl) {
|
|
4046
|
-
// 当fitHostWidth为true时,更新宽度
|
|
4047
|
-
if (this.props.fitHostWidth) {
|
|
4048
|
-
const originRect = this.originEl.getBoundingClientRect();
|
|
4049
|
-
this.overlayEl.style.width = `${originRect.width}px`;
|
|
4050
|
-
}
|
|
4051
|
-
computePosition(this.originEl, this.overlayEl, {
|
|
4052
|
-
strategy: 'fixed',
|
|
4053
|
-
placement: 'top-start',
|
|
4054
|
-
middleware: [offset(4)],
|
|
4055
|
-
}).then(({ x, y }) => {
|
|
4056
|
-
this.overlayEl.style.top = `${y}px`;
|
|
4057
|
-
this.overlayEl.style.left = `${x}px`;
|
|
4058
|
-
});
|
|
4059
|
-
}
|
|
4060
|
-
}, {
|
|
4061
|
-
// 添加对视口变化的更全面监听,确保浏览器F12打开/关闭时位置能正确更新
|
|
4062
|
-
animationFrame: true,
|
|
4063
|
-
elementResize: true,
|
|
4064
|
-
ancestorScroll: true,
|
|
4065
|
-
ancestorResize: true,
|
|
4066
|
-
layoutShift: true
|
|
4067
|
-
});
|
|
4068
|
-
}).catch(() => {
|
|
4069
|
-
// 处理计算位置失败的情况
|
|
4070
|
-
resolve(undefined);
|
|
4071
|
-
});
|
|
4072
|
-
});
|
|
4073
|
-
}
|
|
4074
|
-
// 获取当前搜索值
|
|
4075
|
-
getCurrentSearchValue() {
|
|
4076
|
-
return this.currentSearchValue;
|
|
4077
|
-
}
|
|
4078
|
-
// 获取当前触发词
|
|
4079
|
-
getCurrentTrigger() {
|
|
4080
|
-
return this.currentTrigger;
|
|
4081
|
-
}
|
|
4082
|
-
}
|
|
4083
|
-
|
|
4084
|
-
class MentionComponent extends BaseComponent {
|
|
4085
|
-
set optionsCount(val) {
|
|
4086
|
-
this._optionsCount = val;
|
|
4087
|
-
// 当optionsCount变化时,更新foundation的配置
|
|
4088
|
-
if (this.foundation) {
|
|
4089
|
-
this.foundation.updateOptions({ optionsCount: val });
|
|
4090
|
-
}
|
|
4091
|
-
}
|
|
4092
|
-
get optionsCount() {
|
|
4093
|
-
return this._optionsCount;
|
|
4094
|
-
}
|
|
4095
|
-
constructor() {
|
|
4096
|
-
super();
|
|
4097
|
-
this.prefix = ['@'];
|
|
4098
|
-
this.fitHostWidth = true;
|
|
4099
|
-
// 选项数量,用于键盘导航
|
|
4100
|
-
this._optionsCount = 0;
|
|
4101
|
-
this.updateModelValue = new EventEmitter();
|
|
4102
|
-
this.searchChange = new EventEmitter();
|
|
4103
|
-
this.toggleChange = new EventEmitter();
|
|
4104
|
-
// 当前选中索引变化事件
|
|
4105
|
-
this.activeIndexChange = new EventEmitter();
|
|
4106
|
-
// 当前选中的索引
|
|
4107
|
-
this.activeIndex = -1;
|
|
4108
|
-
this.overlayStyle = { top: '0px', left: '0px', width: '' };
|
|
4109
|
-
this.inputEl = null;
|
|
4110
|
-
// 私有属性存储实际的modelValue
|
|
4111
|
-
this._modelValue = false;
|
|
4112
|
-
// ControlValueAccessor 接口实现
|
|
4113
|
-
this.onChange = () => { };
|
|
4114
|
-
this.onTouched = () => { };
|
|
4115
|
-
// 处理文档点击事件,点击外部关闭Mention面板
|
|
4116
|
-
this.onDocumentClick = (e) => {
|
|
4117
|
-
if (this.originEl && this.originEl.nativeElement && this.modelValue) {
|
|
4118
|
-
if (!this.originEl.nativeElement.contains(e.target)) {
|
|
4119
|
-
this.foundation.resetMention();
|
|
4120
|
-
}
|
|
4121
|
-
}
|
|
4122
|
-
};
|
|
4123
|
-
}
|
|
4124
|
-
ngOnInit() {
|
|
4125
|
-
this.foundation = new MentionFoundation(this.adapter);
|
|
4126
|
-
}
|
|
4127
|
-
get adapter() {
|
|
4128
|
-
return {
|
|
4129
|
-
...super.adapter,
|
|
4130
|
-
updateModelValue: (val) => {
|
|
4131
|
-
// 调用modelValue的setter方法,确保位置更新逻辑被执行
|
|
4132
|
-
this.modelValue = val;
|
|
4133
|
-
},
|
|
4134
|
-
searchChange: (event) => this.searchChange.emit(event),
|
|
4135
|
-
activeIndexChange: (index) => {
|
|
4136
|
-
this.activeIndex = index;
|
|
4137
|
-
this.activeIndexChange.emit(index);
|
|
4138
|
-
},
|
|
4139
|
-
toggleChange: (val) => this.toggleChange.emit(val)
|
|
4140
|
-
};
|
|
4141
|
-
}
|
|
4142
|
-
ngAfterViewInit() {
|
|
4143
|
-
// 添加安全检查 - 仅检查必要元素,overlayEl有*ngIf条件可能不会立即渲染
|
|
4144
|
-
if (!this.popperTriggerEl || !this.originEl) {
|
|
4145
|
-
console.error('ViewChild elements not found');
|
|
4146
|
-
return;
|
|
4147
|
-
}
|
|
4148
|
-
const hostElement = this.popperTriggerEl.nativeElement;
|
|
4149
|
-
let foundInputEl = null;
|
|
4150
|
-
// 检查hostElement本身是否是输入元素
|
|
4151
|
-
if (hostElement.tagName === 'TEXTAREA' || hostElement.tagName === 'INPUT') {
|
|
4152
|
-
foundInputEl = hostElement;
|
|
4153
|
-
}
|
|
4154
|
-
else {
|
|
4155
|
-
// 先查找mc-input组件
|
|
4156
|
-
const mcInputComponent = hostElement.querySelector('mc-input');
|
|
4157
|
-
if (mcInputComponent) {
|
|
4158
|
-
// 如果找到mc-input组件,查找其内部的textarea元素
|
|
4159
|
-
foundInputEl = mcInputComponent.querySelector('textarea');
|
|
4160
|
-
}
|
|
4161
|
-
else {
|
|
4162
|
-
// 否则在hostElement内部查找原生输入元素
|
|
4163
|
-
foundInputEl = hostElement.querySelector('textarea') || hostElement.querySelector('input');
|
|
4164
|
-
}
|
|
4165
|
-
}
|
|
4166
|
-
if (!foundInputEl) {
|
|
4167
|
-
console.error('Input/Textarea element not found in Mention component');
|
|
4168
|
-
return;
|
|
4169
|
-
}
|
|
4170
|
-
// 初始化foundation的元素
|
|
4171
|
-
this.inputEl = foundInputEl;
|
|
4172
|
-
this.foundation.setInputEl(this.inputEl);
|
|
4173
|
-
this.foundation.setOriginEl(this.originEl.nativeElement);
|
|
4174
|
-
// 仅在overlayEl存在时设置,否则Foundation会在需要时处理
|
|
4175
|
-
if (this.overlayEl) {
|
|
4176
|
-
this.foundation.setOverlayEl(this.overlayEl.nativeElement);
|
|
4177
|
-
}
|
|
4178
|
-
// 初始化事件
|
|
4179
|
-
this.foundation.initEvents();
|
|
4180
|
-
}
|
|
4181
|
-
ngOnDestroy() {
|
|
4182
|
-
this.cleanupDocumentClick();
|
|
4183
|
-
// 清理Foundation资源
|
|
4184
|
-
this.foundation.destroy();
|
|
4185
|
-
super.ngOnDestroy();
|
|
4186
|
-
}
|
|
4187
|
-
// 监听modelValue变化,更新overlay位置
|
|
4188
|
-
set modelValue(val) {
|
|
4189
|
-
if (this._modelValue !== val) {
|
|
4190
|
-
this._modelValue = val;
|
|
4191
|
-
// 当显示Mention面板时,确保overlay元素已传递给foundation并更新位置
|
|
4192
|
-
if (val && this.foundation) {
|
|
4193
|
-
// 使用setTimeout确保overlayEl已经渲染完成
|
|
4194
|
-
setTimeout(() => {
|
|
4195
|
-
// 检查overlayEl是否可用,如果可用则传递给foundation
|
|
4196
|
-
if (this.overlayEl) {
|
|
4197
|
-
this.foundation.setOverlayEl(this.overlayEl.nativeElement);
|
|
4198
|
-
// 获取位置信息并更新组件样式
|
|
4199
|
-
const positionInfo = this.foundation.updateOverlayPosition();
|
|
4200
|
-
if (positionInfo instanceof Promise) {
|
|
4201
|
-
positionInfo.then(pos => {
|
|
4202
|
-
if (pos) {
|
|
4203
|
-
this.overlayStyle = pos;
|
|
4204
|
-
}
|
|
4205
|
-
});
|
|
4206
|
-
}
|
|
4207
|
-
else if (positionInfo) {
|
|
4208
|
-
this.overlayStyle = positionInfo;
|
|
4209
|
-
}
|
|
4210
|
-
}
|
|
4211
|
-
}, 0);
|
|
4212
|
-
}
|
|
4213
|
-
// 调用onChange回调,支持ngModel双向绑定
|
|
4214
|
-
this.onChange(val);
|
|
4215
|
-
// 仍然触发updateModelValue事件,保持向后兼容
|
|
4216
|
-
this.updateModelValue.emit(val);
|
|
4217
|
-
}
|
|
4218
|
-
}
|
|
4219
|
-
get modelValue() {
|
|
4220
|
-
return this._modelValue;
|
|
4221
|
-
}
|
|
4222
|
-
writeValue(value) {
|
|
4223
|
-
this.modelValue = value;
|
|
4224
|
-
}
|
|
4225
|
-
registerOnChange(fn) {
|
|
4226
|
-
this.onChange = fn;
|
|
4227
|
-
}
|
|
4228
|
-
registerOnTouched(fn) {
|
|
4229
|
-
this.onTouched = fn;
|
|
4230
|
-
}
|
|
4231
|
-
setDisabledState(isDisabled) {
|
|
4232
|
-
// 如果需要禁用功能,可以在这里实现
|
|
4233
|
-
}
|
|
4234
|
-
// 初始化文档点击事件(已在ngAfterViewInit中处理,无需重复)
|
|
4235
|
-
ngAfterContentInit() {
|
|
4236
|
-
}
|
|
4237
|
-
// 清理文档点击事件
|
|
4238
|
-
cleanupDocumentClick() {
|
|
4239
|
-
document.removeEventListener('click', this.onDocumentClick);
|
|
4240
|
-
}
|
|
4241
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: MentionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4242
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: MentionComponent, isStandalone: true, selector: "mc-mention", inputs: { prefix: "prefix", fitHostWidth: "fitHostWidth", menuClass: "menuClass", optionsCount: "optionsCount", modelValue: "modelValue" }, outputs: { updateModelValue: "updateModelValue", searchChange: "searchChange", toggleChange: "toggleChange", activeIndexChange: "activeIndexChange" }, providers: [
|
|
4243
|
-
{
|
|
4244
|
-
provide: NG_VALUE_ACCESSOR,
|
|
4245
|
-
useExisting: forwardRef(() => MentionComponent),
|
|
4246
|
-
multi: true
|
|
4247
|
-
}
|
|
4248
|
-
], viewQueries: [{ propertyName: "popperTriggerEl", first: true, predicate: ["popperTrigger"], descendants: true }, { propertyName: "originEl", first: true, predicate: ["origin"], descendants: true }, { propertyName: "overlayEl", first: true, predicate: ["overlayEl"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<!-- Mention\u7EC4\u4EF6\u7684\u6A21\u677F -->\r\n\r\n<!-- \u89E6\u53D1\u5668\u5143\u7D20 -->\r\n<div #popperTrigger #origin class=\"mc-mention-trigger\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n<!-- \u63D0\u53CA\u83DC\u5355\u7684\u5F39\u51FA\u5C42 -->\r\n<div \r\n #overlayEl \r\n *ngIf=\"modelValue\" \r\n [@fade]\r\n class=\"mc-mention mc-mention-fade\" \r\n [ngClass]=\"menuClass\" \r\n [ngStyle]=\"overlayStyle\"\r\n>\r\n <ng-content select=\"[slot=menu]\"></ng-content>\r\n</div>", styles: [".mc-mention{position:fixed;max-height:300px;border-radius:var(--devui-border-radius, 2px);background-color:var(--devui-connected-overlay-bg, #ffffff);box-shadow:var(--devui-shadow-length-connected-overlay, 0 2px 12px 0) var(--devui-shadow, rgba(37, 43, 58, .24));transform-origin:0% 100%;z-index:1000}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }], animations: [
|
|
4249
|
-
trigger('fade', [
|
|
4250
|
-
transition(':enter', [
|
|
4251
|
-
style({ opacity: 0.8, transform: 'scaleY(0.8) translateY(4px)' }),
|
|
4252
|
-
animate('0.2s cubic-bezier(0.16, 0.75, 0.5, 1)', style({ opacity: 1, transform: 'scaleY(0.9999) translateY(0)' }))
|
|
4253
|
-
]),
|
|
4254
|
-
transition(':leave', [
|
|
4255
|
-
style({ opacity: 1, transform: 'scaleY(0.9999) translateY(0)' }),
|
|
4256
|
-
animate('0.2s cubic-bezier(0.5, 0, 0.84, 0.25)', style({ opacity: 0.8, transform: 'scaleY(0.8) translateY(4px)' }))
|
|
4257
|
-
])
|
|
4258
|
-
])
|
|
4259
|
-
] }); }
|
|
4260
|
-
}
|
|
4261
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: MentionComponent, decorators: [{
|
|
4262
|
-
type: Component,
|
|
4263
|
-
args: [{ selector: 'mc-mention', standalone: true, imports: [CommonModule, FormsModule], animations: [
|
|
4264
|
-
trigger('fade', [
|
|
4265
|
-
transition(':enter', [
|
|
4266
|
-
style({ opacity: 0.8, transform: 'scaleY(0.8) translateY(4px)' }),
|
|
4267
|
-
animate('0.2s cubic-bezier(0.16, 0.75, 0.5, 1)', style({ opacity: 1, transform: 'scaleY(0.9999) translateY(0)' }))
|
|
4268
|
-
]),
|
|
4269
|
-
transition(':leave', [
|
|
4270
|
-
style({ opacity: 1, transform: 'scaleY(0.9999) translateY(0)' }),
|
|
4271
|
-
animate('0.2s cubic-bezier(0.5, 0, 0.84, 0.25)', style({ opacity: 0.8, transform: 'scaleY(0.8) translateY(4px)' }))
|
|
4272
|
-
])
|
|
4273
|
-
])
|
|
4274
|
-
], providers: [
|
|
4275
|
-
{
|
|
4276
|
-
provide: NG_VALUE_ACCESSOR,
|
|
4277
|
-
useExisting: forwardRef(() => MentionComponent),
|
|
4278
|
-
multi: true
|
|
4279
|
-
}
|
|
4280
|
-
], template: "<!-- Mention\u7EC4\u4EF6\u7684\u6A21\u677F -->\r\n\r\n<!-- \u89E6\u53D1\u5668\u5143\u7D20 -->\r\n<div #popperTrigger #origin class=\"mc-mention-trigger\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n<!-- \u63D0\u53CA\u83DC\u5355\u7684\u5F39\u51FA\u5C42 -->\r\n<div \r\n #overlayEl \r\n *ngIf=\"modelValue\" \r\n [@fade]\r\n class=\"mc-mention mc-mention-fade\" \r\n [ngClass]=\"menuClass\" \r\n [ngStyle]=\"overlayStyle\"\r\n>\r\n <ng-content select=\"[slot=menu]\"></ng-content>\r\n</div>", styles: [".mc-mention{position:fixed;max-height:300px;border-radius:var(--devui-border-radius, 2px);background-color:var(--devui-connected-overlay-bg, #ffffff);box-shadow:var(--devui-shadow-length-connected-overlay, 0 2px 12px 0) var(--devui-shadow, rgba(37, 43, 58, .24));transform-origin:0% 100%;z-index:1000}\n"] }]
|
|
4281
|
-
}], ctorParameters: () => [], propDecorators: { prefix: [{
|
|
4282
|
-
type: Input
|
|
4283
|
-
}], fitHostWidth: [{
|
|
4284
|
-
type: Input
|
|
4285
|
-
}], menuClass: [{
|
|
4286
|
-
type: Input
|
|
4287
|
-
}], optionsCount: [{
|
|
4288
|
-
type: Input
|
|
4289
|
-
}], updateModelValue: [{
|
|
4290
|
-
type: Output
|
|
4291
|
-
}], searchChange: [{
|
|
4292
|
-
type: Output
|
|
4293
|
-
}], toggleChange: [{
|
|
4294
|
-
type: Output
|
|
4295
|
-
}], activeIndexChange: [{
|
|
4296
|
-
type: Output
|
|
4297
|
-
}], popperTriggerEl: [{
|
|
4298
|
-
type: ViewChild,
|
|
4299
|
-
args: ['popperTrigger']
|
|
4300
|
-
}], originEl: [{
|
|
4301
|
-
type: ViewChild,
|
|
4302
|
-
args: ['origin']
|
|
4303
|
-
}], overlayEl: [{
|
|
4304
|
-
type: ViewChild,
|
|
4305
|
-
args: ['overlayEl']
|
|
4306
|
-
}], modelValue: [{
|
|
4307
|
-
type: Input
|
|
4308
|
-
}] } });
|
|
4309
|
-
|
|
4310
|
-
class MentionModule {
|
|
4311
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: MentionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
4312
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.10", ngImport: i0, type: MentionModule, imports: [CommonModule,
|
|
4313
|
-
MentionComponent], exports: [MentionComponent] }); }
|
|
4314
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: MentionModule, imports: [CommonModule,
|
|
4315
|
-
MentionComponent] }); }
|
|
4316
|
-
}
|
|
4317
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: MentionModule, decorators: [{
|
|
4318
|
-
type: NgModule,
|
|
4319
|
-
args: [{
|
|
4320
|
-
declarations: [],
|
|
4321
|
-
imports: [
|
|
4322
|
-
CommonModule,
|
|
4323
|
-
MentionComponent
|
|
4324
|
-
],
|
|
4325
|
-
exports: [MentionComponent],
|
|
4326
|
-
}]
|
|
4327
|
-
}] });
|
|
4328
|
-
|
|
4329
|
-
// Mention组件的导出文件
|
|
4330
|
-
|
|
4331
|
-
function copyToClipboard(text) {
|
|
4332
|
-
if (typeof text !== 'string') {
|
|
4333
|
-
return Promise.reject();
|
|
4334
|
-
}
|
|
4335
|
-
// 现代浏览器优先使用 Clipboard API
|
|
4336
|
-
if (navigator.clipboard && window.isSecureContext) {
|
|
4337
|
-
return navigator.clipboard
|
|
4338
|
-
.writeText(text)
|
|
4339
|
-
.then(() => { })
|
|
4340
|
-
.catch((err) => {
|
|
4341
|
-
return fallbackCopyTextToClipboard(text); // 降级处理
|
|
4342
|
-
});
|
|
4343
|
-
}
|
|
4344
|
-
// 低版本浏览器直接使用降级方案
|
|
4345
|
-
return fallbackCopyTextToClipboard(text);
|
|
4346
|
-
}
|
|
4347
|
-
function fallbackCopyTextToClipboard(text) {
|
|
4348
|
-
return new Promise((resolve, reject) => {
|
|
4349
|
-
// 创建隐藏的 textarea 元素
|
|
4350
|
-
const textarea = document.createElement('textarea');
|
|
4351
|
-
textarea.value = text;
|
|
4352
|
-
// 样式:隐藏且不影响布局
|
|
4353
|
-
textarea.style.position = 'fixed';
|
|
4354
|
-
textarea.style.top = '-9999px';
|
|
4355
|
-
textarea.style.left = '-9999px';
|
|
4356
|
-
textarea.style.opacity = '0';
|
|
4357
|
-
textarea.style.zIndex = '-1000';
|
|
4358
|
-
// 解决 iOS 下无法选中的问题
|
|
4359
|
-
textarea.setAttribute('readonly', '');
|
|
4360
|
-
document.body.appendChild(textarea);
|
|
4361
|
-
try {
|
|
4362
|
-
// 选中内容(兼容 iOS)
|
|
4363
|
-
textarea.select();
|
|
4364
|
-
textarea.setSelectionRange(0, textarea.value.length); // 移动端必须
|
|
4365
|
-
// 执行复制
|
|
4366
|
-
const success = document.execCommand('copy');
|
|
4367
|
-
if (success) {
|
|
4368
|
-
resolve(null);
|
|
4369
|
-
}
|
|
4370
|
-
else {
|
|
4371
|
-
reject();
|
|
4372
|
-
}
|
|
4373
|
-
}
|
|
4374
|
-
catch (err) {
|
|
4375
|
-
reject();
|
|
4376
|
-
}
|
|
4377
|
-
finally {
|
|
4378
|
-
// 移除临时元素
|
|
4379
|
-
document.body.removeChild(textarea);
|
|
4380
|
-
}
|
|
4381
|
-
});
|
|
4382
|
-
}
|
|
4383
|
-
|
|
4384
|
-
const TOOLBAR_GAP_DEFAULT_VALUE = 0;
|
|
4385
|
-
const TOOLBAR_ICON_SIZE_DEFAULT_VALUE = 16;
|
|
4386
|
-
|
|
4387
|
-
class CopyIconComponent {
|
|
4388
|
-
constructor() {
|
|
4389
|
-
this.width = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
4390
|
-
this.height = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
4391
|
-
this.isActive = false;
|
|
4392
|
-
this.text = '';
|
|
4393
|
-
this.title = '';
|
|
4394
|
-
this.copied = false;
|
|
4395
|
-
}
|
|
4396
|
-
async handleClick() {
|
|
4397
|
-
setTimeout(() => {
|
|
4398
|
-
this.copied = false;
|
|
4399
|
-
}, 1500);
|
|
4400
|
-
try {
|
|
4401
|
-
await copyToClipboard(this.text);
|
|
4402
|
-
this.copied = true;
|
|
4403
|
-
}
|
|
4404
|
-
catch (error) { }
|
|
4405
|
-
}
|
|
4406
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: CopyIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4407
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: CopyIconComponent, isStandalone: true, selector: "mc-copy-icon", inputs: { width: "width", height: "height", isActive: "isActive", text: "text", title: "title" }, ngImport: i0, template: "<div class=\"mc-action-item\" [title]=\"title\">\r\n <svg\r\n *ngIf=\"copied\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <desc>Created with Sketch.</desc>\r\n <defs>\r\n <polygon id=\"path-1\" points=\"6.53553391 9.77817459 12.1923882 4.12132034 13.6066017 5.53553391 6.53553391 12.6066017 3 9.07106781 4.41421356 7.65685425 6.53553391 9.77817459\"></polygon>\r\n </defs>\r\n <g id=\"status/whiteBG/correct\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <mask id=\"mask-2\" fill=\"white\">\r\n <use xlink:href=\"#path-1\"></use>\r\n </mask>\r\n <use id=\"Mask\" fill=\"currentColor\" xlink:href=\"#path-1\"></use>\r\n </g>\r\n </svg>\r\n <svg\r\n *ngIf=\"!copied\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n (click)=\"handleClick()\"\r\n >\r\n <g id=\"\u9875\u9762-1\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <g id=\"API-starter-\u56FE\u6807\u5165\u5E93\" transform=\"translate(-592.000000, -204.000000)\">\r\n <g id=\"\u65B9\u683C\u5907\u4EFD-16\" transform=\"translate(560.000000, 180.000000)\">\r\n <text id=\"\u56FE\u6807\" font-family=\"PingFangSC-Regular, PingFang SC\" font-size=\"12\" font-weight=\"normal\" line-spacing=\"16\" fill=\"#71757F\">\r\n <tspan x=\"27.136\" y=\"61\">\u590D\u5236</tspan>\r\n </text>\r\n </g>\r\n <path\r\n d=\"M604.5,206 C605.279696,206 605.920449,206.594888 605.993133,207.35554 L606,207.5 L606,214.5 C606,215.279696 605.405112,215.920449 604.64446,215.993133 L604.5,216 L604,216 L604,216.5 C604,217.279696 603.405112,217.920449 602.64446,217.993133 L602.5,218 L595.5,218 C594.671573,218 594,217.328427 594,216.5 L594,216.5 L594,209.5 C594,208.671573 594.671573,208 595.5,208 L595.5,208 L596,208 L596,207.5 C596,206.720304 596.594888,206.079551 597.35554,206.006867 L597.5,206 L604.5,206 Z M602.5,209 L595.5,209 C595.223858,209 595,209.223858 595,209.5 L595,209.5 L595,216.5 C595,216.776142 595.223858,217 595.5,217 L595.5,217 L602.5,217 C602.776142,217 603,216.776142 603,216.5 L603,216.5 L603,209.5 C603,209.223858 602.776142,209 602.5,209 L602.5,209 Z M604.5,207 L597.5,207 C597.25454,207 597.050392,207.176875 597.008056,207.410124 L597,207.5 L597,208 L602.5,208 C603.279696,208 603.920449,208.594888 603.993133,209.35554 L604,209.5 L604,215 L604.5,215 C604.74546,215 604.949608,214.823125 604.991944,214.589876 L605,214.5 L605,207.5 C605,207.25454 604.823125,207.050392 604.589876,207.008056 L604.5,207 Z\"\r\n id=\"\u5F62\u72B6\u7ED3\u5408\"\r\n fill=\"currentColor\"\r\n fill-rule=\"nonzero\"\r\n ></path>\r\n </g>\r\n </g>\r\n </svg>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
4408
|
-
}
|
|
4409
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: CopyIconComponent, decorators: [{
|
|
4410
|
-
type: Component,
|
|
4411
|
-
args: [{ selector: 'mc-copy-icon', standalone: true, imports: [CommonModule], template: "<div class=\"mc-action-item\" [title]=\"title\">\r\n <svg\r\n *ngIf=\"copied\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <desc>Created with Sketch.</desc>\r\n <defs>\r\n <polygon id=\"path-1\" points=\"6.53553391 9.77817459 12.1923882 4.12132034 13.6066017 5.53553391 6.53553391 12.6066017 3 9.07106781 4.41421356 7.65685425 6.53553391 9.77817459\"></polygon>\r\n </defs>\r\n <g id=\"status/whiteBG/correct\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <mask id=\"mask-2\" fill=\"white\">\r\n <use xlink:href=\"#path-1\"></use>\r\n </mask>\r\n <use id=\"Mask\" fill=\"currentColor\" xlink:href=\"#path-1\"></use>\r\n </g>\r\n </svg>\r\n <svg\r\n *ngIf=\"!copied\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n (click)=\"handleClick()\"\r\n >\r\n <g id=\"\u9875\u9762-1\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <g id=\"API-starter-\u56FE\u6807\u5165\u5E93\" transform=\"translate(-592.000000, -204.000000)\">\r\n <g id=\"\u65B9\u683C\u5907\u4EFD-16\" transform=\"translate(560.000000, 180.000000)\">\r\n <text id=\"\u56FE\u6807\" font-family=\"PingFangSC-Regular, PingFang SC\" font-size=\"12\" font-weight=\"normal\" line-spacing=\"16\" fill=\"#71757F\">\r\n <tspan x=\"27.136\" y=\"61\">\u590D\u5236</tspan>\r\n </text>\r\n </g>\r\n <path\r\n d=\"M604.5,206 C605.279696,206 605.920449,206.594888 605.993133,207.35554 L606,207.5 L606,214.5 C606,215.279696 605.405112,215.920449 604.64446,215.993133 L604.5,216 L604,216 L604,216.5 C604,217.279696 603.405112,217.920449 602.64446,217.993133 L602.5,218 L595.5,218 C594.671573,218 594,217.328427 594,216.5 L594,216.5 L594,209.5 C594,208.671573 594.671573,208 595.5,208 L595.5,208 L596,208 L596,207.5 C596,206.720304 596.594888,206.079551 597.35554,206.006867 L597.5,206 L604.5,206 Z M602.5,209 L595.5,209 C595.223858,209 595,209.223858 595,209.5 L595,209.5 L595,216.5 C595,216.776142 595.223858,217 595.5,217 L595.5,217 L602.5,217 C602.776142,217 603,216.776142 603,216.5 L603,216.5 L603,209.5 C603,209.223858 602.776142,209 602.5,209 L602.5,209 Z M604.5,207 L597.5,207 C597.25454,207 597.050392,207.176875 597.008056,207.410124 L597,207.5 L597,208 L602.5,208 C603.279696,208 603.920449,208.594888 603.993133,209.35554 L604,209.5 L604,215 L604.5,215 C604.74546,215 604.949608,214.823125 604.991944,214.589876 L605,214.5 L605,207.5 C605,207.25454 604.823125,207.050392 604.589876,207.008056 L604.5,207 Z\"\r\n id=\"\u5F62\u72B6\u7ED3\u5408\"\r\n fill=\"currentColor\"\r\n fill-rule=\"nonzero\"\r\n ></path>\r\n </g>\r\n </g>\r\n </svg>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}\n"] }]
|
|
4412
|
-
}], propDecorators: { width: [{
|
|
4413
|
-
type: Input
|
|
4414
|
-
}], height: [{
|
|
4415
|
-
type: Input
|
|
4416
|
-
}], isActive: [{
|
|
4417
|
-
type: Input
|
|
4418
|
-
}], text: [{
|
|
4419
|
-
type: Input
|
|
4420
|
-
}], title: [{
|
|
4421
|
-
type: Input
|
|
4422
|
-
}] } });
|
|
4423
|
-
|
|
4424
|
-
class DeleteIconComponent {
|
|
4425
|
-
constructor() {
|
|
4426
|
-
this.width = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
4427
|
-
this.height = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
4428
|
-
this.isActive = false;
|
|
4429
|
-
this.title = '';
|
|
4430
|
-
this.text = '';
|
|
4431
|
-
}
|
|
4432
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: DeleteIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4433
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: DeleteIconComponent, isStandalone: true, selector: "mc-delete-icon", inputs: { width: "width", height: "height", isActive: "isActive", title: "title", text: "text" }, ngImport: i0, template: "<div class=\"mc-action-item\" [title]=\"title\">\r\n <svg\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <g\r\n id=\"codehub-delete-op\"\r\n stroke=\"none\"\r\n stroke-width=\"1\"\r\n fill=\"none\"\r\n fill-rule=\"evenodd\"\r\n >\r\n <path\r\n d=\"M12.5,5 C12.7761424,5 13,5.22385763 13,5.5 L13,13 C13,14.0543618 12.1841222,14.9181651 11.1492623,14.9945143 L11,15 L5,15 C3.9456382,15 3.08183488,14.1841222 3.00548574,13.1492623 L3,13 L3,5.5 C3,5.22385763 3.22385763,5 3.5,5 C3.77614237,5 4,5.22385763 4,5.5 L4,13 C4,13.5128358 4.38604019,13.9355072 4.88337887,13.9932723 L5,14 L11,14 C11.5128358,14 11.9355072,13.6139598 11.9932723,13.1166211 L12,13 L12,5.5 C12,5.22385763 12.2238576,5 12.5,5 Z M6.53333333,6 C6.79515721,6 7.0129156,6.17687516 7.05807395,6.41012437 L7.06666667,6.5 L7.06666667,11.5 C7.06666667,11.7761424 6.8278852,12 6.53333333,12 C6.27150945,12 6.05375107,11.8231248 6.00859271,11.5898756 L6,11.5 L6,6.5 C6,6.22385763 6.23878147,6 6.53333333,6 Z M9.53333333,6 C9.79515721,6 10.0129156,6.17687516 10.058074,6.41012437 L10.0666667,6.5 L10.0666667,11.5 C10.0666667,11.7761424 9.8278852,12 9.53333333,12 C9.27150945,12 9.05375107,11.8231248 9.00859271,11.5898756 L9,11.5 L9,6.5 C9,6.22385763 9.23878147,6 9.53333333,6 Z M10,1 C10.5128358,1 10.9355072,1.38604019 10.9932723,1.88337887 L11,2 L11,3 L14.5,3 C14.7761424,3 15,3.22385763 15,3.5 C15,3.77614237 14.7761424,4 14.5,4 L1.5,4 C1.22385763,4 1,3.77614237 1,3.5 C1,3.22385763 1.22385763,3 1.5,3 L5,3 L5,2 C5,1.48716416 5.38604019,1.06449284 5.88337887,1.00672773 L6,1 L10,1 Z M10,2 L6,2 L6,3 L10,3 L10,2 Z\"\r\n fill=\"currentColor\"\r\n ></path>\r\n </g>\r\n </svg>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] }); }
|
|
4434
|
-
}
|
|
4435
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: DeleteIconComponent, decorators: [{
|
|
4436
|
-
type: Component,
|
|
4437
|
-
args: [{ selector: 'mc-delete-icon', standalone: true, imports: [CommonModule], template: "<div class=\"mc-action-item\" [title]=\"title\">\r\n <svg\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <g\r\n id=\"codehub-delete-op\"\r\n stroke=\"none\"\r\n stroke-width=\"1\"\r\n fill=\"none\"\r\n fill-rule=\"evenodd\"\r\n >\r\n <path\r\n d=\"M12.5,5 C12.7761424,5 13,5.22385763 13,5.5 L13,13 C13,14.0543618 12.1841222,14.9181651 11.1492623,14.9945143 L11,15 L5,15 C3.9456382,15 3.08183488,14.1841222 3.00548574,13.1492623 L3,13 L3,5.5 C3,5.22385763 3.22385763,5 3.5,5 C3.77614237,5 4,5.22385763 4,5.5 L4,13 C4,13.5128358 4.38604019,13.9355072 4.88337887,13.9932723 L5,14 L11,14 C11.5128358,14 11.9355072,13.6139598 11.9932723,13.1166211 L12,13 L12,5.5 C12,5.22385763 12.2238576,5 12.5,5 Z M6.53333333,6 C6.79515721,6 7.0129156,6.17687516 7.05807395,6.41012437 L7.06666667,6.5 L7.06666667,11.5 C7.06666667,11.7761424 6.8278852,12 6.53333333,12 C6.27150945,12 6.05375107,11.8231248 6.00859271,11.5898756 L6,11.5 L6,6.5 C6,6.22385763 6.23878147,6 6.53333333,6 Z M9.53333333,6 C9.79515721,6 10.0129156,6.17687516 10.058074,6.41012437 L10.0666667,6.5 L10.0666667,11.5 C10.0666667,11.7761424 9.8278852,12 9.53333333,12 C9.27150945,12 9.05375107,11.8231248 9.00859271,11.5898756 L9,11.5 L9,6.5 C9,6.22385763 9.23878147,6 9.53333333,6 Z M10,1 C10.5128358,1 10.9355072,1.38604019 10.9932723,1.88337887 L11,2 L11,3 L14.5,3 C14.7761424,3 15,3.22385763 15,3.5 C15,3.77614237 14.7761424,4 14.5,4 L1.5,4 C1.22385763,4 1,3.77614237 1,3.5 C1,3.22385763 1.22385763,3 1.5,3 L5,3 L5,2 C5,1.48716416 5.38604019,1.06449284 5.88337887,1.00672773 L6,1 L10,1 Z M10,2 L6,2 L6,3 L10,3 L10,2 Z\"\r\n fill=\"currentColor\"\r\n ></path>\r\n </g>\r\n </svg>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}\n"] }]
|
|
4438
|
-
}], propDecorators: { width: [{
|
|
4439
|
-
type: Input
|
|
4440
|
-
}], height: [{
|
|
4441
|
-
type: Input
|
|
4442
|
-
}], isActive: [{
|
|
4443
|
-
type: Input
|
|
4444
|
-
}], title: [{
|
|
4445
|
-
type: Input
|
|
4446
|
-
}], text: [{
|
|
4447
|
-
type: Input
|
|
4448
|
-
}] } });
|
|
4449
|
-
|
|
4450
|
-
class DislikeIconComponent {
|
|
4451
|
-
constructor() {
|
|
4452
|
-
this.width = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
4453
|
-
this.height = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
4454
|
-
this.isActive = false;
|
|
4455
|
-
this.title = '';
|
|
4456
|
-
this.text = '';
|
|
4457
|
-
this.activeChange = new EventEmitter();
|
|
4458
|
-
this.active = this.isActive;
|
|
4728
|
+
lastMentionChar === MentionSeparator) {
|
|
4729
|
+
continue;
|
|
4730
|
+
}
|
|
4731
|
+
else {
|
|
4732
|
+
const searchValue = mentionStr.slice(trigger.length);
|
|
4733
|
+
return { trigger, triggerIndex, searchValue };
|
|
4734
|
+
}
|
|
4735
|
+
}
|
|
4736
|
+
return null;
|
|
4459
4737
|
}
|
|
4460
|
-
|
|
4461
|
-
|
|
4462
|
-
|
|
4738
|
+
// 处理箭头键
|
|
4739
|
+
handleArrowKey(direction) {
|
|
4740
|
+
let newIndex = (this.getCurrentActiveIndex() + direction) % this.props.optionsCount;
|
|
4741
|
+
if (newIndex < 0) {
|
|
4742
|
+
newIndex = this.props.optionsCount - 1;
|
|
4463
4743
|
}
|
|
4744
|
+
this._adapter.activeIndexChange(newIndex);
|
|
4464
4745
|
}
|
|
4465
|
-
|
|
4466
|
-
|
|
4467
|
-
|
|
4746
|
+
// 获取当前活动索引
|
|
4747
|
+
getCurrentActiveIndex() {
|
|
4748
|
+
// 默认返回0,实际实现可能需要根据adapter获取
|
|
4749
|
+
return 0;
|
|
4468
4750
|
}
|
|
4469
|
-
|
|
4470
|
-
|
|
4471
|
-
|
|
4472
|
-
|
|
4473
|
-
|
|
4474
|
-
|
|
4475
|
-
|
|
4476
|
-
|
|
4477
|
-
|
|
4478
|
-
|
|
4479
|
-
|
|
4480
|
-
|
|
4481
|
-
|
|
4482
|
-
|
|
4483
|
-
|
|
4484
|
-
|
|
4485
|
-
|
|
4486
|
-
type: Output
|
|
4487
|
-
}] } });
|
|
4488
|
-
|
|
4489
|
-
class LikeIconComponent {
|
|
4490
|
-
constructor() {
|
|
4491
|
-
this.width = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
4492
|
-
this.height = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
4493
|
-
this.isActive = false;
|
|
4494
|
-
this.title = '';
|
|
4495
|
-
this.text = '';
|
|
4496
|
-
this.activeChange = new EventEmitter();
|
|
4497
|
-
this.active = this.isActive;
|
|
4751
|
+
// 处理选择事件
|
|
4752
|
+
handleSelect() {
|
|
4753
|
+
if (!this.inputEl || this.currentTriggerIndex === -1)
|
|
4754
|
+
return;
|
|
4755
|
+
const value = this.inputEl.value;
|
|
4756
|
+
const beforeTrigger = value.substring(0, this.currentTriggerIndex);
|
|
4757
|
+
const afterCursor = value.substring(this.currentCursorIndex);
|
|
4758
|
+
// 这里需要根据实际选择的项进行替换,暂时使用示例实现
|
|
4759
|
+
const selectedValue = `${beforeTrigger}@selected ${afterCursor}`;
|
|
4760
|
+
this.inputEl.value = selectedValue;
|
|
4761
|
+
// 设置光标位置
|
|
4762
|
+
const newCursorPosition = beforeTrigger.length + '@selected '.length;
|
|
4763
|
+
this.inputEl.setSelectionRange(newCursorPosition, newCursorPosition);
|
|
4764
|
+
// 关闭选择面板
|
|
4765
|
+
this.resetMention();
|
|
4766
|
+
// 触发input事件以更新绑定值
|
|
4767
|
+
this.inputEl.dispatchEvent(new Event('input', { bubbles: true }));
|
|
4498
4768
|
}
|
|
4499
|
-
|
|
4500
|
-
|
|
4501
|
-
|
|
4502
|
-
|
|
4769
|
+
// 更新覆盖层位置
|
|
4770
|
+
updateOverlayPosition() {
|
|
4771
|
+
return new Promise((resolve) => {
|
|
4772
|
+
if (!this.originEl || !this.overlayEl) {
|
|
4773
|
+
resolve(undefined);
|
|
4774
|
+
return;
|
|
4775
|
+
}
|
|
4776
|
+
// 设置宽度
|
|
4777
|
+
if (this.props.fitHostWidth) {
|
|
4778
|
+
const originRect = this.originEl.getBoundingClientRect();
|
|
4779
|
+
this.overlayEl.style.width = `${originRect.width}px`;
|
|
4780
|
+
}
|
|
4781
|
+
else {
|
|
4782
|
+
this.overlayEl.style.width = '';
|
|
4783
|
+
}
|
|
4784
|
+
// 清理之前的autoUpdate
|
|
4785
|
+
if (this.autoUpdateCleanup) {
|
|
4786
|
+
this.autoUpdateCleanup();
|
|
4787
|
+
this.autoUpdateCleanup = null;
|
|
4788
|
+
}
|
|
4789
|
+
// 设置位置:使用@floating-ui/dom计算位置,与Vue版本保持一致
|
|
4790
|
+
computePosition(this.originEl, this.overlayEl, {
|
|
4791
|
+
strategy: 'fixed',
|
|
4792
|
+
placement: 'top-start',
|
|
4793
|
+
middleware: [offset(4)],
|
|
4794
|
+
}).then(({ x, y }) => {
|
|
4795
|
+
this.overlayEl.style.top = `${y}px`;
|
|
4796
|
+
this.overlayEl.style.left = `${x}px`;
|
|
4797
|
+
this.overlayEl.style.position = 'fixed';
|
|
4798
|
+
// 返回位置信息,用于Vue组件同步样式
|
|
4799
|
+
resolve({
|
|
4800
|
+
top: `${y}px`,
|
|
4801
|
+
left: `${x}px`,
|
|
4802
|
+
width: this.props.fitHostWidth ? `${this.originEl.getBoundingClientRect().width}px` : ''
|
|
4803
|
+
});
|
|
4804
|
+
// 设置autoUpdate,自动处理滚动、调整大小和视口变化事件
|
|
4805
|
+
this.autoUpdateCleanup = autoUpdate(this.originEl, this.overlayEl, () => {
|
|
4806
|
+
if (this.originEl && this.overlayEl) {
|
|
4807
|
+
// 当fitHostWidth为true时,更新宽度
|
|
4808
|
+
if (this.props.fitHostWidth) {
|
|
4809
|
+
const originRect = this.originEl.getBoundingClientRect();
|
|
4810
|
+
this.overlayEl.style.width = `${originRect.width}px`;
|
|
4811
|
+
}
|
|
4812
|
+
computePosition(this.originEl, this.overlayEl, {
|
|
4813
|
+
strategy: 'fixed',
|
|
4814
|
+
placement: 'top-start',
|
|
4815
|
+
middleware: [offset(4)],
|
|
4816
|
+
}).then(({ x, y }) => {
|
|
4817
|
+
this.overlayEl.style.top = `${y}px`;
|
|
4818
|
+
this.overlayEl.style.left = `${x}px`;
|
|
4819
|
+
});
|
|
4820
|
+
}
|
|
4821
|
+
}, {
|
|
4822
|
+
// 添加对视口变化的更全面监听,确保浏览器F12打开/关闭时位置能正确更新
|
|
4823
|
+
animationFrame: true,
|
|
4824
|
+
elementResize: true,
|
|
4825
|
+
ancestorScroll: true,
|
|
4826
|
+
ancestorResize: true,
|
|
4827
|
+
layoutShift: true
|
|
4828
|
+
});
|
|
4829
|
+
}).catch(() => {
|
|
4830
|
+
// 处理计算位置失败的情况
|
|
4831
|
+
resolve(undefined);
|
|
4832
|
+
});
|
|
4833
|
+
});
|
|
4503
4834
|
}
|
|
4504
|
-
|
|
4505
|
-
|
|
4506
|
-
this.
|
|
4835
|
+
// 获取当前搜索值
|
|
4836
|
+
getCurrentSearchValue() {
|
|
4837
|
+
return this.currentSearchValue;
|
|
4507
4838
|
}
|
|
4508
|
-
|
|
4509
|
-
|
|
4510
|
-
|
|
4511
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LikeIconComponent, decorators: [{
|
|
4512
|
-
type: Component,
|
|
4513
|
-
args: [{ selector: 'mc-like-icon', standalone: true, imports: [CommonModule], template: "<div\r\n class=\"mc-action-item\"\r\n [title]=\"title\"\r\n [class.mc-action-item-active]=\"active\"\r\n (click)=\"handleClick()\"\r\n>\r\n <svg\r\n *ngIf=\"active\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <desc>Created with Sketch.</desc>\r\n <path\r\n id=\"\u77E2\u91CF 1\"\r\n d=\"M2.60156 15.3369C1.76611 15.3369 1.08008 14.6974 1.00659 13.8811L1 13.7354L1 8.27185C1 7.43652 1.63965 6.75049 2.45581 6.67688L2.60156 6.67029L3.16675 6.67047C3.44287 6.67047 3.6665 6.89441 3.6665 7.17047L3.6665 14.8369C3.6665 15.113 3.44263 15.3369 3.1665 15.3369L2.60156 15.3369ZM5.6665 15.3369L11.552 15.3369L11.7861 15.3335C13.2422 15.2898 14.1792 14.8291 14.4907 13.8883C14.8108 12.9214 15.1758 11.3278 15.2917 10.0439L15.3098 9.82239L15.3308 9.41162L15.3345 9.20703C15.3438 7.59558 14.8638 6.59619 13.6501 6.59619L9.55591 6.59497L9.60107 6.45593C10.02 5.11914 10.1855 4.08948 10.0869 3.3446C9.89819 1.91724 8.75317 0.703491 7.67651 1.06421L7.55713 1.11084C7.11279 1.35046 6.85327 1.80383 6.70117 2.68347L6.54492 3.61523L6.4978 3.83044L6.43872 4.06409C6.37622 4.28845 6.30347 4.48523 6.21558 4.66223C5.91675 5.2644 5.51904 5.80194 5.021 6.27649C4.8042 6.48309 4.6665 6.76337 4.6665 7.06287L4.6665 14.3369C4.6665 14.8892 5.11426 15.3369 5.6665 15.3369Z\"\r\n fill-rule=\"evenodd\"\r\n fill=\"currentColor\"\r\n />\r\n </svg>\r\n <svg\r\n *ngIf=\"!active\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <g id=\"\u9875\u9762-1\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <path\r\n d=\"M11.55205,1 C13.14165,1 14.16285,1.458308 14.49075,2.448728 C14.81075,3.415528 15.17575,5.009158 15.29175,6.292968 L15.29175,6.292968 L15.30985,6.514648 L15.33085,6.925358 C15.38255,8.656368 14.91455,9.740718 13.65015,9.740718 L13.65015,9.740718 L9.55591,9.741028 L9.60108,9.881038 C10.02005,11.217788 10.18555,12.247488 10.08695,12.992388 C9.89815,14.419688 8.75318,15.633388 7.67652,15.272788 L7.67652,15.272788 L7.55713,15.226188 C7.03589,14.992888 6.86426,14.595988 6.70117,13.653488 L6.70117,13.653488 L6.54492,12.721688 L6.4978,12.506488 C6.4231,12.182088 6.33277,11.910688 6.21558,11.674688 C5.8313,10.900988 5.28443,10.233788 4.57056,9.670048 L4.57056,9.670048 L2.60156,9.670288 C1.71704,9.670288 1,8.953248 1,8.068728 L1,8.068728 L1,2.605228 C1,1.720708 1.71704,1.003601 2.60156,1.003601 L2.60156,1.003601 L4.83325,1 Z M11.55205,1.999998 L5.33301,1.999998 L5.33301,9.002988 L5.41699,9.071468 L5.6796615,9.30702243 C6.27568484,9.86814941 6.7534775,10.5097005 7.11109,11.230088 C7.23584,11.480988 7.33399,11.750888 7.4148,12.050988 L7.4148,12.050988 L7.50098,12.409088 L7.56079,12.715988 L7.69336,13.519388 L7.702515,13.5694255 L7.702515,13.5694255 L7.71167,13.617588 L7.76441,13.867488 L7.79384741,13.9820728 C7.85221673,14.1918227 7.90782571,14.2875166 7.96558,14.313488 C8.30152,14.463788 8.97461,13.775988 9.09571,12.861188 C9.17749,12.243388 9.00025,11.240388 8.55029,9.880678 C8.51196,9.764348 8.49854,9.641728 8.51099,9.520328 C8.55908,9.045288 8.98218,8.699098 9.45679,8.742858 L9.45679,8.742858 L13.65015,8.740718 L13.7287739,8.73472734 C14.2127395,8.6588777 14.42952,7.8633705 14.29595,6.382938 C14.18755,5.183288 13.83915,3.662168 13.54155,2.762938 L13.54155,2.762938 L13.50585,2.674618 L13.4594021,2.5911944 C13.216706,2.21352476 12.6088633,1.999998 11.55205,1.999998 L11.55205,1.999998 Z M4.33277,2.003598 L2.60156,2.003598 C2.26929,2.003598 2,2.272948 2,2.605228 L2,2.605228 L2,8.068668 L2.00781,8.166258 C2.05445,8.452148 2.30249,8.670288 2.60156,8.670288 L2.60156,8.670288 L4.33277,8.670598 L4.33277,2.003598 Z\"\r\n id=\"dislike\"\r\n fill=\"currentColor\"\r\n transform=\"translate(8.167337, 8.168474) scale(-1, 1) rotate(-180.000000) translate(-8.167337, -8.168474) \"\r\n ></path>\r\n </g>\r\n </svg>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}\n"] }]
|
|
4514
|
-
}], propDecorators: { width: [{
|
|
4515
|
-
type: Input
|
|
4516
|
-
}], height: [{
|
|
4517
|
-
type: Input
|
|
4518
|
-
}], isActive: [{
|
|
4519
|
-
type: Input
|
|
4520
|
-
}], title: [{
|
|
4521
|
-
type: Input
|
|
4522
|
-
}], text: [{
|
|
4523
|
-
type: Input
|
|
4524
|
-
}], activeChange: [{
|
|
4525
|
-
type: Output
|
|
4526
|
-
}] } });
|
|
4527
|
-
|
|
4528
|
-
class RefreshIconComponent {
|
|
4529
|
-
constructor() {
|
|
4530
|
-
this.width = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
4531
|
-
this.height = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
4532
|
-
this.isActive = false;
|
|
4533
|
-
this.title = '';
|
|
4534
|
-
this.text = '';
|
|
4839
|
+
// 获取当前触发词
|
|
4840
|
+
getCurrentTrigger() {
|
|
4841
|
+
return this.currentTrigger;
|
|
4535
4842
|
}
|
|
4536
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: RefreshIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4537
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: RefreshIconComponent, isStandalone: true, selector: "mc-refresh-icon", inputs: { width: "width", height: "height", isActive: "isActive", title: "title", text: "text" }, ngImport: i0, template: "<div class=\"mc-action-item\" [title]=\"title\">\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n >\r\n <g id=\"Re-generate\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <path\r\n d=\"M12.7143179,3.28587475 C13.981136,4.55339434 14.6666667,6.24406622 14.6666667,7.99999694 L14.6661599,8.02257215 C14.6655102,8.03703705 14.6642357,8.05147912 14.6623363,8.06585443 L14.6666667,7.99999694 C14.6666667,8.0371769 14.6626086,8.07340903 14.6549111,8.10827457 C14.6517992,8.1222052 14.6480389,8.13632563 14.6436512,8.15029154 C14.6390061,8.1651613 14.6336213,8.17980434 14.6275902,8.19410809 C14.6231995,8.20453649 14.6185439,8.21463293 14.613534,8.22459678 C14.6049463,8.24162018 14.5952425,8.2583947 14.5846307,8.27451859 C14.5792264,8.282804 14.5735765,8.29085725 14.5676615,8.2987751 C14.5571418,8.31280391 14.5460319,8.32617172 14.5342667,8.33892584 C14.5300122,8.343554 14.5251791,8.34859129 14.5202201,8.35355033 L14.5076464,8.36569453 C14.4940828,8.37834683 14.4798146,8.39025348 14.4649071,8.4013492 L14.5202201,8.35355033 C14.4937641,8.38000631 14.465081,8.40287777 14.4347743,8.42216473 C14.4224394,8.42996083 14.4098046,8.43724836 14.3968374,8.44398448 C14.3832773,8.45105337 14.3694473,8.45743098 14.3554103,8.46314429 C14.3412925,8.46891455 14.3266036,8.47413114 14.3116174,8.47866321 C14.2992824,8.48234275 14.2871467,8.4855024 14.2749295,8.48819956 C14.2606866,8.49139588 14.2459756,8.4939711 14.2310588,8.49588898 C14.2147923,8.49795142 14.1986607,8.49923861 14.1825093,8.49974745 L14.1666667,8.49999694 L14.1666667,8.49999694 L14.1394006,8.49925755 C14.1253117,8.49849283 14.1112491,8.49713493 14.0972533,8.49518384 L14.1666667,8.49999694 C14.1273209,8.49999694 14.0890366,8.49545228 14.05231,8.48685924 C14.0384692,8.48357481 14.0248075,8.47976105 14.0112962,8.4753569 C13.9958192,8.47034085 13.9804276,8.46445184 13.9654221,8.45784679 C13.9544183,8.45302561 13.9434536,8.44772707 13.9326545,8.4420051 C13.9165024,8.43339464 13.9009385,8.4240044 13.8859565,8.41382189 C13.8807017,8.41031248 13.8749119,8.40620635 13.8691922,8.40196243 L13.8550466,8.39103641 C13.8474863,8.38500359 13.8401047,8.3787561 13.8329113,8.37230316 L13.8131133,8.35355033 L12.6151133,7.15555033 C12.4198511,6.96028819 12.4198511,6.6437057 12.6151133,6.44844355 C12.7926243,6.27093251 13.0704001,6.25479514 13.2661411,6.40003145 L13.3222201,6.44844355 L13.498767,6.62598997 C13.2544588,5.64420827 12.7478288,4.73400934 12.0071133,3.99288367 C9.79437542,1.78014581 6.20562458,1.78014581 3.99288672,3.99288367 C1.78014071,6.20562968 1.78014071,9.79375159 3.99288672,12.0071102 C6.20562458,14.2198481 9.79437542,14.2198481 12.0071133,12.0071102 C12.2023754,11.8118481 12.5189579,11.8118481 12.7142201,12.0071102 C12.9094822,12.2023724 12.9094822,12.5189549 12.7142201,12.714217 C10.1109579,15.3174791 5.88904209,15.3174791 3.28573101,12.7141681 C0.682525952,10.1102423 0.682525952,5.88903088 3.28577994,3.28577688 C5.88904209,0.682514739 10.1109579,0.682514739 12.7143179,3.28587475 Z\"\r\n id=\"\u5F62\u72B6\u7ED3\u5408\"\r\n fill=\"currentColor\"\r\n />\r\n </g>\r\n </svg>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] }); }
|
|
4538
4843
|
}
|
|
4539
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: RefreshIconComponent, decorators: [{
|
|
4540
|
-
type: Component,
|
|
4541
|
-
args: [{ selector: 'mc-refresh-icon', standalone: true, imports: [CommonModule], template: "<div class=\"mc-action-item\" [title]=\"title\">\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n >\r\n <g id=\"Re-generate\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <path\r\n d=\"M12.7143179,3.28587475 C13.981136,4.55339434 14.6666667,6.24406622 14.6666667,7.99999694 L14.6661599,8.02257215 C14.6655102,8.03703705 14.6642357,8.05147912 14.6623363,8.06585443 L14.6666667,7.99999694 C14.6666667,8.0371769 14.6626086,8.07340903 14.6549111,8.10827457 C14.6517992,8.1222052 14.6480389,8.13632563 14.6436512,8.15029154 C14.6390061,8.1651613 14.6336213,8.17980434 14.6275902,8.19410809 C14.6231995,8.20453649 14.6185439,8.21463293 14.613534,8.22459678 C14.6049463,8.24162018 14.5952425,8.2583947 14.5846307,8.27451859 C14.5792264,8.282804 14.5735765,8.29085725 14.5676615,8.2987751 C14.5571418,8.31280391 14.5460319,8.32617172 14.5342667,8.33892584 C14.5300122,8.343554 14.5251791,8.34859129 14.5202201,8.35355033 L14.5076464,8.36569453 C14.4940828,8.37834683 14.4798146,8.39025348 14.4649071,8.4013492 L14.5202201,8.35355033 C14.4937641,8.38000631 14.465081,8.40287777 14.4347743,8.42216473 C14.4224394,8.42996083 14.4098046,8.43724836 14.3968374,8.44398448 C14.3832773,8.45105337 14.3694473,8.45743098 14.3554103,8.46314429 C14.3412925,8.46891455 14.3266036,8.47413114 14.3116174,8.47866321 C14.2992824,8.48234275 14.2871467,8.4855024 14.2749295,8.48819956 C14.2606866,8.49139588 14.2459756,8.4939711 14.2310588,8.49588898 C14.2147923,8.49795142 14.1986607,8.49923861 14.1825093,8.49974745 L14.1666667,8.49999694 L14.1666667,8.49999694 L14.1394006,8.49925755 C14.1253117,8.49849283 14.1112491,8.49713493 14.0972533,8.49518384 L14.1666667,8.49999694 C14.1273209,8.49999694 14.0890366,8.49545228 14.05231,8.48685924 C14.0384692,8.48357481 14.0248075,8.47976105 14.0112962,8.4753569 C13.9958192,8.47034085 13.9804276,8.46445184 13.9654221,8.45784679 C13.9544183,8.45302561 13.9434536,8.44772707 13.9326545,8.4420051 C13.9165024,8.43339464 13.9009385,8.4240044 13.8859565,8.41382189 C13.8807017,8.41031248 13.8749119,8.40620635 13.8691922,8.40196243 L13.8550466,8.39103641 C13.8474863,8.38500359 13.8401047,8.3787561 13.8329113,8.37230316 L13.8131133,8.35355033 L12.6151133,7.15555033 C12.4198511,6.96028819 12.4198511,6.6437057 12.6151133,6.44844355 C12.7926243,6.27093251 13.0704001,6.25479514 13.2661411,6.40003145 L13.3222201,6.44844355 L13.498767,6.62598997 C13.2544588,5.64420827 12.7478288,4.73400934 12.0071133,3.99288367 C9.79437542,1.78014581 6.20562458,1.78014581 3.99288672,3.99288367 C1.78014071,6.20562968 1.78014071,9.79375159 3.99288672,12.0071102 C6.20562458,14.2198481 9.79437542,14.2198481 12.0071133,12.0071102 C12.2023754,11.8118481 12.5189579,11.8118481 12.7142201,12.0071102 C12.9094822,12.2023724 12.9094822,12.5189549 12.7142201,12.714217 C10.1109579,15.3174791 5.88904209,15.3174791 3.28573101,12.7141681 C0.682525952,10.1102423 0.682525952,5.88903088 3.28577994,3.28577688 C5.88904209,0.682514739 10.1109579,0.682514739 12.7143179,3.28587475 Z\"\r\n id=\"\u5F62\u72B6\u7ED3\u5408\"\r\n fill=\"currentColor\"\r\n />\r\n </g>\r\n </svg>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}\n"] }]
|
|
4542
|
-
}], propDecorators: { width: [{
|
|
4543
|
-
type: Input
|
|
4544
|
-
}], height: [{
|
|
4545
|
-
type: Input
|
|
4546
|
-
}], isActive: [{
|
|
4547
|
-
type: Input
|
|
4548
|
-
}], title: [{
|
|
4549
|
-
type: Input
|
|
4550
|
-
}], text: [{
|
|
4551
|
-
type: Input
|
|
4552
|
-
}] } });
|
|
4553
4844
|
|
|
4554
|
-
class
|
|
4555
|
-
|
|
4556
|
-
this.
|
|
4557
|
-
|
|
4558
|
-
this.
|
|
4559
|
-
|
|
4560
|
-
|
|
4845
|
+
class MentionComponent extends BaseComponent {
|
|
4846
|
+
set optionsCount(val) {
|
|
4847
|
+
this._optionsCount = val;
|
|
4848
|
+
// 当optionsCount变化时,更新foundation的配置
|
|
4849
|
+
if (this.foundation) {
|
|
4850
|
+
this.foundation.updateOptions({ optionsCount: val });
|
|
4851
|
+
}
|
|
4852
|
+
}
|
|
4853
|
+
get optionsCount() {
|
|
4854
|
+
return this._optionsCount;
|
|
4561
4855
|
}
|
|
4562
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ShareIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4563
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: ShareIconComponent, isStandalone: true, selector: "mc-share-icon", inputs: { width: "width", height: "height", isActive: "isActive", title: "title", text: "text" }, ngImport: i0, template: "<div class=\"mc-action-item\" [title]=\"title\">\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n >\r\n <desc>Created with Sketch.</desc>\r\n <g id=\"\u91CA\u4E49\u56FE\u6807/\u5206\u4EAB\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <g id=\"\u5206\u4EAB\" fill=\"currentColor\" fill-rule=\"nonzero\">\r\n <path d=\"M6.3804718,9.82599637 C5.83206631,10.5398588 4.96976903,11 4,11 C2.34314575,11 1,9.65685425 1,8 C1,6.34314575 2.34314575,5 4,5 C4.96976903,5 5.83206631,5.46014123 6.3804718,6.17400363 L10.1006387,4.20450353 C10.0351367,3.98105658 10,3.7446316 10,3.5 C10,2.11928813 11.1192881,1 12.5,1 C13.8807119,1 15,2.11928813 15,3.5 C15,4.88071187 13.8807119,6 12.5,6 C11.7223166,6 11.0275695,5.64490757 10.5690501,5.08801416 L6.84895235,7.0574777 C6.94695785,7.35387727 7,7.67074431 7,8 C7,8.32925569 6.94695785,8.64612273 6.84895235,8.9425223 L10.5690501,10.9119858 C11.0275695,10.3550924 11.7223166,10 12.5,10 C13.8807119,10 15,11.1192881 15,12.5 C15,13.8807119 13.8807119,15 12.5,15 C11.1192881,15 10,13.8807119 10,12.5 C10,12.2553684 10.0351367,12.0189434 10.1006387,11.7954965 L6.3804718,9.82599637 L6.3804718,9.82599637 Z M4,10 C5.1045695,10 6,9.1045695 6,8 C6,6.8954305 5.1045695,6 4,6 C2.8954305,6 2,6.8954305 2,8 C2,9.1045695 2.8954305,10 4,10 Z M12.5,14 C13.3284271,14 14,13.3284271 14,12.5 C14,11.6715729 13.3284271,11 12.5,11 C11.6715729,11 11,11.6715729 11,12.5 C11,13.3284271 11.6715729,14 12.5,14 Z M12.5,5 C13.3284271,5 14,4.32842712 14,3.5 C14,2.67157288 13.3284271,2 12.5,2 C11.6715729,2 11,2.67157288 11,3.5 C11,4.32842712 11.6715729,5 12.5,5 Z\" id=\"\u5F62\u72B6\"/>\r\n </g>\r\n </g>\r\n </svg>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] }); }
|
|
4564
|
-
}
|
|
4565
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ShareIconComponent, decorators: [{
|
|
4566
|
-
type: Component,
|
|
4567
|
-
args: [{ selector: 'mc-share-icon', standalone: true, imports: [CommonModule], template: "<div class=\"mc-action-item\" [title]=\"title\">\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n >\r\n <desc>Created with Sketch.</desc>\r\n <g id=\"\u91CA\u4E49\u56FE\u6807/\u5206\u4EAB\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <g id=\"\u5206\u4EAB\" fill=\"currentColor\" fill-rule=\"nonzero\">\r\n <path d=\"M6.3804718,9.82599637 C5.83206631,10.5398588 4.96976903,11 4,11 C2.34314575,11 1,9.65685425 1,8 C1,6.34314575 2.34314575,5 4,5 C4.96976903,5 5.83206631,5.46014123 6.3804718,6.17400363 L10.1006387,4.20450353 C10.0351367,3.98105658 10,3.7446316 10,3.5 C10,2.11928813 11.1192881,1 12.5,1 C13.8807119,1 15,2.11928813 15,3.5 C15,4.88071187 13.8807119,6 12.5,6 C11.7223166,6 11.0275695,5.64490757 10.5690501,5.08801416 L6.84895235,7.0574777 C6.94695785,7.35387727 7,7.67074431 7,8 C7,8.32925569 6.94695785,8.64612273 6.84895235,8.9425223 L10.5690501,10.9119858 C11.0275695,10.3550924 11.7223166,10 12.5,10 C13.8807119,10 15,11.1192881 15,12.5 C15,13.8807119 13.8807119,15 12.5,15 C11.1192881,15 10,13.8807119 10,12.5 C10,12.2553684 10.0351367,12.0189434 10.1006387,11.7954965 L6.3804718,9.82599637 L6.3804718,9.82599637 Z M4,10 C5.1045695,10 6,9.1045695 6,8 C6,6.8954305 5.1045695,6 4,6 C2.8954305,6 2,6.8954305 2,8 C2,9.1045695 2.8954305,10 4,10 Z M12.5,14 C13.3284271,14 14,13.3284271 14,12.5 C14,11.6715729 13.3284271,11 12.5,11 C11.6715729,11 11,11.6715729 11,12.5 C11,13.3284271 11.6715729,14 12.5,14 Z M12.5,5 C13.3284271,5 14,4.32842712 14,3.5 C14,2.67157288 13.3284271,2 12.5,2 C11.6715729,2 11,2.67157288 11,3.5 C11,4.32842712 11.6715729,5 12.5,5 Z\" id=\"\u5F62\u72B6\"/>\r\n </g>\r\n </g>\r\n </svg>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}\n"] }]
|
|
4568
|
-
}], propDecorators: { width: [{
|
|
4569
|
-
type: Input
|
|
4570
|
-
}], height: [{
|
|
4571
|
-
type: Input
|
|
4572
|
-
}], isActive: [{
|
|
4573
|
-
type: Input
|
|
4574
|
-
}], title: [{
|
|
4575
|
-
type: Input
|
|
4576
|
-
}], text: [{
|
|
4577
|
-
type: Input
|
|
4578
|
-
}] } });
|
|
4579
|
-
|
|
4580
|
-
var ToolbarAction;
|
|
4581
|
-
(function (ToolbarAction) {
|
|
4582
|
-
ToolbarAction["COPY"] = "copy";
|
|
4583
|
-
ToolbarAction["LIKE"] = "like";
|
|
4584
|
-
ToolbarAction["DISLIKE"] = "dislike";
|
|
4585
|
-
ToolbarAction["REFRESH"] = "refresh";
|
|
4586
|
-
ToolbarAction["SHARE"] = "share";
|
|
4587
|
-
ToolbarAction["DELETE"] = "delete";
|
|
4588
|
-
})(ToolbarAction || (ToolbarAction = {}));
|
|
4589
|
-
|
|
4590
|
-
class ToolbarComponent {
|
|
4591
4856
|
constructor() {
|
|
4592
|
-
|
|
4593
|
-
this.
|
|
4594
|
-
this.
|
|
4595
|
-
|
|
4596
|
-
|
|
4597
|
-
this.
|
|
4598
|
-
|
|
4599
|
-
this.
|
|
4600
|
-
//
|
|
4601
|
-
this.
|
|
4602
|
-
|
|
4857
|
+
super();
|
|
4858
|
+
this.prefix = ['@'];
|
|
4859
|
+
this.fitHostWidth = true;
|
|
4860
|
+
// 选项数量,用于键盘导航
|
|
4861
|
+
this._optionsCount = 0;
|
|
4862
|
+
this.updateModelValue = new EventEmitter();
|
|
4863
|
+
this.searchChange = new EventEmitter();
|
|
4864
|
+
this.toggleChange = new EventEmitter();
|
|
4865
|
+
// 当前选中索引变化事件
|
|
4866
|
+
this.activeIndexChange = new EventEmitter();
|
|
4867
|
+
// 当前选中的索引
|
|
4868
|
+
this.activeIndex = -1;
|
|
4869
|
+
this.overlayStyle = { top: '0px', left: '0px', width: '' };
|
|
4870
|
+
this.inputEl = null;
|
|
4871
|
+
// 私有属性存储实际的modelValue
|
|
4872
|
+
this._modelValue = false;
|
|
4873
|
+
// ControlValueAccessor 接口实现
|
|
4874
|
+
this.onChange = () => { };
|
|
4875
|
+
this.onTouched = () => { };
|
|
4876
|
+
// 处理文档点击事件,点击外部关闭Mention面板
|
|
4877
|
+
this.onDocumentClick = (e) => {
|
|
4878
|
+
if (this.originEl && this.originEl.nativeElement && this.modelValue) {
|
|
4879
|
+
if (!this.originEl.nativeElement.contains(e.target)) {
|
|
4880
|
+
this.foundation.resetMention();
|
|
4881
|
+
}
|
|
4882
|
+
}
|
|
4883
|
+
};
|
|
4603
4884
|
}
|
|
4604
4885
|
ngOnInit() {
|
|
4605
|
-
|
|
4606
|
-
this.actionItems = this.items?.map((item) => ({ ...item }));
|
|
4607
|
-
// 初始化点赞/点踩互斥
|
|
4608
|
-
this.init();
|
|
4609
|
-
}
|
|
4610
|
-
ngAfterContentInit() {
|
|
4611
|
-
// 初始化阶段:解析所有模板的变量名,构建映射关系
|
|
4612
|
-
this.allTemplates.forEach((template) => {
|
|
4613
|
-
// 通过模板的 nativeElement 获取其变量名(#xxx 中的 xxx)
|
|
4614
|
-
const templateName = template._declarationTContainer?.localNames?.[0];
|
|
4615
|
-
if (templateName) {
|
|
4616
|
-
this.CustomSlotComponent[templateName] = template;
|
|
4617
|
-
}
|
|
4618
|
-
});
|
|
4619
|
-
console.log('ngAfterContentInit', this.CustomSlotComponent);
|
|
4886
|
+
this.foundation = new MentionFoundation(this.adapter);
|
|
4620
4887
|
}
|
|
4621
|
-
|
|
4622
|
-
return
|
|
4888
|
+
get adapter() {
|
|
4889
|
+
return {
|
|
4890
|
+
...super.adapter,
|
|
4891
|
+
updateModelValue: (val) => {
|
|
4892
|
+
// 调用modelValue的setter方法,确保位置更新逻辑被执行
|
|
4893
|
+
this.modelValue = val;
|
|
4894
|
+
},
|
|
4895
|
+
searchChange: (event) => this.searchChange.emit(event),
|
|
4896
|
+
activeIndexChange: (index) => {
|
|
4897
|
+
this.activeIndex = index;
|
|
4898
|
+
this.activeIndexChange.emit(index);
|
|
4899
|
+
},
|
|
4900
|
+
toggleChange: (val) => this.toggleChange.emit(val)
|
|
4901
|
+
};
|
|
4623
4902
|
}
|
|
4624
|
-
|
|
4625
|
-
|
|
4626
|
-
|
|
4627
|
-
|
|
4628
|
-
|
|
4629
|
-
dislikeAction.isActive = false;
|
|
4903
|
+
ngAfterViewInit() {
|
|
4904
|
+
// 添加安全检查 - 仅检查必要元素,overlayEl有*ngIf条件可能不会立即渲染
|
|
4905
|
+
if (!this.popperTriggerEl || !this.originEl) {
|
|
4906
|
+
console.error('ViewChild elements not found');
|
|
4907
|
+
return;
|
|
4630
4908
|
}
|
|
4631
|
-
|
|
4632
|
-
|
|
4633
|
-
|
|
4634
|
-
|
|
4635
|
-
|
|
4636
|
-
dislikeAction.isActive = false;
|
|
4909
|
+
const hostElement = this.popperTriggerEl.nativeElement;
|
|
4910
|
+
let foundInputEl = null;
|
|
4911
|
+
// 检查hostElement本身是否是输入元素
|
|
4912
|
+
if (hostElement.tagName === 'TEXTAREA' || hostElement.tagName === 'INPUT') {
|
|
4913
|
+
foundInputEl = hostElement;
|
|
4637
4914
|
}
|
|
4638
|
-
|
|
4639
|
-
|
|
4640
|
-
|
|
4641
|
-
|
|
4642
|
-
|
|
4643
|
-
|
|
4915
|
+
else {
|
|
4916
|
+
// 先查找mc-input组件
|
|
4917
|
+
const mcInputComponent = hostElement.querySelector('mc-input');
|
|
4918
|
+
if (mcInputComponent) {
|
|
4919
|
+
// 如果找到mc-input组件,查找其内部的textarea元素
|
|
4920
|
+
foundInputEl = mcInputComponent.querySelector('textarea');
|
|
4921
|
+
}
|
|
4922
|
+
else {
|
|
4923
|
+
// 否则在hostElement内部查找原生输入元素
|
|
4924
|
+
foundInputEl = hostElement.querySelector('textarea') || hostElement.querySelector('input');
|
|
4925
|
+
}
|
|
4644
4926
|
}
|
|
4645
|
-
|
|
4646
|
-
|
|
4647
|
-
|
|
4648
|
-
// 处理点赞/点踩互斥
|
|
4649
|
-
if (actionItem.icon === ToolbarAction.LIKE) {
|
|
4650
|
-
this.handleLikeClick();
|
|
4927
|
+
if (!foundInputEl) {
|
|
4928
|
+
console.error('Input/Textarea element not found in Mention component');
|
|
4929
|
+
return;
|
|
4651
4930
|
}
|
|
4652
|
-
|
|
4653
|
-
|
|
4931
|
+
// 初始化foundation的元素
|
|
4932
|
+
this.inputEl = foundInputEl;
|
|
4933
|
+
this.foundation.setInputEl(this.inputEl);
|
|
4934
|
+
this.foundation.setOriginEl(this.originEl.nativeElement);
|
|
4935
|
+
// 仅在overlayEl存在时设置,否则Foundation会在需要时处理
|
|
4936
|
+
if (this.overlayEl) {
|
|
4937
|
+
this.foundation.setOverlayEl(this.overlayEl.nativeElement);
|
|
4654
4938
|
}
|
|
4655
|
-
|
|
4656
|
-
|
|
4657
|
-
|
|
4658
|
-
|
|
4939
|
+
// 初始化事件
|
|
4940
|
+
this.foundation.initEvents();
|
|
4941
|
+
}
|
|
4942
|
+
ngOnDestroy() {
|
|
4943
|
+
this.cleanupDocumentClick();
|
|
4944
|
+
// 清理Foundation资源
|
|
4945
|
+
this.foundation.destroy();
|
|
4946
|
+
super.ngOnDestroy();
|
|
4947
|
+
}
|
|
4948
|
+
// 监听modelValue变化,更新overlay位置
|
|
4949
|
+
set modelValue(val) {
|
|
4950
|
+
if (this._modelValue !== val) {
|
|
4951
|
+
this._modelValue = val;
|
|
4952
|
+
// 当显示Mention面板时,确保overlay元素已传递给foundation并更新位置
|
|
4953
|
+
if (val && this.foundation) {
|
|
4954
|
+
// 使用setTimeout确保overlayEl已经渲染完成
|
|
4955
|
+
setTimeout(() => {
|
|
4956
|
+
// 检查overlayEl是否可用,如果可用则传递给foundation
|
|
4957
|
+
if (this.overlayEl) {
|
|
4958
|
+
this.foundation.setOverlayEl(this.overlayEl.nativeElement);
|
|
4959
|
+
// 获取位置信息并更新组件样式
|
|
4960
|
+
const positionInfo = this.foundation.updateOverlayPosition();
|
|
4961
|
+
if (positionInfo instanceof Promise) {
|
|
4962
|
+
positionInfo.then(pos => {
|
|
4963
|
+
if (pos) {
|
|
4964
|
+
this.overlayStyle = pos;
|
|
4965
|
+
}
|
|
4966
|
+
});
|
|
4967
|
+
}
|
|
4968
|
+
else if (positionInfo) {
|
|
4969
|
+
this.overlayStyle = positionInfo;
|
|
4970
|
+
}
|
|
4971
|
+
}
|
|
4972
|
+
}, 0);
|
|
4973
|
+
}
|
|
4974
|
+
// 调用onChange回调,支持ngModel双向绑定
|
|
4975
|
+
this.onChange(val);
|
|
4976
|
+
// 仍然触发updateModelValue事件,保持向后兼容
|
|
4977
|
+
this.updateModelValue.emit(val);
|
|
4659
4978
|
}
|
|
4660
|
-
// 触发组件输出事件
|
|
4661
|
-
this.onClick.emit({ item: actionItem, event });
|
|
4662
4979
|
}
|
|
4663
|
-
|
|
4664
|
-
|
|
4665
|
-
actionItem.isActive = isActive;
|
|
4980
|
+
get modelValue() {
|
|
4981
|
+
return this._modelValue;
|
|
4666
4982
|
}
|
|
4667
|
-
|
|
4668
|
-
|
|
4983
|
+
writeValue(value) {
|
|
4984
|
+
this.modelValue = value;
|
|
4985
|
+
}
|
|
4986
|
+
registerOnChange(fn) {
|
|
4987
|
+
this.onChange = fn;
|
|
4988
|
+
}
|
|
4989
|
+
registerOnTouched(fn) {
|
|
4990
|
+
this.onTouched = fn;
|
|
4991
|
+
}
|
|
4992
|
+
setDisabledState(isDisabled) {
|
|
4993
|
+
// 如果需要禁用功能,可以在这里实现
|
|
4994
|
+
}
|
|
4995
|
+
// 初始化文档点击事件(已在ngAfterViewInit中处理,无需重复)
|
|
4996
|
+
ngAfterContentInit() {
|
|
4997
|
+
}
|
|
4998
|
+
// 清理文档点击事件
|
|
4999
|
+
cleanupDocumentClick() {
|
|
5000
|
+
document.removeEventListener('click', this.onDocumentClick);
|
|
5001
|
+
}
|
|
5002
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: MentionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5003
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: MentionComponent, isStandalone: true, selector: "mc-mention", inputs: { prefix: "prefix", fitHostWidth: "fitHostWidth", menuClass: "menuClass", optionsCount: "optionsCount", modelValue: "modelValue" }, outputs: { updateModelValue: "updateModelValue", searchChange: "searchChange", toggleChange: "toggleChange", activeIndexChange: "activeIndexChange" }, providers: [
|
|
5004
|
+
{
|
|
5005
|
+
provide: NG_VALUE_ACCESSOR,
|
|
5006
|
+
useExisting: forwardRef(() => MentionComponent),
|
|
5007
|
+
multi: true
|
|
5008
|
+
}
|
|
5009
|
+
], viewQueries: [{ propertyName: "popperTriggerEl", first: true, predicate: ["popperTrigger"], descendants: true }, { propertyName: "originEl", first: true, predicate: ["origin"], descendants: true }, { propertyName: "overlayEl", first: true, predicate: ["overlayEl"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<!-- Mention\u7EC4\u4EF6\u7684\u6A21\u677F -->\r\n\r\n<!-- \u89E6\u53D1\u5668\u5143\u7D20 -->\r\n<div #popperTrigger #origin class=\"mc-mention-trigger\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n<!-- \u63D0\u53CA\u83DC\u5355\u7684\u5F39\u51FA\u5C42 -->\r\n<div \r\n #overlayEl \r\n *ngIf=\"modelValue\" \r\n [@fade]\r\n class=\"mc-mention mc-mention-fade\" \r\n [ngClass]=\"menuClass\" \r\n [ngStyle]=\"overlayStyle\"\r\n>\r\n <ng-content select=\"[slot=menu]\"></ng-content>\r\n</div>", styles: [".mc-mention{position:fixed;max-height:300px;border-radius:var(--devui-border-radius, 2px);background-color:var(--devui-connected-overlay-bg, #ffffff);box-shadow:var(--devui-shadow-length-connected-overlay, 0 2px 12px 0) var(--devui-shadow, rgba(37, 43, 58, .24));transform-origin:0% 100%;z-index:1000}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }], animations: [
|
|
5010
|
+
trigger('fade', [
|
|
5011
|
+
transition(':enter', [
|
|
5012
|
+
style({ opacity: 0.8, transform: 'scaleY(0.8) translateY(4px)' }),
|
|
5013
|
+
animate('0.2s cubic-bezier(0.16, 0.75, 0.5, 1)', style({ opacity: 1, transform: 'scaleY(0.9999) translateY(0)' }))
|
|
5014
|
+
]),
|
|
5015
|
+
transition(':leave', [
|
|
5016
|
+
style({ opacity: 1, transform: 'scaleY(0.9999) translateY(0)' }),
|
|
5017
|
+
animate('0.2s cubic-bezier(0.5, 0, 0.84, 0.25)', style({ opacity: 0.8, transform: 'scaleY(0.8) translateY(4px)' }))
|
|
5018
|
+
])
|
|
5019
|
+
])
|
|
5020
|
+
] }); }
|
|
4669
5021
|
}
|
|
4670
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type:
|
|
5022
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: MentionComponent, decorators: [{
|
|
4671
5023
|
type: Component,
|
|
4672
|
-
args: [{ selector: 'mc-
|
|
4673
|
-
|
|
4674
|
-
|
|
4675
|
-
|
|
4676
|
-
|
|
4677
|
-
|
|
4678
|
-
|
|
4679
|
-
|
|
4680
|
-
|
|
4681
|
-
|
|
5024
|
+
args: [{ selector: 'mc-mention', standalone: true, imports: [CommonModule, FormsModule], animations: [
|
|
5025
|
+
trigger('fade', [
|
|
5026
|
+
transition(':enter', [
|
|
5027
|
+
style({ opacity: 0.8, transform: 'scaleY(0.8) translateY(4px)' }),
|
|
5028
|
+
animate('0.2s cubic-bezier(0.16, 0.75, 0.5, 1)', style({ opacity: 1, transform: 'scaleY(0.9999) translateY(0)' }))
|
|
5029
|
+
]),
|
|
5030
|
+
transition(':leave', [
|
|
5031
|
+
style({ opacity: 1, transform: 'scaleY(0.9999) translateY(0)' }),
|
|
5032
|
+
animate('0.2s cubic-bezier(0.5, 0, 0.84, 0.25)', style({ opacity: 0.8, transform: 'scaleY(0.8) translateY(4px)' }))
|
|
5033
|
+
])
|
|
5034
|
+
])
|
|
5035
|
+
], providers: [
|
|
5036
|
+
{
|
|
5037
|
+
provide: NG_VALUE_ACCESSOR,
|
|
5038
|
+
useExisting: forwardRef(() => MentionComponent),
|
|
5039
|
+
multi: true
|
|
5040
|
+
}
|
|
5041
|
+
], template: "<!-- Mention\u7EC4\u4EF6\u7684\u6A21\u677F -->\r\n\r\n<!-- \u89E6\u53D1\u5668\u5143\u7D20 -->\r\n<div #popperTrigger #origin class=\"mc-mention-trigger\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n<!-- \u63D0\u53CA\u83DC\u5355\u7684\u5F39\u51FA\u5C42 -->\r\n<div \r\n #overlayEl \r\n *ngIf=\"modelValue\" \r\n [@fade]\r\n class=\"mc-mention mc-mention-fade\" \r\n [ngClass]=\"menuClass\" \r\n [ngStyle]=\"overlayStyle\"\r\n>\r\n <ng-content select=\"[slot=menu]\"></ng-content>\r\n</div>", styles: [".mc-mention{position:fixed;max-height:300px;border-radius:var(--devui-border-radius, 2px);background-color:var(--devui-connected-overlay-bg, #ffffff);box-shadow:var(--devui-shadow-length-connected-overlay, 0 2px 12px 0) var(--devui-shadow, rgba(37, 43, 58, .24));transform-origin:0% 100%;z-index:1000}\n"] }]
|
|
5042
|
+
}], ctorParameters: () => [], propDecorators: { prefix: [{
|
|
4682
5043
|
type: Input
|
|
4683
|
-
}],
|
|
5044
|
+
}], fitHostWidth: [{
|
|
4684
5045
|
type: Input
|
|
4685
|
-
}],
|
|
5046
|
+
}], menuClass: [{
|
|
4686
5047
|
type: Input
|
|
4687
|
-
}],
|
|
5048
|
+
}], optionsCount: [{
|
|
5049
|
+
type: Input
|
|
5050
|
+
}], updateModelValue: [{
|
|
4688
5051
|
type: Output
|
|
4689
|
-
}],
|
|
4690
|
-
type:
|
|
4691
|
-
|
|
5052
|
+
}], searchChange: [{
|
|
5053
|
+
type: Output
|
|
5054
|
+
}], toggleChange: [{
|
|
5055
|
+
type: Output
|
|
5056
|
+
}], activeIndexChange: [{
|
|
5057
|
+
type: Output
|
|
5058
|
+
}], popperTriggerEl: [{
|
|
5059
|
+
type: ViewChild,
|
|
5060
|
+
args: ['popperTrigger']
|
|
5061
|
+
}], originEl: [{
|
|
5062
|
+
type: ViewChild,
|
|
5063
|
+
args: ['origin']
|
|
5064
|
+
}], overlayEl: [{
|
|
5065
|
+
type: ViewChild,
|
|
5066
|
+
args: ['overlayEl']
|
|
5067
|
+
}], modelValue: [{
|
|
5068
|
+
type: Input
|
|
4692
5069
|
}] } });
|
|
4693
5070
|
|
|
4694
|
-
class
|
|
4695
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type:
|
|
4696
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.10", ngImport: i0, type:
|
|
4697
|
-
|
|
4698
|
-
|
|
4699
|
-
|
|
4700
|
-
RefreshIconComponent,
|
|
4701
|
-
ShareIconComponent,
|
|
4702
|
-
LikeIconComponent,
|
|
4703
|
-
DislikeIconComponent], exports: [ToolbarComponent,
|
|
4704
|
-
CopyIconComponent,
|
|
4705
|
-
DeleteIconComponent,
|
|
4706
|
-
RefreshIconComponent,
|
|
4707
|
-
ShareIconComponent,
|
|
4708
|
-
LikeIconComponent,
|
|
4709
|
-
DislikeIconComponent] }); }
|
|
4710
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ToolbarModule, imports: [CommonModule,
|
|
4711
|
-
ToolbarComponent,
|
|
4712
|
-
CopyIconComponent,
|
|
4713
|
-
DeleteIconComponent,
|
|
4714
|
-
RefreshIconComponent,
|
|
4715
|
-
ShareIconComponent,
|
|
4716
|
-
LikeIconComponent,
|
|
4717
|
-
DislikeIconComponent] }); }
|
|
5071
|
+
class MentionModule {
|
|
5072
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: MentionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
5073
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.10", ngImport: i0, type: MentionModule, imports: [CommonModule,
|
|
5074
|
+
MentionComponent], exports: [MentionComponent] }); }
|
|
5075
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: MentionModule, imports: [CommonModule,
|
|
5076
|
+
MentionComponent] }); }
|
|
4718
5077
|
}
|
|
4719
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type:
|
|
5078
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: MentionModule, decorators: [{
|
|
4720
5079
|
type: NgModule,
|
|
4721
5080
|
args: [{
|
|
4722
5081
|
declarations: [],
|
|
4723
5082
|
imports: [
|
|
4724
5083
|
CommonModule,
|
|
4725
|
-
|
|
4726
|
-
CopyIconComponent,
|
|
4727
|
-
DeleteIconComponent,
|
|
4728
|
-
RefreshIconComponent,
|
|
4729
|
-
ShareIconComponent,
|
|
4730
|
-
LikeIconComponent,
|
|
4731
|
-
DislikeIconComponent,
|
|
4732
|
-
],
|
|
4733
|
-
exports: [
|
|
4734
|
-
ToolbarComponent,
|
|
4735
|
-
CopyIconComponent,
|
|
4736
|
-
DeleteIconComponent,
|
|
4737
|
-
RefreshIconComponent,
|
|
4738
|
-
ShareIconComponent,
|
|
4739
|
-
LikeIconComponent,
|
|
4740
|
-
DislikeIconComponent,
|
|
5084
|
+
MentionComponent
|
|
4741
5085
|
],
|
|
5086
|
+
exports: [MentionComponent],
|
|
4742
5087
|
}]
|
|
4743
5088
|
}] });
|
|
4744
5089
|
|
|
5090
|
+
// Mention组件的导出文件
|
|
5091
|
+
|
|
4745
5092
|
class PromptFoundation extends BaseFoundation {
|
|
4746
5093
|
constructor(adapter) {
|
|
4747
5094
|
super({ ...adapter });
|
|
@@ -4863,343 +5210,483 @@ class PromptItemComponent extends BaseComponent {
|
|
|
4863
5210
|
}),
|
|
4864
5211
|
};
|
|
4865
5212
|
}
|
|
4866
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: PromptItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4867
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: PromptItemComponent, isStandalone: true, selector: "mc-prompt-item", inputs: { prompt: "prompt" }, usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"prompt\" class=\"mc-prompt-item\">\r\n <div class=\"mc-prompt-item-icon\" [ngClass]=\"{ 'no-description': !prompt.desc }\">\r\n <mc-prompt-icon\r\n *ngIf=\"prompt.iconConfig\"\r\n [name]=\"prompt.iconConfig.name\"\r\n [color]=\"prompt.iconConfig.color\"\r\n [size]=\"prompt.iconConfig.size\"\r\n [component]=\"prompt.iconConfig.component\"\r\n />\r\n </div>\r\n <div *ngIf=\"prompt.label || prompt.desc\" class=\"mc-prompt-item-content\">\r\n <div *ngIf=\"prompt.label\" class=\"mc-prompt-item-label\">{{ prompt.label }}</div>\r\n <div *ngIf=\"prompt.desc\" class=\"mc-prompt-item-description\">{{ prompt.desc }}</div>\r\n </div>\r\n</div>\r\n", styles: [".mc-prompt-item{display:flex;gap:8px}.mc-prompt-item .mc-prompt-item-icon.no-description{display:flex;align-items:center}.mc-prompt-item .mc-prompt-item-content{display:flex;flex-direction:column;gap:4px}.mc-prompt-item .mc-prompt-item-content .mc-prompt-item-label{font-weight:700}.mc-prompt-item .mc-prompt-item-content .mc-prompt-item-description{color:var(--devui-aide-text, #71757f)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PromptIconComponent, selector: "mc-prompt-icon", inputs: ["name", "color", "size", "component"] }] }); }
|
|
5213
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: PromptItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5214
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: PromptItemComponent, isStandalone: true, selector: "mc-prompt-item", inputs: { prompt: "prompt" }, usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"prompt\" class=\"mc-prompt-item\">\r\n <div class=\"mc-prompt-item-icon\" [ngClass]=\"{ 'no-description': !prompt.desc }\">\r\n <mc-prompt-icon\r\n *ngIf=\"prompt.iconConfig\"\r\n [name]=\"prompt.iconConfig.name\"\r\n [color]=\"prompt.iconConfig.color\"\r\n [size]=\"prompt.iconConfig.size\"\r\n [component]=\"prompt.iconConfig.component\"\r\n />\r\n </div>\r\n <div *ngIf=\"prompt.label || prompt.desc\" class=\"mc-prompt-item-content\">\r\n <div *ngIf=\"prompt.label\" class=\"mc-prompt-item-label\">{{ prompt.label }}</div>\r\n <div *ngIf=\"prompt.desc\" class=\"mc-prompt-item-description\">{{ prompt.desc }}</div>\r\n </div>\r\n</div>\r\n", styles: [".mc-prompt-item{display:flex;gap:8px}.mc-prompt-item .mc-prompt-item-icon.no-description{display:flex;align-items:center}.mc-prompt-item .mc-prompt-item-content{display:flex;flex-direction:column;gap:4px}.mc-prompt-item .mc-prompt-item-content .mc-prompt-item-label{font-weight:700}.mc-prompt-item .mc-prompt-item-content .mc-prompt-item-description{color:var(--devui-aide-text, #71757f)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PromptIconComponent, selector: "mc-prompt-icon", inputs: ["name", "color", "size", "component"] }] }); }
|
|
5215
|
+
}
|
|
5216
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: PromptItemComponent, decorators: [{
|
|
5217
|
+
type: Component,
|
|
5218
|
+
args: [{ selector: 'mc-prompt-item', standalone: true, imports: [CommonModule, PromptIconComponent], template: "<div *ngIf=\"prompt\" class=\"mc-prompt-item\">\r\n <div class=\"mc-prompt-item-icon\" [ngClass]=\"{ 'no-description': !prompt.desc }\">\r\n <mc-prompt-icon\r\n *ngIf=\"prompt.iconConfig\"\r\n [name]=\"prompt.iconConfig.name\"\r\n [color]=\"prompt.iconConfig.color\"\r\n [size]=\"prompt.iconConfig.size\"\r\n [component]=\"prompt.iconConfig.component\"\r\n />\r\n </div>\r\n <div *ngIf=\"prompt.label || prompt.desc\" class=\"mc-prompt-item-content\">\r\n <div *ngIf=\"prompt.label\" class=\"mc-prompt-item-label\">{{ prompt.label }}</div>\r\n <div *ngIf=\"prompt.desc\" class=\"mc-prompt-item-description\">{{ prompt.desc }}</div>\r\n </div>\r\n</div>\r\n", styles: [".mc-prompt-item{display:flex;gap:8px}.mc-prompt-item .mc-prompt-item-icon.no-description{display:flex;align-items:center}.mc-prompt-item .mc-prompt-item-content{display:flex;flex-direction:column;gap:4px}.mc-prompt-item .mc-prompt-item-content .mc-prompt-item-label{font-weight:700}.mc-prompt-item .mc-prompt-item-content .mc-prompt-item-description{color:var(--devui-aide-text, #71757f)}\n"] }]
|
|
5219
|
+
}], ctorParameters: () => [], propDecorators: { prompt: [{
|
|
5220
|
+
type: Input
|
|
5221
|
+
}] } });
|
|
5222
|
+
|
|
5223
|
+
class PromptComponent extends BaseComponent {
|
|
5224
|
+
constructor() {
|
|
5225
|
+
super();
|
|
5226
|
+
// 组件属性
|
|
5227
|
+
this.direction = ListDirection.Vertical;
|
|
5228
|
+
this.list = [];
|
|
5229
|
+
this.variant = ListVariant.Filled;
|
|
5230
|
+
this.itemClick = new EventEmitter();
|
|
5231
|
+
}
|
|
5232
|
+
ngOnInit() {
|
|
5233
|
+
this.foundation = new PromptFoundation(this.adapter);
|
|
5234
|
+
this.foundation.init();
|
|
5235
|
+
}
|
|
5236
|
+
get adapter() {
|
|
5237
|
+
return {
|
|
5238
|
+
...super.adapter,
|
|
5239
|
+
getProps: () => ({
|
|
5240
|
+
direction: this.direction,
|
|
5241
|
+
list: this.list,
|
|
5242
|
+
variant: this.variant,
|
|
5243
|
+
}),
|
|
5244
|
+
};
|
|
5245
|
+
}
|
|
5246
|
+
handleItemClick(item) {
|
|
5247
|
+
this.itemClick.emit(item);
|
|
5248
|
+
}
|
|
5249
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: PromptComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5250
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: PromptComponent, isStandalone: true, selector: "mc-prompt", inputs: { direction: "direction", list: "list", variant: "variant" }, outputs: { itemClick: "itemClick" }, usesInheritance: true, ngImport: i0, template: "<div class=\"mc-prompt\">\r\n <mc-list [data]=\"list\" [direction]=\"direction\" [variant]=\"variant\" [selectable]=\"false\">\r\n <ng-template #item let-item>\r\n <mc-prompt-item\r\n [prompt]=\"item\"\r\n (click)=\"handleItemClick(item)\"\r\n ></mc-prompt-item>\r\n </ng-template>\r\n </mc-list>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ListModule }, { kind: "component", type: ListComponent, selector: "mc-list", inputs: ["direction", "autoWrap", "variant", "enableLazyLoad", "enableShortKey", "data", "inputEl", "selectable", "preSelectIndex"], outputs: ["loadMore", "select"] }, { kind: "component", type: PromptItemComponent, selector: "mc-prompt-item", inputs: ["prompt"] }] }); }
|
|
5251
|
+
}
|
|
5252
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: PromptComponent, decorators: [{
|
|
5253
|
+
type: Component,
|
|
5254
|
+
args: [{ selector: 'mc-prompt', standalone: true, imports: [CommonModule, ListModule, PromptItemComponent], template: "<div class=\"mc-prompt\">\r\n <mc-list [data]=\"list\" [direction]=\"direction\" [variant]=\"variant\" [selectable]=\"false\">\r\n <ng-template #item let-item>\r\n <mc-prompt-item\r\n [prompt]=\"item\"\r\n (click)=\"handleItemClick(item)\"\r\n ></mc-prompt-item>\r\n </ng-template>\r\n </mc-list>\r\n</div>\r\n" }]
|
|
5255
|
+
}], ctorParameters: () => [], propDecorators: { direction: [{
|
|
5256
|
+
type: Input
|
|
5257
|
+
}], list: [{
|
|
5258
|
+
type: Input
|
|
5259
|
+
}], variant: [{
|
|
5260
|
+
type: Input
|
|
5261
|
+
}], itemClick: [{
|
|
5262
|
+
type: Output
|
|
5263
|
+
}] } });
|
|
5264
|
+
|
|
5265
|
+
class PromptModule {
|
|
5266
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: PromptModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
5267
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.10", ngImport: i0, type: PromptModule, imports: [CommonModule, PromptComponent], exports: [PromptComponent] }); }
|
|
5268
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: PromptModule, imports: [CommonModule, PromptComponent] }); }
|
|
5269
|
+
}
|
|
5270
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: PromptModule, decorators: [{
|
|
5271
|
+
type: NgModule,
|
|
5272
|
+
args: [{
|
|
5273
|
+
declarations: [],
|
|
5274
|
+
imports: [CommonModule, PromptComponent],
|
|
5275
|
+
exports: [PromptComponent],
|
|
5276
|
+
}]
|
|
5277
|
+
}] });
|
|
5278
|
+
|
|
5279
|
+
function copyToClipboard(text) {
|
|
5280
|
+
if (typeof text !== 'string') {
|
|
5281
|
+
return Promise.reject();
|
|
5282
|
+
}
|
|
5283
|
+
// 现代浏览器优先使用 Clipboard API
|
|
5284
|
+
if (navigator.clipboard && window.isSecureContext) {
|
|
5285
|
+
return navigator.clipboard
|
|
5286
|
+
.writeText(text)
|
|
5287
|
+
.then(() => { })
|
|
5288
|
+
.catch((err) => {
|
|
5289
|
+
return fallbackCopyTextToClipboard(text); // 降级处理
|
|
5290
|
+
});
|
|
5291
|
+
}
|
|
5292
|
+
// 低版本浏览器直接使用降级方案
|
|
5293
|
+
return fallbackCopyTextToClipboard(text);
|
|
5294
|
+
}
|
|
5295
|
+
function fallbackCopyTextToClipboard(text) {
|
|
5296
|
+
return new Promise((resolve, reject) => {
|
|
5297
|
+
// 创建隐藏的 textarea 元素
|
|
5298
|
+
const textarea = document.createElement('textarea');
|
|
5299
|
+
textarea.value = text;
|
|
5300
|
+
// 样式:隐藏且不影响布局
|
|
5301
|
+
textarea.style.position = 'fixed';
|
|
5302
|
+
textarea.style.top = '-9999px';
|
|
5303
|
+
textarea.style.left = '-9999px';
|
|
5304
|
+
textarea.style.opacity = '0';
|
|
5305
|
+
textarea.style.zIndex = '-1000';
|
|
5306
|
+
// 解决 iOS 下无法选中的问题
|
|
5307
|
+
textarea.setAttribute('readonly', '');
|
|
5308
|
+
document.body.appendChild(textarea);
|
|
5309
|
+
try {
|
|
5310
|
+
// 选中内容(兼容 iOS)
|
|
5311
|
+
textarea.select();
|
|
5312
|
+
textarea.setSelectionRange(0, textarea.value.length); // 移动端必须
|
|
5313
|
+
// 执行复制
|
|
5314
|
+
const success = document.execCommand('copy');
|
|
5315
|
+
if (success) {
|
|
5316
|
+
resolve(null);
|
|
5317
|
+
}
|
|
5318
|
+
else {
|
|
5319
|
+
reject();
|
|
5320
|
+
}
|
|
5321
|
+
}
|
|
5322
|
+
catch (err) {
|
|
5323
|
+
reject();
|
|
5324
|
+
}
|
|
5325
|
+
finally {
|
|
5326
|
+
// 移除临时元素
|
|
5327
|
+
document.body.removeChild(textarea);
|
|
5328
|
+
}
|
|
5329
|
+
});
|
|
5330
|
+
}
|
|
5331
|
+
|
|
5332
|
+
const TOOLBAR_GAP_DEFAULT_VALUE = 0;
|
|
5333
|
+
const TOOLBAR_ICON_SIZE_DEFAULT_VALUE = 16;
|
|
5334
|
+
|
|
5335
|
+
class CopyIconComponent {
|
|
5336
|
+
constructor() {
|
|
5337
|
+
this.width = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
5338
|
+
this.height = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
5339
|
+
this.isActive = false;
|
|
5340
|
+
this.text = '';
|
|
5341
|
+
this.title = '';
|
|
5342
|
+
this.copied = false;
|
|
5343
|
+
}
|
|
5344
|
+
async handleClick() {
|
|
5345
|
+
setTimeout(() => {
|
|
5346
|
+
this.copied = false;
|
|
5347
|
+
}, 1500);
|
|
5348
|
+
try {
|
|
5349
|
+
await copyToClipboard(this.text);
|
|
5350
|
+
this.copied = true;
|
|
5351
|
+
}
|
|
5352
|
+
catch (error) { }
|
|
5353
|
+
}
|
|
5354
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: CopyIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5355
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: CopyIconComponent, isStandalone: true, selector: "mc-copy-icon", inputs: { width: "width", height: "height", isActive: "isActive", text: "text", title: "title" }, ngImport: i0, template: "<div class=\"mc-action-item\" [title]=\"title\">\r\n <svg\r\n *ngIf=\"copied\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <desc>Created with Sketch.</desc>\r\n <defs>\r\n <polygon id=\"path-1\" points=\"6.53553391 9.77817459 12.1923882 4.12132034 13.6066017 5.53553391 6.53553391 12.6066017 3 9.07106781 4.41421356 7.65685425 6.53553391 9.77817459\"></polygon>\r\n </defs>\r\n <g id=\"status/whiteBG/correct\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <mask id=\"mask-2\" fill=\"white\">\r\n <use xlink:href=\"#path-1\"></use>\r\n </mask>\r\n <use id=\"Mask\" fill=\"currentColor\" xlink:href=\"#path-1\"></use>\r\n </g>\r\n </svg>\r\n <svg\r\n *ngIf=\"!copied\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n (click)=\"handleClick()\"\r\n >\r\n <g id=\"\u9875\u9762-1\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <g id=\"API-starter-\u56FE\u6807\u5165\u5E93\" transform=\"translate(-592.000000, -204.000000)\">\r\n <g id=\"\u65B9\u683C\u5907\u4EFD-16\" transform=\"translate(560.000000, 180.000000)\">\r\n <text id=\"\u56FE\u6807\" font-family=\"PingFangSC-Regular, PingFang SC\" font-size=\"12\" font-weight=\"normal\" line-spacing=\"16\" fill=\"#71757F\">\r\n <tspan x=\"27.136\" y=\"61\">\u590D\u5236</tspan>\r\n </text>\r\n </g>\r\n <path\r\n d=\"M604.5,206 C605.279696,206 605.920449,206.594888 605.993133,207.35554 L606,207.5 L606,214.5 C606,215.279696 605.405112,215.920449 604.64446,215.993133 L604.5,216 L604,216 L604,216.5 C604,217.279696 603.405112,217.920449 602.64446,217.993133 L602.5,218 L595.5,218 C594.671573,218 594,217.328427 594,216.5 L594,216.5 L594,209.5 C594,208.671573 594.671573,208 595.5,208 L595.5,208 L596,208 L596,207.5 C596,206.720304 596.594888,206.079551 597.35554,206.006867 L597.5,206 L604.5,206 Z M602.5,209 L595.5,209 C595.223858,209 595,209.223858 595,209.5 L595,209.5 L595,216.5 C595,216.776142 595.223858,217 595.5,217 L595.5,217 L602.5,217 C602.776142,217 603,216.776142 603,216.5 L603,216.5 L603,209.5 C603,209.223858 602.776142,209 602.5,209 L602.5,209 Z M604.5,207 L597.5,207 C597.25454,207 597.050392,207.176875 597.008056,207.410124 L597,207.5 L597,208 L602.5,208 C603.279696,208 603.920449,208.594888 603.993133,209.35554 L604,209.5 L604,215 L604.5,215 C604.74546,215 604.949608,214.823125 604.991944,214.589876 L605,214.5 L605,207.5 C605,207.25454 604.823125,207.050392 604.589876,207.008056 L604.5,207 Z\"\r\n id=\"\u5F62\u72B6\u7ED3\u5408\"\r\n fill=\"currentColor\"\r\n fill-rule=\"nonzero\"\r\n ></path>\r\n </g>\r\n </g>\r\n </svg>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
5356
|
+
}
|
|
5357
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: CopyIconComponent, decorators: [{
|
|
5358
|
+
type: Component,
|
|
5359
|
+
args: [{ selector: 'mc-copy-icon', standalone: true, imports: [CommonModule], template: "<div class=\"mc-action-item\" [title]=\"title\">\r\n <svg\r\n *ngIf=\"copied\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <desc>Created with Sketch.</desc>\r\n <defs>\r\n <polygon id=\"path-1\" points=\"6.53553391 9.77817459 12.1923882 4.12132034 13.6066017 5.53553391 6.53553391 12.6066017 3 9.07106781 4.41421356 7.65685425 6.53553391 9.77817459\"></polygon>\r\n </defs>\r\n <g id=\"status/whiteBG/correct\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <mask id=\"mask-2\" fill=\"white\">\r\n <use xlink:href=\"#path-1\"></use>\r\n </mask>\r\n <use id=\"Mask\" fill=\"currentColor\" xlink:href=\"#path-1\"></use>\r\n </g>\r\n </svg>\r\n <svg\r\n *ngIf=\"!copied\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n (click)=\"handleClick()\"\r\n >\r\n <g id=\"\u9875\u9762-1\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <g id=\"API-starter-\u56FE\u6807\u5165\u5E93\" transform=\"translate(-592.000000, -204.000000)\">\r\n <g id=\"\u65B9\u683C\u5907\u4EFD-16\" transform=\"translate(560.000000, 180.000000)\">\r\n <text id=\"\u56FE\u6807\" font-family=\"PingFangSC-Regular, PingFang SC\" font-size=\"12\" font-weight=\"normal\" line-spacing=\"16\" fill=\"#71757F\">\r\n <tspan x=\"27.136\" y=\"61\">\u590D\u5236</tspan>\r\n </text>\r\n </g>\r\n <path\r\n d=\"M604.5,206 C605.279696,206 605.920449,206.594888 605.993133,207.35554 L606,207.5 L606,214.5 C606,215.279696 605.405112,215.920449 604.64446,215.993133 L604.5,216 L604,216 L604,216.5 C604,217.279696 603.405112,217.920449 602.64446,217.993133 L602.5,218 L595.5,218 C594.671573,218 594,217.328427 594,216.5 L594,216.5 L594,209.5 C594,208.671573 594.671573,208 595.5,208 L595.5,208 L596,208 L596,207.5 C596,206.720304 596.594888,206.079551 597.35554,206.006867 L597.5,206 L604.5,206 Z M602.5,209 L595.5,209 C595.223858,209 595,209.223858 595,209.5 L595,209.5 L595,216.5 C595,216.776142 595.223858,217 595.5,217 L595.5,217 L602.5,217 C602.776142,217 603,216.776142 603,216.5 L603,216.5 L603,209.5 C603,209.223858 602.776142,209 602.5,209 L602.5,209 Z M604.5,207 L597.5,207 C597.25454,207 597.050392,207.176875 597.008056,207.410124 L597,207.5 L597,208 L602.5,208 C603.279696,208 603.920449,208.594888 603.993133,209.35554 L604,209.5 L604,215 L604.5,215 C604.74546,215 604.949608,214.823125 604.991944,214.589876 L605,214.5 L605,207.5 C605,207.25454 604.823125,207.050392 604.589876,207.008056 L604.5,207 Z\"\r\n id=\"\u5F62\u72B6\u7ED3\u5408\"\r\n fill=\"currentColor\"\r\n fill-rule=\"nonzero\"\r\n ></path>\r\n </g>\r\n </g>\r\n </svg>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}\n"] }]
|
|
5360
|
+
}], propDecorators: { width: [{
|
|
5361
|
+
type: Input
|
|
5362
|
+
}], height: [{
|
|
5363
|
+
type: Input
|
|
5364
|
+
}], isActive: [{
|
|
5365
|
+
type: Input
|
|
5366
|
+
}], text: [{
|
|
5367
|
+
type: Input
|
|
5368
|
+
}], title: [{
|
|
5369
|
+
type: Input
|
|
5370
|
+
}] } });
|
|
5371
|
+
|
|
5372
|
+
class DeleteIconComponent {
|
|
5373
|
+
constructor() {
|
|
5374
|
+
this.width = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
5375
|
+
this.height = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
5376
|
+
this.isActive = false;
|
|
5377
|
+
this.title = '';
|
|
5378
|
+
this.text = '';
|
|
5379
|
+
}
|
|
5380
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: DeleteIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5381
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: DeleteIconComponent, isStandalone: true, selector: "mc-delete-icon", inputs: { width: "width", height: "height", isActive: "isActive", title: "title", text: "text" }, ngImport: i0, template: "<div class=\"mc-action-item\" [title]=\"title\">\r\n <svg\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <g\r\n id=\"codehub-delete-op\"\r\n stroke=\"none\"\r\n stroke-width=\"1\"\r\n fill=\"none\"\r\n fill-rule=\"evenodd\"\r\n >\r\n <path\r\n d=\"M12.5,5 C12.7761424,5 13,5.22385763 13,5.5 L13,13 C13,14.0543618 12.1841222,14.9181651 11.1492623,14.9945143 L11,15 L5,15 C3.9456382,15 3.08183488,14.1841222 3.00548574,13.1492623 L3,13 L3,5.5 C3,5.22385763 3.22385763,5 3.5,5 C3.77614237,5 4,5.22385763 4,5.5 L4,13 C4,13.5128358 4.38604019,13.9355072 4.88337887,13.9932723 L5,14 L11,14 C11.5128358,14 11.9355072,13.6139598 11.9932723,13.1166211 L12,13 L12,5.5 C12,5.22385763 12.2238576,5 12.5,5 Z M6.53333333,6 C6.79515721,6 7.0129156,6.17687516 7.05807395,6.41012437 L7.06666667,6.5 L7.06666667,11.5 C7.06666667,11.7761424 6.8278852,12 6.53333333,12 C6.27150945,12 6.05375107,11.8231248 6.00859271,11.5898756 L6,11.5 L6,6.5 C6,6.22385763 6.23878147,6 6.53333333,6 Z M9.53333333,6 C9.79515721,6 10.0129156,6.17687516 10.058074,6.41012437 L10.0666667,6.5 L10.0666667,11.5 C10.0666667,11.7761424 9.8278852,12 9.53333333,12 C9.27150945,12 9.05375107,11.8231248 9.00859271,11.5898756 L9,11.5 L9,6.5 C9,6.22385763 9.23878147,6 9.53333333,6 Z M10,1 C10.5128358,1 10.9355072,1.38604019 10.9932723,1.88337887 L11,2 L11,3 L14.5,3 C14.7761424,3 15,3.22385763 15,3.5 C15,3.77614237 14.7761424,4 14.5,4 L1.5,4 C1.22385763,4 1,3.77614237 1,3.5 C1,3.22385763 1.22385763,3 1.5,3 L5,3 L5,2 C5,1.48716416 5.38604019,1.06449284 5.88337887,1.00672773 L6,1 L10,1 Z M10,2 L6,2 L6,3 L10,3 L10,2 Z\"\r\n fill=\"currentColor\"\r\n ></path>\r\n </g>\r\n </svg>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] }); }
|
|
5382
|
+
}
|
|
5383
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: DeleteIconComponent, decorators: [{
|
|
5384
|
+
type: Component,
|
|
5385
|
+
args: [{ selector: 'mc-delete-icon', standalone: true, imports: [CommonModule], template: "<div class=\"mc-action-item\" [title]=\"title\">\r\n <svg\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <g\r\n id=\"codehub-delete-op\"\r\n stroke=\"none\"\r\n stroke-width=\"1\"\r\n fill=\"none\"\r\n fill-rule=\"evenodd\"\r\n >\r\n <path\r\n d=\"M12.5,5 C12.7761424,5 13,5.22385763 13,5.5 L13,13 C13,14.0543618 12.1841222,14.9181651 11.1492623,14.9945143 L11,15 L5,15 C3.9456382,15 3.08183488,14.1841222 3.00548574,13.1492623 L3,13 L3,5.5 C3,5.22385763 3.22385763,5 3.5,5 C3.77614237,5 4,5.22385763 4,5.5 L4,13 C4,13.5128358 4.38604019,13.9355072 4.88337887,13.9932723 L5,14 L11,14 C11.5128358,14 11.9355072,13.6139598 11.9932723,13.1166211 L12,13 L12,5.5 C12,5.22385763 12.2238576,5 12.5,5 Z M6.53333333,6 C6.79515721,6 7.0129156,6.17687516 7.05807395,6.41012437 L7.06666667,6.5 L7.06666667,11.5 C7.06666667,11.7761424 6.8278852,12 6.53333333,12 C6.27150945,12 6.05375107,11.8231248 6.00859271,11.5898756 L6,11.5 L6,6.5 C6,6.22385763 6.23878147,6 6.53333333,6 Z M9.53333333,6 C9.79515721,6 10.0129156,6.17687516 10.058074,6.41012437 L10.0666667,6.5 L10.0666667,11.5 C10.0666667,11.7761424 9.8278852,12 9.53333333,12 C9.27150945,12 9.05375107,11.8231248 9.00859271,11.5898756 L9,11.5 L9,6.5 C9,6.22385763 9.23878147,6 9.53333333,6 Z M10,1 C10.5128358,1 10.9355072,1.38604019 10.9932723,1.88337887 L11,2 L11,3 L14.5,3 C14.7761424,3 15,3.22385763 15,3.5 C15,3.77614237 14.7761424,4 14.5,4 L1.5,4 C1.22385763,4 1,3.77614237 1,3.5 C1,3.22385763 1.22385763,3 1.5,3 L5,3 L5,2 C5,1.48716416 5.38604019,1.06449284 5.88337887,1.00672773 L6,1 L10,1 Z M10,2 L6,2 L6,3 L10,3 L10,2 Z\"\r\n fill=\"currentColor\"\r\n ></path>\r\n </g>\r\n </svg>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}\n"] }]
|
|
5386
|
+
}], propDecorators: { width: [{
|
|
5387
|
+
type: Input
|
|
5388
|
+
}], height: [{
|
|
5389
|
+
type: Input
|
|
5390
|
+
}], isActive: [{
|
|
5391
|
+
type: Input
|
|
5392
|
+
}], title: [{
|
|
5393
|
+
type: Input
|
|
5394
|
+
}], text: [{
|
|
5395
|
+
type: Input
|
|
5396
|
+
}] } });
|
|
5397
|
+
|
|
5398
|
+
class DislikeIconComponent {
|
|
5399
|
+
constructor() {
|
|
5400
|
+
this.width = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
5401
|
+
this.height = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
5402
|
+
this.isActive = false;
|
|
5403
|
+
this.title = '';
|
|
5404
|
+
this.text = '';
|
|
5405
|
+
this.activeChange = new EventEmitter();
|
|
5406
|
+
this.active = this.isActive;
|
|
5407
|
+
}
|
|
5408
|
+
ngOnChanges(changes) {
|
|
5409
|
+
if (changes['isActive']) {
|
|
5410
|
+
this.active = changes['isActive'].currentValue;
|
|
5411
|
+
}
|
|
5412
|
+
}
|
|
5413
|
+
handleClick() {
|
|
5414
|
+
this.active = !this.active;
|
|
5415
|
+
this.activeChange.emit(this.active);
|
|
5416
|
+
}
|
|
5417
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: DislikeIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5418
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: DislikeIconComponent, isStandalone: true, selector: "mc-dislike-icon", inputs: { width: "width", height: "height", isActive: "isActive", title: "title", text: "text" }, outputs: { activeChange: "activeChange" }, usesOnChanges: true, ngImport: i0, template: "<div\r\n class=\"mc-action-item\"\r\n [title]=\"title\"\r\n [class.mc-action-item-active]=\"active\"\r\n (click)=\"handleClick()\"\r\n>\r\n <svg\r\n *ngIf=\"active\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <path\r\n id=\"\u77E2\u91CF 1\"\r\n d=\"M2.60156 1C1.76611 1 1.08008 1.63953 1.00659 2.45581L1 2.60156L1 8.06506C1 8.90039 1.63965 9.58643 2.45581 9.66003L2.60156 9.66663L3.16675 9.66644C3.44287 9.66644 3.6665 9.4425 3.6665 9.16644L3.6665 1.5C3.6665 1.22388 3.44263 1 3.1665 1L2.60156 1ZM5.6665 1L11.552 1L11.7861 1.00342C13.2422 1.04712 14.1792 1.50781 14.4907 2.44861C14.8108 3.41553 15.1758 5.00916 15.2917 6.29297L15.3098 6.51453L15.3308 6.92529L15.3345 7.12988C15.3438 8.74133 14.8638 9.74072 13.6501 9.74072L9.55591 9.74194L9.60107 9.88098C10.02 11.2178 10.1855 12.2474 10.0869 12.9923C9.89819 14.4197 8.75317 15.6334 7.67651 15.2727L7.55713 15.2261C7.11279 14.9865 6.85327 14.5331 6.70117 13.6534L6.54492 12.7217L6.4978 12.5065L6.43872 12.2728C6.37622 12.0485 6.30347 11.8517 6.21558 11.6747C5.91675 11.0725 5.51904 10.535 5.021 10.0604C4.8042 9.85382 4.6665 9.57355 4.6665 9.27405L4.6665 2C4.6665 1.44769 5.11426 1 5.6665 1Z\"\r\n fill-rule=\"evenodd\"\r\n fill=\"currentColor\"\r\n />\r\n </svg>\r\n <svg\r\n *ngIf=\"!active\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <g id=\"Dislike\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <path\r\n d=\"M11.55205,1 C13.14165,1 14.16285,1.458308 14.49075,2.448728 C14.81075,3.415528 15.17575,5.009158 15.29175,6.292968 L15.29175,6.292968 L15.30985,6.514648 L15.33085,6.925358 C15.38255,8.656368 14.91455,9.740718 13.65015,9.740718 L13.65015,9.740718 L9.55591,9.741028 L9.60108,9.881038 C10.02005,11.217788 10.18555,12.247488 10.08695,12.992388 C9.89815,14.419688 8.75318,15.633388 7.67652,15.272788 L7.67652,15.272788 L7.55713,15.226188 C7.03589,14.992888 6.86426,14.595988 6.70117,13.653488 L6.70117,13.653488 L6.54492,12.721688 L6.4978,12.506488 C6.4231,12.182088 6.33277,11.910688 6.21558,11.674688 C5.8313,10.900988 5.28443,10.233788 4.57056,9.670048 L4.57056,9.670048 L2.60156,9.670288 C1.71704,9.670288 1,8.953248 1,8.068728 L1,8.068728 L1,2.605228 C1,1.720708 1.71704,1.003601 2.60156,1.003601 L2.60156,1.003601 L4.83325,1 Z M11.55205,1.999998 L5.33301,1.999998 L5.33301,9.002988 L5.41699,9.071468 C6.13672,9.686458 6.70239,10.406788 7.11109,11.230088 C7.23584,11.480988 7.33399,11.750888 7.4148,12.050988 L7.50098,12.409088 L7.56079,12.715988 L7.69336,13.519388 C7.69946,13.553388 7.70557,13.586088 7.71167,13.617588 L7.76441,13.867488 C7.83374,14.157988 7.8982,14.283188 7.96558,14.313488 C8.30152,14.463788 8.97461,13.775988 9.09571,12.861188 C9.17749,12.243388 9.00025,11.240388 8.55029,9.880678 C8.51196,9.764348 8.49854,9.641728 8.51099,9.520328 C8.55908,9.045288 8.98218,8.699098 9.45679,8.742858 L13.65015,8.740718 C14.18895,8.740718 14.43655,7.941288 14.29595,6.382938 C14.18755,5.183288 13.83915,3.662168 13.54155,2.762938 L13.50585,2.674618 C13.30125,2.245118 12.68435,1.999998 11.55205,1.999998 Z M4.33277,2.003598 L2.60156,2.003598 C2.26929,2.003598 2,2.272948 2,2.605228 L2,2.605228 L2,8.068668 L2.00781,8.166258 C2.05445,8.452148 2.30249,8.670288 2.60156,8.670288 L2.60156,8.670288 L4.33277,8.670598 L4.33277,2.003598 Z\"\r\n id=\"\u5F62\u72B6\u7ED3\u5408\"\r\n fill=\"currentColor\"\r\n ></path>\r\n </g>\r\n </svg>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
4868
5419
|
}
|
|
4869
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type:
|
|
5420
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: DislikeIconComponent, decorators: [{
|
|
4870
5421
|
type: Component,
|
|
4871
|
-
args: [{ selector: 'mc-
|
|
4872
|
-
}],
|
|
5422
|
+
args: [{ selector: 'mc-dislike-icon', standalone: true, imports: [CommonModule], template: "<div\r\n class=\"mc-action-item\"\r\n [title]=\"title\"\r\n [class.mc-action-item-active]=\"active\"\r\n (click)=\"handleClick()\"\r\n>\r\n <svg\r\n *ngIf=\"active\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <path\r\n id=\"\u77E2\u91CF 1\"\r\n d=\"M2.60156 1C1.76611 1 1.08008 1.63953 1.00659 2.45581L1 2.60156L1 8.06506C1 8.90039 1.63965 9.58643 2.45581 9.66003L2.60156 9.66663L3.16675 9.66644C3.44287 9.66644 3.6665 9.4425 3.6665 9.16644L3.6665 1.5C3.6665 1.22388 3.44263 1 3.1665 1L2.60156 1ZM5.6665 1L11.552 1L11.7861 1.00342C13.2422 1.04712 14.1792 1.50781 14.4907 2.44861C14.8108 3.41553 15.1758 5.00916 15.2917 6.29297L15.3098 6.51453L15.3308 6.92529L15.3345 7.12988C15.3438 8.74133 14.8638 9.74072 13.6501 9.74072L9.55591 9.74194L9.60107 9.88098C10.02 11.2178 10.1855 12.2474 10.0869 12.9923C9.89819 14.4197 8.75317 15.6334 7.67651 15.2727L7.55713 15.2261C7.11279 14.9865 6.85327 14.5331 6.70117 13.6534L6.54492 12.7217L6.4978 12.5065L6.43872 12.2728C6.37622 12.0485 6.30347 11.8517 6.21558 11.6747C5.91675 11.0725 5.51904 10.535 5.021 10.0604C4.8042 9.85382 4.6665 9.57355 4.6665 9.27405L4.6665 2C4.6665 1.44769 5.11426 1 5.6665 1Z\"\r\n fill-rule=\"evenodd\"\r\n fill=\"currentColor\"\r\n />\r\n </svg>\r\n <svg\r\n *ngIf=\"!active\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <g id=\"Dislike\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <path\r\n d=\"M11.55205,1 C13.14165,1 14.16285,1.458308 14.49075,2.448728 C14.81075,3.415528 15.17575,5.009158 15.29175,6.292968 L15.29175,6.292968 L15.30985,6.514648 L15.33085,6.925358 C15.38255,8.656368 14.91455,9.740718 13.65015,9.740718 L13.65015,9.740718 L9.55591,9.741028 L9.60108,9.881038 C10.02005,11.217788 10.18555,12.247488 10.08695,12.992388 C9.89815,14.419688 8.75318,15.633388 7.67652,15.272788 L7.67652,15.272788 L7.55713,15.226188 C7.03589,14.992888 6.86426,14.595988 6.70117,13.653488 L6.70117,13.653488 L6.54492,12.721688 L6.4978,12.506488 C6.4231,12.182088 6.33277,11.910688 6.21558,11.674688 C5.8313,10.900988 5.28443,10.233788 4.57056,9.670048 L4.57056,9.670048 L2.60156,9.670288 C1.71704,9.670288 1,8.953248 1,8.068728 L1,8.068728 L1,2.605228 C1,1.720708 1.71704,1.003601 2.60156,1.003601 L2.60156,1.003601 L4.83325,1 Z M11.55205,1.999998 L5.33301,1.999998 L5.33301,9.002988 L5.41699,9.071468 C6.13672,9.686458 6.70239,10.406788 7.11109,11.230088 C7.23584,11.480988 7.33399,11.750888 7.4148,12.050988 L7.50098,12.409088 L7.56079,12.715988 L7.69336,13.519388 C7.69946,13.553388 7.70557,13.586088 7.71167,13.617588 L7.76441,13.867488 C7.83374,14.157988 7.8982,14.283188 7.96558,14.313488 C8.30152,14.463788 8.97461,13.775988 9.09571,12.861188 C9.17749,12.243388 9.00025,11.240388 8.55029,9.880678 C8.51196,9.764348 8.49854,9.641728 8.51099,9.520328 C8.55908,9.045288 8.98218,8.699098 9.45679,8.742858 L13.65015,8.740718 C14.18895,8.740718 14.43655,7.941288 14.29595,6.382938 C14.18755,5.183288 13.83915,3.662168 13.54155,2.762938 L13.50585,2.674618 C13.30125,2.245118 12.68435,1.999998 11.55205,1.999998 Z M4.33277,2.003598 L2.60156,2.003598 C2.26929,2.003598 2,2.272948 2,2.605228 L2,2.605228 L2,8.068668 L2.00781,8.166258 C2.05445,8.452148 2.30249,8.670288 2.60156,8.670288 L2.60156,8.670288 L4.33277,8.670598 L4.33277,2.003598 Z\"\r\n id=\"\u5F62\u72B6\u7ED3\u5408\"\r\n fill=\"currentColor\"\r\n ></path>\r\n </g>\r\n </svg>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}\n"] }]
|
|
5423
|
+
}], propDecorators: { width: [{
|
|
5424
|
+
type: Input
|
|
5425
|
+
}], height: [{
|
|
5426
|
+
type: Input
|
|
5427
|
+
}], isActive: [{
|
|
4873
5428
|
type: Input
|
|
5429
|
+
}], title: [{
|
|
5430
|
+
type: Input
|
|
5431
|
+
}], text: [{
|
|
5432
|
+
type: Input
|
|
5433
|
+
}], activeChange: [{
|
|
5434
|
+
type: Output
|
|
4874
5435
|
}] } });
|
|
4875
5436
|
|
|
4876
|
-
class
|
|
5437
|
+
class LikeIconComponent {
|
|
4877
5438
|
constructor() {
|
|
4878
|
-
|
|
4879
|
-
|
|
4880
|
-
this.
|
|
4881
|
-
this.
|
|
4882
|
-
this.
|
|
4883
|
-
this.
|
|
4884
|
-
|
|
4885
|
-
ngOnInit() {
|
|
4886
|
-
this.foundation = new PromptFoundation(this.adapter);
|
|
4887
|
-
this.foundation.init();
|
|
5439
|
+
this.width = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
5440
|
+
this.height = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
5441
|
+
this.isActive = false;
|
|
5442
|
+
this.title = '';
|
|
5443
|
+
this.text = '';
|
|
5444
|
+
this.activeChange = new EventEmitter();
|
|
5445
|
+
this.active = this.isActive;
|
|
4888
5446
|
}
|
|
4889
|
-
|
|
4890
|
-
|
|
4891
|
-
|
|
4892
|
-
|
|
4893
|
-
direction: this.direction,
|
|
4894
|
-
list: this.list,
|
|
4895
|
-
variant: this.variant,
|
|
4896
|
-
}),
|
|
4897
|
-
};
|
|
5447
|
+
ngOnChanges(changes) {
|
|
5448
|
+
if (changes['isActive']) {
|
|
5449
|
+
this.active = changes['isActive'].currentValue;
|
|
5450
|
+
}
|
|
4898
5451
|
}
|
|
4899
|
-
|
|
4900
|
-
this.
|
|
5452
|
+
handleClick() {
|
|
5453
|
+
this.active = !this.active;
|
|
5454
|
+
this.activeChange.emit(this.active);
|
|
4901
5455
|
}
|
|
4902
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type:
|
|
4903
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type:
|
|
5456
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LikeIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5457
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: LikeIconComponent, isStandalone: true, selector: "mc-like-icon", inputs: { width: "width", height: "height", isActive: "isActive", title: "title", text: "text" }, outputs: { activeChange: "activeChange" }, usesOnChanges: true, ngImport: i0, template: "<div\r\n class=\"mc-action-item\"\r\n [title]=\"title\"\r\n [class.mc-action-item-active]=\"active\"\r\n (click)=\"handleClick()\"\r\n>\r\n <svg\r\n *ngIf=\"active\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <desc>Created with Sketch.</desc>\r\n <path\r\n id=\"\u77E2\u91CF 1\"\r\n d=\"M2.60156 15.3369C1.76611 15.3369 1.08008 14.6974 1.00659 13.8811L1 13.7354L1 8.27185C1 7.43652 1.63965 6.75049 2.45581 6.67688L2.60156 6.67029L3.16675 6.67047C3.44287 6.67047 3.6665 6.89441 3.6665 7.17047L3.6665 14.8369C3.6665 15.113 3.44263 15.3369 3.1665 15.3369L2.60156 15.3369ZM5.6665 15.3369L11.552 15.3369L11.7861 15.3335C13.2422 15.2898 14.1792 14.8291 14.4907 13.8883C14.8108 12.9214 15.1758 11.3278 15.2917 10.0439L15.3098 9.82239L15.3308 9.41162L15.3345 9.20703C15.3438 7.59558 14.8638 6.59619 13.6501 6.59619L9.55591 6.59497L9.60107 6.45593C10.02 5.11914 10.1855 4.08948 10.0869 3.3446C9.89819 1.91724 8.75317 0.703491 7.67651 1.06421L7.55713 1.11084C7.11279 1.35046 6.85327 1.80383 6.70117 2.68347L6.54492 3.61523L6.4978 3.83044L6.43872 4.06409C6.37622 4.28845 6.30347 4.48523 6.21558 4.66223C5.91675 5.2644 5.51904 5.80194 5.021 6.27649C4.8042 6.48309 4.6665 6.76337 4.6665 7.06287L4.6665 14.3369C4.6665 14.8892 5.11426 15.3369 5.6665 15.3369Z\"\r\n fill-rule=\"evenodd\"\r\n fill=\"currentColor\"\r\n />\r\n </svg>\r\n <svg\r\n *ngIf=\"!active\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <g id=\"\u9875\u9762-1\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <path\r\n d=\"M11.55205,1 C13.14165,1 14.16285,1.458308 14.49075,2.448728 C14.81075,3.415528 15.17575,5.009158 15.29175,6.292968 L15.29175,6.292968 L15.30985,6.514648 L15.33085,6.925358 C15.38255,8.656368 14.91455,9.740718 13.65015,9.740718 L13.65015,9.740718 L9.55591,9.741028 L9.60108,9.881038 C10.02005,11.217788 10.18555,12.247488 10.08695,12.992388 C9.89815,14.419688 8.75318,15.633388 7.67652,15.272788 L7.67652,15.272788 L7.55713,15.226188 C7.03589,14.992888 6.86426,14.595988 6.70117,13.653488 L6.70117,13.653488 L6.54492,12.721688 L6.4978,12.506488 C6.4231,12.182088 6.33277,11.910688 6.21558,11.674688 C5.8313,10.900988 5.28443,10.233788 4.57056,9.670048 L4.57056,9.670048 L2.60156,9.670288 C1.71704,9.670288 1,8.953248 1,8.068728 L1,8.068728 L1,2.605228 C1,1.720708 1.71704,1.003601 2.60156,1.003601 L2.60156,1.003601 L4.83325,1 Z M11.55205,1.999998 L5.33301,1.999998 L5.33301,9.002988 L5.41699,9.071468 L5.6796615,9.30702243 C6.27568484,9.86814941 6.7534775,10.5097005 7.11109,11.230088 C7.23584,11.480988 7.33399,11.750888 7.4148,12.050988 L7.4148,12.050988 L7.50098,12.409088 L7.56079,12.715988 L7.69336,13.519388 L7.702515,13.5694255 L7.702515,13.5694255 L7.71167,13.617588 L7.76441,13.867488 L7.79384741,13.9820728 C7.85221673,14.1918227 7.90782571,14.2875166 7.96558,14.313488 C8.30152,14.463788 8.97461,13.775988 9.09571,12.861188 C9.17749,12.243388 9.00025,11.240388 8.55029,9.880678 C8.51196,9.764348 8.49854,9.641728 8.51099,9.520328 C8.55908,9.045288 8.98218,8.699098 9.45679,8.742858 L9.45679,8.742858 L13.65015,8.740718 L13.7287739,8.73472734 C14.2127395,8.6588777 14.42952,7.8633705 14.29595,6.382938 C14.18755,5.183288 13.83915,3.662168 13.54155,2.762938 L13.54155,2.762938 L13.50585,2.674618 L13.4594021,2.5911944 C13.216706,2.21352476 12.6088633,1.999998 11.55205,1.999998 L11.55205,1.999998 Z M4.33277,2.003598 L2.60156,2.003598 C2.26929,2.003598 2,2.272948 2,2.605228 L2,2.605228 L2,8.068668 L2.00781,8.166258 C2.05445,8.452148 2.30249,8.670288 2.60156,8.670288 L2.60156,8.670288 L4.33277,8.670598 L4.33277,2.003598 Z\"\r\n id=\"dislike\"\r\n fill=\"currentColor\"\r\n transform=\"translate(8.167337, 8.168474) scale(-1, 1) rotate(-180.000000) translate(-8.167337, -8.168474) \"\r\n ></path>\r\n </g>\r\n </svg>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
4904
5458
|
}
|
|
4905
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type:
|
|
5459
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LikeIconComponent, decorators: [{
|
|
4906
5460
|
type: Component,
|
|
4907
|
-
args: [{ selector: 'mc-
|
|
4908
|
-
}],
|
|
5461
|
+
args: [{ selector: 'mc-like-icon', standalone: true, imports: [CommonModule], template: "<div\r\n class=\"mc-action-item\"\r\n [title]=\"title\"\r\n [class.mc-action-item-active]=\"active\"\r\n (click)=\"handleClick()\"\r\n>\r\n <svg\r\n *ngIf=\"active\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <desc>Created with Sketch.</desc>\r\n <path\r\n id=\"\u77E2\u91CF 1\"\r\n d=\"M2.60156 15.3369C1.76611 15.3369 1.08008 14.6974 1.00659 13.8811L1 13.7354L1 8.27185C1 7.43652 1.63965 6.75049 2.45581 6.67688L2.60156 6.67029L3.16675 6.67047C3.44287 6.67047 3.6665 6.89441 3.6665 7.17047L3.6665 14.8369C3.6665 15.113 3.44263 15.3369 3.1665 15.3369L2.60156 15.3369ZM5.6665 15.3369L11.552 15.3369L11.7861 15.3335C13.2422 15.2898 14.1792 14.8291 14.4907 13.8883C14.8108 12.9214 15.1758 11.3278 15.2917 10.0439L15.3098 9.82239L15.3308 9.41162L15.3345 9.20703C15.3438 7.59558 14.8638 6.59619 13.6501 6.59619L9.55591 6.59497L9.60107 6.45593C10.02 5.11914 10.1855 4.08948 10.0869 3.3446C9.89819 1.91724 8.75317 0.703491 7.67651 1.06421L7.55713 1.11084C7.11279 1.35046 6.85327 1.80383 6.70117 2.68347L6.54492 3.61523L6.4978 3.83044L6.43872 4.06409C6.37622 4.28845 6.30347 4.48523 6.21558 4.66223C5.91675 5.2644 5.51904 5.80194 5.021 6.27649C4.8042 6.48309 4.6665 6.76337 4.6665 7.06287L4.6665 14.3369C4.6665 14.8892 5.11426 15.3369 5.6665 15.3369Z\"\r\n fill-rule=\"evenodd\"\r\n fill=\"currentColor\"\r\n />\r\n </svg>\r\n <svg\r\n *ngIf=\"!active\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <g id=\"\u9875\u9762-1\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <path\r\n d=\"M11.55205,1 C13.14165,1 14.16285,1.458308 14.49075,2.448728 C14.81075,3.415528 15.17575,5.009158 15.29175,6.292968 L15.29175,6.292968 L15.30985,6.514648 L15.33085,6.925358 C15.38255,8.656368 14.91455,9.740718 13.65015,9.740718 L13.65015,9.740718 L9.55591,9.741028 L9.60108,9.881038 C10.02005,11.217788 10.18555,12.247488 10.08695,12.992388 C9.89815,14.419688 8.75318,15.633388 7.67652,15.272788 L7.67652,15.272788 L7.55713,15.226188 C7.03589,14.992888 6.86426,14.595988 6.70117,13.653488 L6.70117,13.653488 L6.54492,12.721688 L6.4978,12.506488 C6.4231,12.182088 6.33277,11.910688 6.21558,11.674688 C5.8313,10.900988 5.28443,10.233788 4.57056,9.670048 L4.57056,9.670048 L2.60156,9.670288 C1.71704,9.670288 1,8.953248 1,8.068728 L1,8.068728 L1,2.605228 C1,1.720708 1.71704,1.003601 2.60156,1.003601 L2.60156,1.003601 L4.83325,1 Z M11.55205,1.999998 L5.33301,1.999998 L5.33301,9.002988 L5.41699,9.071468 L5.6796615,9.30702243 C6.27568484,9.86814941 6.7534775,10.5097005 7.11109,11.230088 C7.23584,11.480988 7.33399,11.750888 7.4148,12.050988 L7.4148,12.050988 L7.50098,12.409088 L7.56079,12.715988 L7.69336,13.519388 L7.702515,13.5694255 L7.702515,13.5694255 L7.71167,13.617588 L7.76441,13.867488 L7.79384741,13.9820728 C7.85221673,14.1918227 7.90782571,14.2875166 7.96558,14.313488 C8.30152,14.463788 8.97461,13.775988 9.09571,12.861188 C9.17749,12.243388 9.00025,11.240388 8.55029,9.880678 C8.51196,9.764348 8.49854,9.641728 8.51099,9.520328 C8.55908,9.045288 8.98218,8.699098 9.45679,8.742858 L9.45679,8.742858 L13.65015,8.740718 L13.7287739,8.73472734 C14.2127395,8.6588777 14.42952,7.8633705 14.29595,6.382938 C14.18755,5.183288 13.83915,3.662168 13.54155,2.762938 L13.54155,2.762938 L13.50585,2.674618 L13.4594021,2.5911944 C13.216706,2.21352476 12.6088633,1.999998 11.55205,1.999998 L11.55205,1.999998 Z M4.33277,2.003598 L2.60156,2.003598 C2.26929,2.003598 2,2.272948 2,2.605228 L2,2.605228 L2,8.068668 L2.00781,8.166258 C2.05445,8.452148 2.30249,8.670288 2.60156,8.670288 L2.60156,8.670288 L4.33277,8.670598 L4.33277,2.003598 Z\"\r\n id=\"dislike\"\r\n fill=\"currentColor\"\r\n transform=\"translate(8.167337, 8.168474) scale(-1, 1) rotate(-180.000000) translate(-8.167337, -8.168474) \"\r\n ></path>\r\n </g>\r\n </svg>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}\n"] }]
|
|
5462
|
+
}], propDecorators: { width: [{
|
|
4909
5463
|
type: Input
|
|
4910
|
-
}],
|
|
5464
|
+
}], height: [{
|
|
4911
5465
|
type: Input
|
|
4912
|
-
}],
|
|
5466
|
+
}], isActive: [{
|
|
4913
5467
|
type: Input
|
|
4914
|
-
}],
|
|
5468
|
+
}], title: [{
|
|
5469
|
+
type: Input
|
|
5470
|
+
}], text: [{
|
|
5471
|
+
type: Input
|
|
5472
|
+
}], activeChange: [{
|
|
4915
5473
|
type: Output
|
|
4916
5474
|
}] } });
|
|
4917
5475
|
|
|
4918
|
-
class
|
|
4919
|
-
|
|
4920
|
-
|
|
4921
|
-
|
|
4922
|
-
|
|
4923
|
-
|
|
4924
|
-
|
|
4925
|
-
|
|
4926
|
-
|
|
4927
|
-
|
|
4928
|
-
exports: [PromptComponent],
|
|
4929
|
-
}]
|
|
4930
|
-
}] });
|
|
4931
|
-
|
|
4932
|
-
class LayoutAsideComponent {
|
|
4933
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutAsideComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4934
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: LayoutAsideComponent, isStandalone: true, selector: "mc-layout-aside", ngImport: i0, template: "<div class=\"mc-layout-aside\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n", styles: [""] }); }
|
|
5476
|
+
class RefreshIconComponent {
|
|
5477
|
+
constructor() {
|
|
5478
|
+
this.width = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
5479
|
+
this.height = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
5480
|
+
this.isActive = false;
|
|
5481
|
+
this.title = '';
|
|
5482
|
+
this.text = '';
|
|
5483
|
+
}
|
|
5484
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: RefreshIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5485
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: RefreshIconComponent, isStandalone: true, selector: "mc-refresh-icon", inputs: { width: "width", height: "height", isActive: "isActive", title: "title", text: "text" }, ngImport: i0, template: "<div class=\"mc-action-item\" [title]=\"title\">\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n >\r\n <g id=\"Re-generate\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <path\r\n d=\"M12.7143179,3.28587475 C13.981136,4.55339434 14.6666667,6.24406622 14.6666667,7.99999694 L14.6661599,8.02257215 C14.6655102,8.03703705 14.6642357,8.05147912 14.6623363,8.06585443 L14.6666667,7.99999694 C14.6666667,8.0371769 14.6626086,8.07340903 14.6549111,8.10827457 C14.6517992,8.1222052 14.6480389,8.13632563 14.6436512,8.15029154 C14.6390061,8.1651613 14.6336213,8.17980434 14.6275902,8.19410809 C14.6231995,8.20453649 14.6185439,8.21463293 14.613534,8.22459678 C14.6049463,8.24162018 14.5952425,8.2583947 14.5846307,8.27451859 C14.5792264,8.282804 14.5735765,8.29085725 14.5676615,8.2987751 C14.5571418,8.31280391 14.5460319,8.32617172 14.5342667,8.33892584 C14.5300122,8.343554 14.5251791,8.34859129 14.5202201,8.35355033 L14.5076464,8.36569453 C14.4940828,8.37834683 14.4798146,8.39025348 14.4649071,8.4013492 L14.5202201,8.35355033 C14.4937641,8.38000631 14.465081,8.40287777 14.4347743,8.42216473 C14.4224394,8.42996083 14.4098046,8.43724836 14.3968374,8.44398448 C14.3832773,8.45105337 14.3694473,8.45743098 14.3554103,8.46314429 C14.3412925,8.46891455 14.3266036,8.47413114 14.3116174,8.47866321 C14.2992824,8.48234275 14.2871467,8.4855024 14.2749295,8.48819956 C14.2606866,8.49139588 14.2459756,8.4939711 14.2310588,8.49588898 C14.2147923,8.49795142 14.1986607,8.49923861 14.1825093,8.49974745 L14.1666667,8.49999694 L14.1666667,8.49999694 L14.1394006,8.49925755 C14.1253117,8.49849283 14.1112491,8.49713493 14.0972533,8.49518384 L14.1666667,8.49999694 C14.1273209,8.49999694 14.0890366,8.49545228 14.05231,8.48685924 C14.0384692,8.48357481 14.0248075,8.47976105 14.0112962,8.4753569 C13.9958192,8.47034085 13.9804276,8.46445184 13.9654221,8.45784679 C13.9544183,8.45302561 13.9434536,8.44772707 13.9326545,8.4420051 C13.9165024,8.43339464 13.9009385,8.4240044 13.8859565,8.41382189 C13.8807017,8.41031248 13.8749119,8.40620635 13.8691922,8.40196243 L13.8550466,8.39103641 C13.8474863,8.38500359 13.8401047,8.3787561 13.8329113,8.37230316 L13.8131133,8.35355033 L12.6151133,7.15555033 C12.4198511,6.96028819 12.4198511,6.6437057 12.6151133,6.44844355 C12.7926243,6.27093251 13.0704001,6.25479514 13.2661411,6.40003145 L13.3222201,6.44844355 L13.498767,6.62598997 C13.2544588,5.64420827 12.7478288,4.73400934 12.0071133,3.99288367 C9.79437542,1.78014581 6.20562458,1.78014581 3.99288672,3.99288367 C1.78014071,6.20562968 1.78014071,9.79375159 3.99288672,12.0071102 C6.20562458,14.2198481 9.79437542,14.2198481 12.0071133,12.0071102 C12.2023754,11.8118481 12.5189579,11.8118481 12.7142201,12.0071102 C12.9094822,12.2023724 12.9094822,12.5189549 12.7142201,12.714217 C10.1109579,15.3174791 5.88904209,15.3174791 3.28573101,12.7141681 C0.682525952,10.1102423 0.682525952,5.88903088 3.28577994,3.28577688 C5.88904209,0.682514739 10.1109579,0.682514739 12.7143179,3.28587475 Z\"\r\n id=\"\u5F62\u72B6\u7ED3\u5408\"\r\n fill=\"currentColor\"\r\n />\r\n </g>\r\n </svg>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] }); }
|
|
4935
5486
|
}
|
|
4936
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type:
|
|
5487
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: RefreshIconComponent, decorators: [{
|
|
4937
5488
|
type: Component,
|
|
4938
|
-
args: [{ selector: 'mc-
|
|
4939
|
-
}]
|
|
4940
|
-
|
|
4941
|
-
|
|
4942
|
-
|
|
4943
|
-
|
|
4944
|
-
|
|
4945
|
-
|
|
4946
|
-
|
|
4947
|
-
|
|
4948
|
-
|
|
4949
|
-
|
|
4950
|
-
declarations: [],
|
|
4951
|
-
imports: [
|
|
4952
|
-
CommonModule,
|
|
4953
|
-
LayoutAsideComponent,
|
|
4954
|
-
],
|
|
4955
|
-
exports: [
|
|
4956
|
-
LayoutAsideComponent,
|
|
4957
|
-
]
|
|
4958
|
-
}]
|
|
4959
|
-
}] });
|
|
5489
|
+
args: [{ selector: 'mc-refresh-icon', standalone: true, imports: [CommonModule], template: "<div class=\"mc-action-item\" [title]=\"title\">\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n >\r\n <g id=\"Re-generate\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <path\r\n d=\"M12.7143179,3.28587475 C13.981136,4.55339434 14.6666667,6.24406622 14.6666667,7.99999694 L14.6661599,8.02257215 C14.6655102,8.03703705 14.6642357,8.05147912 14.6623363,8.06585443 L14.6666667,7.99999694 C14.6666667,8.0371769 14.6626086,8.07340903 14.6549111,8.10827457 C14.6517992,8.1222052 14.6480389,8.13632563 14.6436512,8.15029154 C14.6390061,8.1651613 14.6336213,8.17980434 14.6275902,8.19410809 C14.6231995,8.20453649 14.6185439,8.21463293 14.613534,8.22459678 C14.6049463,8.24162018 14.5952425,8.2583947 14.5846307,8.27451859 C14.5792264,8.282804 14.5735765,8.29085725 14.5676615,8.2987751 C14.5571418,8.31280391 14.5460319,8.32617172 14.5342667,8.33892584 C14.5300122,8.343554 14.5251791,8.34859129 14.5202201,8.35355033 L14.5076464,8.36569453 C14.4940828,8.37834683 14.4798146,8.39025348 14.4649071,8.4013492 L14.5202201,8.35355033 C14.4937641,8.38000631 14.465081,8.40287777 14.4347743,8.42216473 C14.4224394,8.42996083 14.4098046,8.43724836 14.3968374,8.44398448 C14.3832773,8.45105337 14.3694473,8.45743098 14.3554103,8.46314429 C14.3412925,8.46891455 14.3266036,8.47413114 14.3116174,8.47866321 C14.2992824,8.48234275 14.2871467,8.4855024 14.2749295,8.48819956 C14.2606866,8.49139588 14.2459756,8.4939711 14.2310588,8.49588898 C14.2147923,8.49795142 14.1986607,8.49923861 14.1825093,8.49974745 L14.1666667,8.49999694 L14.1666667,8.49999694 L14.1394006,8.49925755 C14.1253117,8.49849283 14.1112491,8.49713493 14.0972533,8.49518384 L14.1666667,8.49999694 C14.1273209,8.49999694 14.0890366,8.49545228 14.05231,8.48685924 C14.0384692,8.48357481 14.0248075,8.47976105 14.0112962,8.4753569 C13.9958192,8.47034085 13.9804276,8.46445184 13.9654221,8.45784679 C13.9544183,8.45302561 13.9434536,8.44772707 13.9326545,8.4420051 C13.9165024,8.43339464 13.9009385,8.4240044 13.8859565,8.41382189 C13.8807017,8.41031248 13.8749119,8.40620635 13.8691922,8.40196243 L13.8550466,8.39103641 C13.8474863,8.38500359 13.8401047,8.3787561 13.8329113,8.37230316 L13.8131133,8.35355033 L12.6151133,7.15555033 C12.4198511,6.96028819 12.4198511,6.6437057 12.6151133,6.44844355 C12.7926243,6.27093251 13.0704001,6.25479514 13.2661411,6.40003145 L13.3222201,6.44844355 L13.498767,6.62598997 C13.2544588,5.64420827 12.7478288,4.73400934 12.0071133,3.99288367 C9.79437542,1.78014581 6.20562458,1.78014581 3.99288672,3.99288367 C1.78014071,6.20562968 1.78014071,9.79375159 3.99288672,12.0071102 C6.20562458,14.2198481 9.79437542,14.2198481 12.0071133,12.0071102 C12.2023754,11.8118481 12.5189579,11.8118481 12.7142201,12.0071102 C12.9094822,12.2023724 12.9094822,12.5189549 12.7142201,12.714217 C10.1109579,15.3174791 5.88904209,15.3174791 3.28573101,12.7141681 C0.682525952,10.1102423 0.682525952,5.88903088 3.28577994,3.28577688 C5.88904209,0.682514739 10.1109579,0.682514739 12.7143179,3.28587475 Z\"\r\n id=\"\u5F62\u72B6\u7ED3\u5408\"\r\n fill=\"currentColor\"\r\n />\r\n </g>\r\n </svg>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}\n"] }]
|
|
5490
|
+
}], propDecorators: { width: [{
|
|
5491
|
+
type: Input
|
|
5492
|
+
}], height: [{
|
|
5493
|
+
type: Input
|
|
5494
|
+
}], isActive: [{
|
|
5495
|
+
type: Input
|
|
5496
|
+
}], title: [{
|
|
5497
|
+
type: Input
|
|
5498
|
+
}], text: [{
|
|
5499
|
+
type: Input
|
|
5500
|
+
}] } });
|
|
4960
5501
|
|
|
4961
|
-
class
|
|
4962
|
-
constructor(
|
|
4963
|
-
|
|
5502
|
+
class ShareIconComponent {
|
|
5503
|
+
constructor() {
|
|
5504
|
+
this.width = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
5505
|
+
this.height = TOOLBAR_ICON_SIZE_DEFAULT_VALUE;
|
|
5506
|
+
this.isActive = false;
|
|
5507
|
+
this.title = '';
|
|
5508
|
+
this.text = '';
|
|
4964
5509
|
}
|
|
5510
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ShareIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5511
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: ShareIconComponent, isStandalone: true, selector: "mc-share-icon", inputs: { width: "width", height: "height", isActive: "isActive", title: "title", text: "text" }, ngImport: i0, template: "<div class=\"mc-action-item\" [title]=\"title\">\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n >\r\n <desc>Created with Sketch.</desc>\r\n <g id=\"\u91CA\u4E49\u56FE\u6807/\u5206\u4EAB\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <g id=\"\u5206\u4EAB\" fill=\"currentColor\" fill-rule=\"nonzero\">\r\n <path d=\"M6.3804718,9.82599637 C5.83206631,10.5398588 4.96976903,11 4,11 C2.34314575,11 1,9.65685425 1,8 C1,6.34314575 2.34314575,5 4,5 C4.96976903,5 5.83206631,5.46014123 6.3804718,6.17400363 L10.1006387,4.20450353 C10.0351367,3.98105658 10,3.7446316 10,3.5 C10,2.11928813 11.1192881,1 12.5,1 C13.8807119,1 15,2.11928813 15,3.5 C15,4.88071187 13.8807119,6 12.5,6 C11.7223166,6 11.0275695,5.64490757 10.5690501,5.08801416 L6.84895235,7.0574777 C6.94695785,7.35387727 7,7.67074431 7,8 C7,8.32925569 6.94695785,8.64612273 6.84895235,8.9425223 L10.5690501,10.9119858 C11.0275695,10.3550924 11.7223166,10 12.5,10 C13.8807119,10 15,11.1192881 15,12.5 C15,13.8807119 13.8807119,15 12.5,15 C11.1192881,15 10,13.8807119 10,12.5 C10,12.2553684 10.0351367,12.0189434 10.1006387,11.7954965 L6.3804718,9.82599637 L6.3804718,9.82599637 Z M4,10 C5.1045695,10 6,9.1045695 6,8 C6,6.8954305 5.1045695,6 4,6 C2.8954305,6 2,6.8954305 2,8 C2,9.1045695 2.8954305,10 4,10 Z M12.5,14 C13.3284271,14 14,13.3284271 14,12.5 C14,11.6715729 13.3284271,11 12.5,11 C11.6715729,11 11,11.6715729 11,12.5 C11,13.3284271 11.6715729,14 12.5,14 Z M12.5,5 C13.3284271,5 14,4.32842712 14,3.5 C14,2.67157288 13.3284271,2 12.5,2 C11.6715729,2 11,2.67157288 11,3.5 C11,4.32842712 11.6715729,5 12.5,5 Z\" id=\"\u5F62\u72B6\"/>\r\n </g>\r\n </g>\r\n </svg>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] }); }
|
|
4965
5512
|
}
|
|
4966
|
-
|
|
4967
|
-
class ArrowDownIconComponent {
|
|
4968
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ArrowDownIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4969
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: ArrowDownIconComponent, isStandalone: true, selector: "mc-arrow-down-icon", ngImport: i0, template: "<svg t=\"1773994085709\" class=\"icon\" viewBox=\"0 0 1024 1024\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" p-id=\"4044\" width=\"16\" height=\"16\">\r\n <path d=\"M898.133333 512c-12.8-12.8-32-12.8-44.8-2.133333L544 800V149.333333c0-17.066667-14.933333-32-32-32s-32 14.933333-32 32v650.666667L170.666667 509.866667c-12.8-12.8-34.133333-10.666667-44.8 2.133333-12.8 12.8-10.666667 34.133333 2.133333 44.8l362.666667 341.333333c2.133333 2.133333 6.4 4.266667 8.533333 6.4 4.266667 2.133333 6.4 2.133333 10.666667 2.133334s8.533333 0 10.666666-2.133334c4.266667-2.133333 6.4-4.266667 8.533334-6.4l362.666666-341.333333c17.066667-12.8 19.2-32 6.4-44.8z\" fill=\"#666666\" p-id=\"4045\"></path>\r\n</svg>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }] }); }
|
|
4970
|
-
}
|
|
4971
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ArrowDownIconComponent, decorators: [{
|
|
5513
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ShareIconComponent, decorators: [{
|
|
4972
5514
|
type: Component,
|
|
4973
|
-
args: [{ selector: 'mc-
|
|
4974
|
-
}]
|
|
5515
|
+
args: [{ selector: 'mc-share-icon', standalone: true, imports: [CommonModule], template: "<div class=\"mc-action-item\" [title]=\"title\">\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n [attr.width]=\"width\"\r\n [attr.height]=\"height\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n >\r\n <desc>Created with Sketch.</desc>\r\n <g id=\"\u91CA\u4E49\u56FE\u6807/\u5206\u4EAB\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <g id=\"\u5206\u4EAB\" fill=\"currentColor\" fill-rule=\"nonzero\">\r\n <path d=\"M6.3804718,9.82599637 C5.83206631,10.5398588 4.96976903,11 4,11 C2.34314575,11 1,9.65685425 1,8 C1,6.34314575 2.34314575,5 4,5 C4.96976903,5 5.83206631,5.46014123 6.3804718,6.17400363 L10.1006387,4.20450353 C10.0351367,3.98105658 10,3.7446316 10,3.5 C10,2.11928813 11.1192881,1 12.5,1 C13.8807119,1 15,2.11928813 15,3.5 C15,4.88071187 13.8807119,6 12.5,6 C11.7223166,6 11.0275695,5.64490757 10.5690501,5.08801416 L6.84895235,7.0574777 C6.94695785,7.35387727 7,7.67074431 7,8 C7,8.32925569 6.94695785,8.64612273 6.84895235,8.9425223 L10.5690501,10.9119858 C11.0275695,10.3550924 11.7223166,10 12.5,10 C13.8807119,10 15,11.1192881 15,12.5 C15,13.8807119 13.8807119,15 12.5,15 C11.1192881,15 10,13.8807119 10,12.5 C10,12.2553684 10.0351367,12.0189434 10.1006387,11.7954965 L6.3804718,9.82599637 L6.3804718,9.82599637 Z M4,10 C5.1045695,10 6,9.1045695 6,8 C6,6.8954305 5.1045695,6 4,6 C2.8954305,6 2,6.8954305 2,8 C2,9.1045695 2.8954305,10 4,10 Z M12.5,14 C13.3284271,14 14,13.3284271 14,12.5 C14,11.6715729 13.3284271,11 12.5,11 C11.6715729,11 11,11.6715729 11,12.5 C11,13.3284271 11.6715729,14 12.5,14 Z M12.5,5 C13.3284271,5 14,4.32842712 14,3.5 C14,2.67157288 13.3284271,2 12.5,2 C11.6715729,2 11,2.67157288 11,3.5 C11,4.32842712 11.6715729,5 12.5,5 Z\" id=\"\u5F62\u72B6\"/>\r\n </g>\r\n </g>\r\n </svg>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}\n"] }]
|
|
5516
|
+
}], propDecorators: { width: [{
|
|
5517
|
+
type: Input
|
|
5518
|
+
}], height: [{
|
|
5519
|
+
type: Input
|
|
5520
|
+
}], isActive: [{
|
|
5521
|
+
type: Input
|
|
5522
|
+
}], title: [{
|
|
5523
|
+
type: Input
|
|
5524
|
+
}], text: [{
|
|
5525
|
+
type: Input
|
|
5526
|
+
}] } });
|
|
4975
5527
|
|
|
4976
|
-
|
|
4977
|
-
|
|
4978
|
-
|
|
4979
|
-
|
|
4980
|
-
|
|
4981
|
-
|
|
4982
|
-
|
|
4983
|
-
|
|
5528
|
+
var ToolbarAction;
|
|
5529
|
+
(function (ToolbarAction) {
|
|
5530
|
+
ToolbarAction["COPY"] = "copy";
|
|
5531
|
+
ToolbarAction["LIKE"] = "like";
|
|
5532
|
+
ToolbarAction["DISLIKE"] = "dislike";
|
|
5533
|
+
ToolbarAction["REFRESH"] = "refresh";
|
|
5534
|
+
ToolbarAction["SHARE"] = "share";
|
|
5535
|
+
ToolbarAction["DELETE"] = "delete";
|
|
5536
|
+
})(ToolbarAction || (ToolbarAction = {}));
|
|
4984
5537
|
|
|
4985
|
-
class
|
|
5538
|
+
class ToolbarComponent {
|
|
4986
5539
|
constructor() {
|
|
4987
|
-
|
|
4988
|
-
|
|
4989
|
-
this.
|
|
4990
|
-
this.
|
|
4991
|
-
|
|
4992
|
-
this.
|
|
4993
|
-
|
|
4994
|
-
this.
|
|
4995
|
-
|
|
4996
|
-
this.
|
|
4997
|
-
|
|
4998
|
-
});
|
|
4999
|
-
this.wheelHandler = (event) => {
|
|
5000
|
-
if (!this.scrollerRef.nativeElement) {
|
|
5001
|
-
return;
|
|
5002
|
-
}
|
|
5003
|
-
const isBottom = Math.abs(this.scrollerRef.nativeElement.scrollTop +
|
|
5004
|
-
this.scrollerRef.nativeElement.clientHeight -
|
|
5005
|
-
this.scrollerRef.nativeElement.scrollHeight) < 32;
|
|
5006
|
-
if (event.deltaY !== 0) {
|
|
5007
|
-
this.userControl = !isBottom;
|
|
5008
|
-
}
|
|
5009
|
-
this.onScrollerWheel.emit(event);
|
|
5010
|
-
};
|
|
5011
|
-
this.scrollHandler = debounce((event) => {
|
|
5012
|
-
const target = event.target;
|
|
5013
|
-
if (!target) {
|
|
5014
|
-
return;
|
|
5015
|
-
}
|
|
5016
|
-
this.showUpArrow = target.scrollTop !== 0;
|
|
5017
|
-
this.showDownArrow =
|
|
5018
|
-
target.scrollTop + target.clientHeight + 32 < target.scrollHeight;
|
|
5019
|
-
this.onScrollerScroll.emit(event);
|
|
5020
|
-
}, 100);
|
|
5021
|
-
this.scrollToPosition = (position) => {
|
|
5022
|
-
if (this.scrollerRef.nativeElement) {
|
|
5023
|
-
this.scrollerRef.nativeElement.scrollTo({
|
|
5024
|
-
top: position,
|
|
5025
|
-
behavior: 'smooth',
|
|
5026
|
-
});
|
|
5027
|
-
}
|
|
5028
|
-
};
|
|
5029
|
-
this.scrollToBottom = () => {
|
|
5030
|
-
this.scrollToPosition(this.scrollerRef.nativeElement?.scrollHeight ?? 0);
|
|
5031
|
-
};
|
|
5032
|
-
this.scrollToTop = () => {
|
|
5033
|
-
this.scrollToPosition(0);
|
|
5034
|
-
};
|
|
5035
|
-
this.updateScroll = (force = false) => {
|
|
5036
|
-
if (!this.autoScroll) {
|
|
5037
|
-
return;
|
|
5038
|
-
}
|
|
5039
|
-
if (this.userControl && !force) {
|
|
5040
|
-
return;
|
|
5041
|
-
}
|
|
5042
|
-
this.scrollToBottom();
|
|
5043
|
-
};
|
|
5540
|
+
// 输入属性
|
|
5541
|
+
this.items = [];
|
|
5542
|
+
this.gap = TOOLBAR_GAP_DEFAULT_VALUE; // 默认间距
|
|
5543
|
+
this.iconSize = TOOLBAR_ICON_SIZE_DEFAULT_VALUE; // 默认图标大小
|
|
5544
|
+
// 输出事件
|
|
5545
|
+
this.onClick = new EventEmitter();
|
|
5546
|
+
// 用户自定义插槽映射
|
|
5547
|
+
this.CustomSlotComponent = {};
|
|
5548
|
+
// 响应式操作项(深拷贝避免修改原数据)
|
|
5549
|
+
this.actionItems = [];
|
|
5550
|
+
this.ToolbarAction = ToolbarAction;
|
|
5044
5551
|
}
|
|
5045
5552
|
ngOnInit() {
|
|
5046
|
-
|
|
5047
|
-
this.
|
|
5553
|
+
// 深拷贝输入的items
|
|
5554
|
+
this.actionItems = this.items?.map((item) => ({ ...item }));
|
|
5555
|
+
// 初始化点赞/点踩互斥
|
|
5556
|
+
this.init();
|
|
5048
5557
|
}
|
|
5049
|
-
|
|
5050
|
-
|
|
5051
|
-
this.
|
|
5052
|
-
|
|
5558
|
+
ngAfterContentInit() {
|
|
5559
|
+
// 初始化阶段:解析所有模板的变量名,构建映射关系
|
|
5560
|
+
this.allTemplates.forEach((template) => {
|
|
5561
|
+
// 通过模板的 nativeElement 获取其变量名(#xxx 中的 xxx)
|
|
5562
|
+
const templateName = template._declarationTContainer?.localNames?.[0];
|
|
5563
|
+
if (templateName) {
|
|
5564
|
+
this.CustomSlotComponent[templateName] = template;
|
|
5565
|
+
}
|
|
5566
|
+
});
|
|
5567
|
+
console.log('ngAfterContentInit', this.CustomSlotComponent);
|
|
5053
5568
|
}
|
|
5054
|
-
|
|
5055
|
-
|
|
5056
|
-
this.removeListener();
|
|
5057
|
-
super.ngOnDestroy();
|
|
5569
|
+
trackByKey(index, item) {
|
|
5570
|
+
return item.key;
|
|
5058
5571
|
}
|
|
5059
|
-
|
|
5060
|
-
|
|
5061
|
-
|
|
5062
|
-
|
|
5063
|
-
|
|
5064
|
-
|
|
5065
|
-
|
|
5066
|
-
};
|
|
5572
|
+
/** 初始化:确保点赞和点踩不同时激活 */
|
|
5573
|
+
init() {
|
|
5574
|
+
const likeAction = this.actionItems.find((item) => item.icon === ToolbarAction.LIKE);
|
|
5575
|
+
const dislikeAction = this.actionItems.find((item) => item.icon === ToolbarAction.DISLIKE);
|
|
5576
|
+
if (likeAction?.isActive && dislikeAction) {
|
|
5577
|
+
dislikeAction.isActive = false;
|
|
5578
|
+
}
|
|
5067
5579
|
}
|
|
5068
|
-
|
|
5069
|
-
|
|
5070
|
-
this.
|
|
5580
|
+
/** 点赞点击处理:取消点踩状态 */
|
|
5581
|
+
handleLikeClick() {
|
|
5582
|
+
const dislikeAction = this.actionItems.find((item) => item.icon === ToolbarAction.DISLIKE);
|
|
5583
|
+
if (dislikeAction) {
|
|
5584
|
+
dislikeAction.isActive = false;
|
|
5585
|
+
}
|
|
5071
5586
|
}
|
|
5072
|
-
|
|
5073
|
-
|
|
5074
|
-
this.
|
|
5587
|
+
/** 点踩点击处理:取消点赞状态 */
|
|
5588
|
+
handleDislikeClick() {
|
|
5589
|
+
const likeAction = this.actionItems.find((item) => item.icon === ToolbarAction.LIKE);
|
|
5590
|
+
if (likeAction) {
|
|
5591
|
+
likeAction.isActive = false;
|
|
5592
|
+
}
|
|
5075
5593
|
}
|
|
5076
|
-
|
|
5077
|
-
|
|
5594
|
+
/** 操作项点击事件 */
|
|
5595
|
+
actionClick(event, actionItem) {
|
|
5596
|
+
// 处理点赞/点踩互斥
|
|
5597
|
+
if (actionItem.icon === ToolbarAction.LIKE) {
|
|
5598
|
+
this.handleLikeClick();
|
|
5599
|
+
}
|
|
5600
|
+
else if (actionItem.icon === ToolbarAction.DISLIKE) {
|
|
5601
|
+
this.handleDislikeClick();
|
|
5602
|
+
}
|
|
5603
|
+
console.log('actionClick', event, actionItem);
|
|
5604
|
+
// 执行item自身的点击回调
|
|
5605
|
+
if (actionItem.onClick) {
|
|
5606
|
+
actionItem.onClick(actionItem, event);
|
|
5607
|
+
}
|
|
5608
|
+
// 触发组件输出事件
|
|
5609
|
+
this.onClick.emit({ item: actionItem, event });
|
|
5610
|
+
}
|
|
5611
|
+
/** 激活状态变更 */
|
|
5612
|
+
activeChange(isActive, actionItem) {
|
|
5613
|
+
actionItem.isActive = isActive;
|
|
5614
|
+
}
|
|
5615
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5616
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: ToolbarComponent, isStandalone: true, selector: "mc-toolbar", inputs: { items: "items", gap: "gap", iconSize: "iconSize" }, outputs: { onClick: "onClick" }, queries: [{ propertyName: "allTemplates", predicate: TemplateRef, read: TemplateRef }], ngImport: i0, template: "<div class=\"mc-actions\" [style.gap.px]=\"gap\">\r\n <!-- \u904D\u5386\u64CD\u4F5C\u9879 -->\r\n <ng-container *ngFor=\"let item of actionItems; trackBy: trackByKey\">\r\n <!-- \u6574\u4E2A\u64CD\u4F5C\u9879\u81EA\u5B9A\u4E49 -->\r\n <ng-container *ngTemplateOutlet=\"CustomSlotComponent[item.key]\"></ng-container>\r\n\r\n <ng-container *ngIf=\"!CustomSlotComponent[item.key]\">\r\n <!-- \u53EA\u81EA\u5B9A\u4E49Icon\u90E8\u5206 -->\r\n <div\r\n *ngIf=\"CustomSlotComponent[item.key + 'Icon']\"\r\n class=\"mc-action-item\"\r\n [title]=\"item.label\"\r\n (click)=\"actionClick($event, item)\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"CustomSlotComponent[item.key + 'Icon']; context: { actionData: item }\"></ng-container>\r\n </div>\r\n\r\n <!-- \u5B8C\u5168\u4F7F\u7528\u5185\u7F6E\u7EC4\u4EF6\u60C5\u51B5 -->\r\n <mc-copy-icon\r\n *ngIf=\"item.icon === ToolbarAction.COPY\"\r\n [width]=\"iconSize\"\r\n [height]=\"iconSize\"\r\n [text]=\"item.text ?? ''\"\r\n [title]=\"item.label ?? ''\"\r\n (click)=\"actionClick($event, item)\"\r\n ></mc-copy-icon>\r\n <mc-delete-icon\r\n *ngIf=\"item.icon === ToolbarAction.DELETE\"\r\n [width]=\"iconSize\"\r\n [height]=\"iconSize\"\r\n [title]=\"item.label ?? ''\"\r\n (click)=\"actionClick($event, item)\"\r\n ></mc-delete-icon>\r\n <mc-refresh-icon\r\n *ngIf=\"item.icon === ToolbarAction.REFRESH\"\r\n [width]=\"iconSize\"\r\n [height]=\"iconSize\"\r\n [title]=\"item.label ?? ''\"\r\n (click)=\"actionClick($event, item)\"\r\n ></mc-refresh-icon>\r\n <mc-share-icon\r\n *ngIf=\"item.icon === ToolbarAction.SHARE\"\r\n [width]=\"iconSize\"\r\n [height]=\"iconSize\"\r\n [title]=\"item.label ?? ''\"\r\n (click)=\"actionClick($event, item)\"\r\n ></mc-share-icon>\r\n <mc-like-icon\r\n *ngIf=\"item.icon === ToolbarAction.LIKE\"\r\n [isActive]=\"item.isActive ?? false\"\r\n [width]=\"iconSize\"\r\n [height]=\"iconSize\"\r\n [title]=\"item.label ?? ''\"\r\n (activeChange)=\"activeChange($event, item)\"\r\n (click)=\"actionClick($event, item)\"\r\n ></mc-like-icon>\r\n <mc-dislike-icon\r\n *ngIf=\"item.icon === ToolbarAction.DISLIKE\"\r\n [isActive]=\"item.isActive ?? false\"\r\n [width]=\"iconSize\"\r\n [height]=\"iconSize\"\r\n [title]=\"item.label ?? ''\"\r\n (activeChange)=\"activeChange($event, item)\"\r\n (click)=\"actionClick($event, item)\"\r\n ></mc-dislike-icon>\r\n </ng-container>\r\n </ng-container>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}:host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: CopyIconComponent, selector: "mc-copy-icon", inputs: ["width", "height", "isActive", "text", "title"] }, { kind: "component", type: DeleteIconComponent, selector: "mc-delete-icon", inputs: ["width", "height", "isActive", "title", "text"] }, { kind: "component", type: RefreshIconComponent, selector: "mc-refresh-icon", inputs: ["width", "height", "isActive", "title", "text"] }, { kind: "component", type: ShareIconComponent, selector: "mc-share-icon", inputs: ["width", "height", "isActive", "title", "text"] }, { kind: "component", type: LikeIconComponent, selector: "mc-like-icon", inputs: ["width", "height", "isActive", "title", "text"], outputs: ["activeChange"] }, { kind: "component", type: DislikeIconComponent, selector: "mc-dislike-icon", inputs: ["width", "height", "isActive", "title", "text"], outputs: ["activeChange"] }] }); }
|
|
5078
5617
|
}
|
|
5079
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type:
|
|
5618
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ToolbarComponent, decorators: [{
|
|
5080
5619
|
type: Component,
|
|
5081
|
-
args: [{ selector: 'mc-
|
|
5082
|
-
|
|
5620
|
+
args: [{ selector: 'mc-toolbar', standalone: true, imports: [
|
|
5621
|
+
CommonModule,
|
|
5622
|
+
CopyIconComponent,
|
|
5623
|
+
DeleteIconComponent,
|
|
5624
|
+
RefreshIconComponent,
|
|
5625
|
+
ShareIconComponent,
|
|
5626
|
+
LikeIconComponent,
|
|
5627
|
+
DislikeIconComponent,
|
|
5628
|
+
], template: "<div class=\"mc-actions\" [style.gap.px]=\"gap\">\r\n <!-- \u904D\u5386\u64CD\u4F5C\u9879 -->\r\n <ng-container *ngFor=\"let item of actionItems; trackBy: trackByKey\">\r\n <!-- \u6574\u4E2A\u64CD\u4F5C\u9879\u81EA\u5B9A\u4E49 -->\r\n <ng-container *ngTemplateOutlet=\"CustomSlotComponent[item.key]\"></ng-container>\r\n\r\n <ng-container *ngIf=\"!CustomSlotComponent[item.key]\">\r\n <!-- \u53EA\u81EA\u5B9A\u4E49Icon\u90E8\u5206 -->\r\n <div\r\n *ngIf=\"CustomSlotComponent[item.key + 'Icon']\"\r\n class=\"mc-action-item\"\r\n [title]=\"item.label\"\r\n (click)=\"actionClick($event, item)\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"CustomSlotComponent[item.key + 'Icon']; context: { actionData: item }\"></ng-container>\r\n </div>\r\n\r\n <!-- \u5B8C\u5168\u4F7F\u7528\u5185\u7F6E\u7EC4\u4EF6\u60C5\u51B5 -->\r\n <mc-copy-icon\r\n *ngIf=\"item.icon === ToolbarAction.COPY\"\r\n [width]=\"iconSize\"\r\n [height]=\"iconSize\"\r\n [text]=\"item.text ?? ''\"\r\n [title]=\"item.label ?? ''\"\r\n (click)=\"actionClick($event, item)\"\r\n ></mc-copy-icon>\r\n <mc-delete-icon\r\n *ngIf=\"item.icon === ToolbarAction.DELETE\"\r\n [width]=\"iconSize\"\r\n [height]=\"iconSize\"\r\n [title]=\"item.label ?? ''\"\r\n (click)=\"actionClick($event, item)\"\r\n ></mc-delete-icon>\r\n <mc-refresh-icon\r\n *ngIf=\"item.icon === ToolbarAction.REFRESH\"\r\n [width]=\"iconSize\"\r\n [height]=\"iconSize\"\r\n [title]=\"item.label ?? ''\"\r\n (click)=\"actionClick($event, item)\"\r\n ></mc-refresh-icon>\r\n <mc-share-icon\r\n *ngIf=\"item.icon === ToolbarAction.SHARE\"\r\n [width]=\"iconSize\"\r\n [height]=\"iconSize\"\r\n [title]=\"item.label ?? ''\"\r\n (click)=\"actionClick($event, item)\"\r\n ></mc-share-icon>\r\n <mc-like-icon\r\n *ngIf=\"item.icon === ToolbarAction.LIKE\"\r\n [isActive]=\"item.isActive ?? false\"\r\n [width]=\"iconSize\"\r\n [height]=\"iconSize\"\r\n [title]=\"item.label ?? ''\"\r\n (activeChange)=\"activeChange($event, item)\"\r\n (click)=\"actionClick($event, item)\"\r\n ></mc-like-icon>\r\n <mc-dislike-icon\r\n *ngIf=\"item.icon === ToolbarAction.DISLIKE\"\r\n [isActive]=\"item.isActive ?? false\"\r\n [width]=\"iconSize\"\r\n [height]=\"iconSize\"\r\n [title]=\"item.label ?? ''\"\r\n (activeChange)=\"activeChange($event, item)\"\r\n (click)=\"actionClick($event, item)\"\r\n ></mc-dislike-icon>\r\n </ng-container>\r\n </ng-container>\r\n</div>\r\n", styles: [".mc-actions{display:inline-flex;align-items:center}.mc-action-item{cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;color:var(--devui-text, #252b3a)}.mc-action-item:hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3)}:host{display:block}\n"] }]
|
|
5629
|
+
}], ctorParameters: () => [], propDecorators: { items: [{
|
|
5083
5630
|
type: Input
|
|
5084
|
-
}],
|
|
5631
|
+
}], gap: [{
|
|
5085
5632
|
type: Input
|
|
5086
|
-
}],
|
|
5087
|
-
type:
|
|
5088
|
-
}],
|
|
5633
|
+
}], iconSize: [{
|
|
5634
|
+
type: Input
|
|
5635
|
+
}], onClick: [{
|
|
5089
5636
|
type: Output
|
|
5090
|
-
}],
|
|
5091
|
-
type:
|
|
5092
|
-
args: [
|
|
5093
|
-
}], contentRef: [{
|
|
5094
|
-
type: ViewChild,
|
|
5095
|
-
args: ['contentRef']
|
|
5637
|
+
}], allTemplates: [{
|
|
5638
|
+
type: ContentChildren,
|
|
5639
|
+
args: [TemplateRef, { read: TemplateRef }]
|
|
5096
5640
|
}] } });
|
|
5097
5641
|
|
|
5098
|
-
class
|
|
5099
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type:
|
|
5100
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.10", ngImport: i0, type:
|
|
5101
|
-
|
|
5102
|
-
|
|
5103
|
-
|
|
5104
|
-
|
|
5105
|
-
|
|
5106
|
-
|
|
5107
|
-
|
|
5108
|
-
|
|
5109
|
-
|
|
5110
|
-
|
|
5111
|
-
|
|
5112
|
-
|
|
5113
|
-
|
|
5114
|
-
|
|
5115
|
-
|
|
5116
|
-
|
|
5117
|
-
|
|
5118
|
-
|
|
5119
|
-
|
|
5120
|
-
|
|
5121
|
-
|
|
5122
|
-
}
|
|
5123
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutHeaderComponent, decorators: [{
|
|
5124
|
-
type: Component,
|
|
5125
|
-
args: [{ selector: 'mc-layout-header', standalone: true, template: "<div class=\"mc-layout-header\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n", styles: [".mc-layout-header{flex:0 0 auto;min-height:40px}\n"] }]
|
|
5126
|
-
}] });
|
|
5127
|
-
|
|
5128
|
-
class LayoutHeaderModule {
|
|
5129
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutHeaderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
5130
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.10", ngImport: i0, type: LayoutHeaderModule, imports: [CommonModule,
|
|
5131
|
-
LayoutHeaderComponent], exports: [LayoutHeaderComponent] }); }
|
|
5132
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutHeaderModule, imports: [CommonModule] }); }
|
|
5133
|
-
}
|
|
5134
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutHeaderModule, decorators: [{
|
|
5135
|
-
type: NgModule,
|
|
5136
|
-
args: [{
|
|
5137
|
-
declarations: [],
|
|
5138
|
-
imports: [
|
|
5139
|
-
CommonModule,
|
|
5140
|
-
LayoutHeaderComponent,
|
|
5141
|
-
],
|
|
5142
|
-
exports: [
|
|
5143
|
-
LayoutHeaderComponent,
|
|
5144
|
-
]
|
|
5145
|
-
}]
|
|
5146
|
-
}] });
|
|
5147
|
-
|
|
5148
|
-
class LayoutComponent {
|
|
5149
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5150
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: LayoutComponent, isStandalone: true, selector: "mc-layout", ngImport: i0, template: "<div class=\"mc-layout\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n", styles: [".mc-layout{display:flex;flex:auto;flex-direction:column}.mc-layout-aside{flex-direction:row}\n"] }); }
|
|
5151
|
-
}
|
|
5152
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutComponent, decorators: [{
|
|
5153
|
-
type: Component,
|
|
5154
|
-
args: [{ selector: 'mc-layout', standalone: true, template: "<div class=\"mc-layout\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n", styles: [".mc-layout{display:flex;flex:auto;flex-direction:column}.mc-layout-aside{flex-direction:row}\n"] }]
|
|
5155
|
-
}] });
|
|
5156
|
-
|
|
5157
|
-
class LayoutModule {
|
|
5158
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
5159
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.10", ngImport: i0, type: LayoutModule, imports: [CommonModule,
|
|
5160
|
-
LayoutComponent], exports: [LayoutComponent] }); }
|
|
5161
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutModule, imports: [CommonModule] }); }
|
|
5642
|
+
class ToolbarModule {
|
|
5643
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ToolbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
5644
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.10", ngImport: i0, type: ToolbarModule, imports: [CommonModule,
|
|
5645
|
+
ToolbarComponent,
|
|
5646
|
+
CopyIconComponent,
|
|
5647
|
+
DeleteIconComponent,
|
|
5648
|
+
RefreshIconComponent,
|
|
5649
|
+
ShareIconComponent,
|
|
5650
|
+
LikeIconComponent,
|
|
5651
|
+
DislikeIconComponent], exports: [ToolbarComponent,
|
|
5652
|
+
CopyIconComponent,
|
|
5653
|
+
DeleteIconComponent,
|
|
5654
|
+
RefreshIconComponent,
|
|
5655
|
+
ShareIconComponent,
|
|
5656
|
+
LikeIconComponent,
|
|
5657
|
+
DislikeIconComponent] }); }
|
|
5658
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ToolbarModule, imports: [CommonModule,
|
|
5659
|
+
ToolbarComponent,
|
|
5660
|
+
CopyIconComponent,
|
|
5661
|
+
DeleteIconComponent,
|
|
5662
|
+
RefreshIconComponent,
|
|
5663
|
+
ShareIconComponent,
|
|
5664
|
+
LikeIconComponent,
|
|
5665
|
+
DislikeIconComponent] }); }
|
|
5162
5666
|
}
|
|
5163
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type:
|
|
5667
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ToolbarModule, decorators: [{
|
|
5164
5668
|
type: NgModule,
|
|
5165
5669
|
args: [{
|
|
5166
5670
|
declarations: [],
|
|
5167
5671
|
imports: [
|
|
5168
5672
|
CommonModule,
|
|
5169
|
-
|
|
5673
|
+
ToolbarComponent,
|
|
5674
|
+
CopyIconComponent,
|
|
5675
|
+
DeleteIconComponent,
|
|
5676
|
+
RefreshIconComponent,
|
|
5677
|
+
ShareIconComponent,
|
|
5678
|
+
LikeIconComponent,
|
|
5679
|
+
DislikeIconComponent,
|
|
5170
5680
|
],
|
|
5171
5681
|
exports: [
|
|
5172
|
-
|
|
5173
|
-
|
|
5174
|
-
|
|
5175
|
-
|
|
5176
|
-
|
|
5177
|
-
|
|
5178
|
-
|
|
5179
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: LayoutSenderComponent, isStandalone: true, selector: "mc-layout-sender", ngImport: i0, template: "<div class=\"mc-layout-sender\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n", styles: [""] }); }
|
|
5180
|
-
}
|
|
5181
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutSenderComponent, decorators: [{
|
|
5182
|
-
type: Component,
|
|
5183
|
-
args: [{ selector: 'mc-layout-sender', standalone: true, template: "<div class=\"mc-layout-sender\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n" }]
|
|
5184
|
-
}] });
|
|
5185
|
-
|
|
5186
|
-
class LayoutSenderModule {
|
|
5187
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutSenderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
5188
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.10", ngImport: i0, type: LayoutSenderModule, imports: [CommonModule,
|
|
5189
|
-
LayoutSenderComponent], exports: [LayoutSenderComponent] }); }
|
|
5190
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutSenderModule, imports: [CommonModule] }); }
|
|
5191
|
-
}
|
|
5192
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: LayoutSenderModule, decorators: [{
|
|
5193
|
-
type: NgModule,
|
|
5194
|
-
args: [{
|
|
5195
|
-
declarations: [],
|
|
5196
|
-
imports: [
|
|
5197
|
-
CommonModule,
|
|
5198
|
-
LayoutSenderComponent,
|
|
5682
|
+
ToolbarComponent,
|
|
5683
|
+
CopyIconComponent,
|
|
5684
|
+
DeleteIconComponent,
|
|
5685
|
+
RefreshIconComponent,
|
|
5686
|
+
ShareIconComponent,
|
|
5687
|
+
LikeIconComponent,
|
|
5688
|
+
DislikeIconComponent,
|
|
5199
5689
|
],
|
|
5200
|
-
exports: [
|
|
5201
|
-
LayoutSenderComponent,
|
|
5202
|
-
]
|
|
5203
5690
|
}]
|
|
5204
5691
|
}] });
|
|
5205
5692
|
|
|
@@ -5211,5 +5698,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImpo
|
|
|
5211
5698
|
* Generated bundle index. Do not edit.
|
|
5212
5699
|
*/
|
|
5213
5700
|
|
|
5214
|
-
export { AttachmentComponent, AttachmentModule, AvatarBodyIconComponent, AvatarComponent, AvatarNoBodyIconComponent, BubbleComponent, BubbleLoadingComponent, BubbleModule, CodeBlockComponent, CopyIconComponent, DeleteIconComponent, DislikeIconComponent, HeaderComponent, HeaderModule, InputComponent, InputModule, IntroductionComponent, IntroductionModule, LayoutAsideComponent, LayoutAsideModule, LayoutComponent, LayoutContentComponent, LayoutContentModule, LayoutHeaderComponent, LayoutHeaderModule, LayoutModule, LayoutSenderComponent, LayoutSenderModule, LikeIconComponent, ListComponent, ListDirection, ListModule, ListVariant, LocaleModule, LocaleService, MarkdownCardComponent, MarkdownCardModule, MentionComponent, MentionModule, PromptComponent, PromptModule, RefreshIconComponent, ShareIconComponent, ToolbarAction, ToolbarComponent, ToolbarModule, TranslatePipe, inputContextToken };
|
|
5701
|
+
export { AttachmentComponent, AttachmentModule, AvatarBodyIconComponent, AvatarComponent, AvatarNoBodyIconComponent, BubbleComponent, BubbleLoadingComponent, BubbleModule, CodeBlockComponent, CopyIconComponent, DeleteIconComponent, DislikeIconComponent, HeaderComponent, HeaderModule, InputComponent, InputModule, IntroductionComponent, IntroductionModule, LayoutAsideComponent, LayoutAsideModule, LayoutComponent, LayoutContentComponent, LayoutContentModule, LayoutHeaderComponent, LayoutHeaderModule, LayoutModule, LayoutSenderComponent, LayoutSenderModule, LikeIconComponent, ListComponent, ListDirection, ListModule, ListVariant, LocaleModule, LocaleService, MarkdownCardComponent, MarkdownCardModule, McFileListComponent, McFileListModule, MentionComponent, MentionModule, PromptComponent, PromptModule, RefreshIconComponent, ShareIconComponent, ToolbarAction, ToolbarComponent, ToolbarModule, TranslatePipe, inputContextToken };
|
|
5215
5702
|
//# sourceMappingURL=matechat-ng.mjs.map
|