@qn-pandora/pandora-component 5.1.1 → 5.1.2
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/README.md +36 -36
- package/es/components/AutoComplete/style.css +17 -17
- package/es/components/AutoComplete/style.less +8 -8
- package/es/components/Breadcrumb/style.less +9 -9
- package/es/components/Button/style.css +69 -69
- package/es/components/Button/style.less +51 -51
- package/es/components/Card/RowExtra/style.less +8 -8
- package/es/components/Card/SearchInput/style.less +8 -8
- package/es/components/Card/style.css +11 -11
- package/es/components/Card/style.less +11 -11
- package/es/components/CheckTransformList/style.css +19 -19
- package/es/components/CheckTransformList/style.less +35 -35
- package/es/components/Checkbox/index.js +9 -1
- package/es/components/Checkbox/style.less +5 -5
- package/es/components/CheckboxList/style.css +5 -5
- package/es/components/CheckboxList/style.less +11 -11
- package/es/components/Collapse/style.css +1 -1
- package/es/components/Collapse/style.less +58 -58
- package/es/components/CollapsiblePanel/style.less +63 -63
- package/es/components/DateTimePicker/Base/index.d.ts +3 -0
- package/es/components/DateTimePicker/Base/index.js +51 -6
- package/es/components/DateTimePicker/Base/style.css +67 -61
- package/es/components/DateTimePicker/Base/style.less +167 -160
- package/es/components/DateTimePicker/BaseMobile/Absolute/style.less +35 -35
- package/es/components/DateTimePicker/BaseMobile/style.less +32 -32
- package/es/components/DateTimePicker/Collapse/Panel/style.less +26 -26
- package/es/components/DateTimePicker/DisplayInput/index.js +3 -1
- package/es/components/DateTimePicker/DisplayInput/style.css +14 -14
- package/es/components/DateTimePicker/DisplayInput/style.less +9 -9
- package/es/components/DateTimePicker/constants.d.ts +9 -3
- package/es/components/DateTimePicker/constants.js +1 -0
- package/es/components/DateTimePicker/style.less +19 -19
- package/es/components/DateTimePicker/time.d.ts +1 -0
- package/es/components/DateTimePicker/time.js +1 -0
- package/es/components/DateTimePicker/transform.js +4 -2
- package/es/components/Descriptions/style.less +16 -16
- package/es/components/Drawer/CloseIcon/style.less +8 -8
- package/es/components/Drawer/index.d.ts +1 -1
- package/es/components/Drawer/style.less +69 -69
- package/es/components/FileResumable/index.js +2 -3
- package/es/components/FileResumable/style.css +8 -8
- package/es/components/FileResumable/style.less +94 -94
- package/es/components/FlameGraph/customTooltip.d.ts +22 -0
- package/es/components/FlameGraph/customTooltip.js +91 -0
- package/es/components/FlameGraph/index.d.ts +16 -0
- package/es/components/FlameGraph/index.js +96 -0
- package/es/components/FlameGraph/style.css +8 -0
- package/es/components/FlameGraph/style.less +14 -0
- package/es/components/Input/style.css +14 -14
- package/es/components/Input/style.less +12 -12
- package/es/components/KeyValuePair/style.less +25 -25
- package/es/components/Menu/Option.d.ts +1 -1
- package/es/components/Menu/Option.js +12 -4
- package/es/components/Menu/style.css +23 -23
- package/es/components/Menu/style.less +18 -18
- package/es/components/Modal/style.css +1 -1
- package/es/components/Modal/style.less +30 -30
- package/es/components/NameExplainTooltip/style.css +1 -1
- package/es/components/NameExplainTooltip/style.less +10 -10
- package/es/components/NameLimiter/style.less +19 -19
- package/es/components/OptionList/InlineOptionList/style.css +1 -1
- package/es/components/OptionList/InlineOptionList/style.less +16 -16
- package/es/components/OptionList/OptionItem/style.css +2 -2
- package/es/components/OptionList/OptionItem/style.less +25 -25
- package/es/components/OptionList/PopoverOptionList/style.css +3 -3
- package/es/components/OptionList/PopoverOptionList/style.less +30 -30
- package/es/components/OptionList/style.css +6 -6
- package/es/components/OptionList/style.less +3 -3
- package/es/components/RadioGroup/style.css +32 -32
- package/es/components/RadioGroup/style.less +41 -41
- package/es/components/RangeInput/style.css +29 -29
- package/es/components/RangeInput/style.less +37 -37
- package/es/components/RemarkName/style.less +2 -2
- package/es/components/Selector/style.css +17 -17
- package/es/components/Selector/style.less +99 -99
- package/es/components/Spin/style.css +2 -2
- package/es/components/Spin/style.less +26 -26
- package/es/components/Steps/ControlButton/style.less +5 -5
- package/es/components/Steps/style.css +16 -16
- package/es/components/Steps/style.less +48 -48
- package/es/components/Table/ColumnSetting/index.d.ts +1 -0
- package/es/components/Table/ColumnSetting/index.js +19 -14
- package/es/components/Table/ColumnSetting/style.less +50 -50
- package/es/components/Table/ColumnTag/style.css +4 -4
- package/es/components/Table/ColumnTag/style.less +40 -40
- package/es/components/Table/EmptyText.d.ts +7 -0
- package/es/components/Table/EmptyText.js +22 -0
- package/es/components/Table/ResizableTitle/style.less +25 -25
- package/es/components/Table/index.d.ts +11 -83
- package/es/components/Table/index.js +113 -286
- package/es/components/Table/style.css +54 -44
- package/es/components/Table/style.less +364 -345
- package/es/components/Table/type.d.ts +63 -0
- package/es/components/Table/type.js +5 -0
- package/es/components/Table/util.d.ts +58 -0
- package/es/components/Table/util.js +218 -0
- package/es/components/Tabs/style.css +10 -10
- package/es/components/Tabs/style.less +33 -33
- package/es/components/TagList/Tag/style.css +5 -5
- package/es/components/TagList/Tag/style.less +72 -72
- package/es/components/TagList/TagSwitch/style.css +1 -1
- package/es/components/TagList/TagSwitch/style.less +28 -28
- package/es/components/TagList/style.css +6 -6
- package/es/components/TagList/style.less +28 -28
- package/es/components/Timeline/TimelineItem/style.css +1 -1
- package/es/components/Timeline/TimelineItem/style.less +49 -49
- package/es/components/Timeline/style.less +23 -23
- package/es/components/TopologyChart/style.less +14 -14
- package/es/components/Transfer/List/style.less +19 -19
- package/es/components/Transfer/ListBody/style.less +18 -18
- package/es/components/Transfer/style.less +14 -14
- package/es/components/TreeSelector/style.css +21 -21
- package/es/components/TreeSelector/style.less +56 -56
- package/es/constants/language/datetime/en.js +4 -2
- package/es/constants/language/datetime/type.d.ts +4 -2
- package/es/constants/language/datetime/zh.js +4 -2
- package/es/index.css +6268 -6244
- package/es/index.d.ts +1 -0
- package/es/index.js +1 -0
- package/es/index.less +56 -55
- package/es/style/mixin.less +45 -45
- package/es/style/theme.less +416 -416
- package/lib/components/AutoComplete/style.css +17 -17
- package/lib/components/AutoComplete/style.less +8 -8
- package/lib/components/Breadcrumb/style.less +9 -9
- package/lib/components/Button/style.css +69 -69
- package/lib/components/Button/style.less +51 -51
- package/lib/components/Card/RowExtra/style.less +8 -8
- package/lib/components/Card/SearchInput/style.less +8 -8
- package/lib/components/Card/style.css +11 -11
- package/lib/components/Card/style.less +11 -11
- package/lib/components/CheckTransformList/style.css +19 -19
- package/lib/components/CheckTransformList/style.less +35 -35
- package/lib/components/Checkbox/index.js +9 -1
- package/lib/components/Checkbox/style.less +5 -5
- package/lib/components/CheckboxList/style.css +5 -5
- package/lib/components/CheckboxList/style.less +11 -11
- package/lib/components/Collapse/style.css +1 -1
- package/lib/components/Collapse/style.less +58 -58
- package/lib/components/CollapsiblePanel/style.less +63 -63
- package/lib/components/DateTimePicker/Base/index.d.ts +3 -0
- package/lib/components/DateTimePicker/Base/index.js +51 -6
- package/lib/components/DateTimePicker/Base/style.css +67 -61
- package/lib/components/DateTimePicker/Base/style.less +167 -160
- package/lib/components/DateTimePicker/BaseMobile/Absolute/style.less +35 -35
- package/lib/components/DateTimePicker/BaseMobile/style.less +32 -32
- package/lib/components/DateTimePicker/Collapse/Panel/style.less +26 -26
- package/lib/components/DateTimePicker/DisplayInput/index.js +3 -1
- package/lib/components/DateTimePicker/DisplayInput/style.css +14 -14
- package/lib/components/DateTimePicker/DisplayInput/style.less +9 -9
- package/lib/components/DateTimePicker/constants.d.ts +9 -3
- package/lib/components/DateTimePicker/constants.js +1 -0
- package/lib/components/DateTimePicker/style.less +19 -19
- package/lib/components/DateTimePicker/time.d.ts +1 -0
- package/lib/components/DateTimePicker/time.js +1 -0
- package/lib/components/DateTimePicker/transform.js +4 -2
- package/lib/components/Descriptions/style.less +16 -16
- package/lib/components/Drawer/CloseIcon/style.less +8 -8
- package/lib/components/Drawer/index.d.ts +1 -1
- package/lib/components/Drawer/style.less +69 -69
- package/lib/components/FileResumable/index.js +2 -3
- package/lib/components/FileResumable/style.css +8 -8
- package/lib/components/FileResumable/style.less +94 -94
- package/lib/components/FlameGraph/customTooltip.d.ts +22 -0
- package/lib/components/FlameGraph/customTooltip.js +114 -0
- package/lib/components/FlameGraph/index.d.ts +16 -0
- package/lib/components/FlameGraph/index.js +117 -0
- package/lib/components/FlameGraph/style.css +8 -0
- package/lib/components/FlameGraph/style.less +14 -0
- package/lib/components/Input/style.css +14 -14
- package/lib/components/Input/style.less +12 -12
- package/lib/components/KeyValuePair/style.less +25 -25
- package/lib/components/Menu/Option.d.ts +1 -1
- package/lib/components/Menu/Option.js +17 -25
- package/lib/components/Menu/style.css +23 -23
- package/lib/components/Menu/style.less +18 -18
- package/lib/components/Modal/style.css +1 -1
- package/lib/components/Modal/style.less +30 -30
- package/lib/components/NameExplainTooltip/style.css +1 -1
- package/lib/components/NameExplainTooltip/style.less +10 -10
- package/lib/components/NameLimiter/style.less +19 -19
- package/lib/components/OptionList/InlineOptionList/style.css +1 -1
- package/lib/components/OptionList/InlineOptionList/style.less +16 -16
- package/lib/components/OptionList/OptionItem/style.css +2 -2
- package/lib/components/OptionList/OptionItem/style.less +25 -25
- package/lib/components/OptionList/PopoverOptionList/style.css +3 -3
- package/lib/components/OptionList/PopoverOptionList/style.less +30 -30
- package/lib/components/OptionList/style.css +6 -6
- package/lib/components/OptionList/style.less +3 -3
- package/lib/components/RadioGroup/style.css +32 -32
- package/lib/components/RadioGroup/style.less +41 -41
- package/lib/components/RangeInput/style.css +29 -29
- package/lib/components/RangeInput/style.less +37 -37
- package/lib/components/RemarkName/style.less +2 -2
- package/lib/components/Selector/style.css +17 -17
- package/lib/components/Selector/style.less +99 -99
- package/lib/components/Spin/style.css +2 -2
- package/lib/components/Spin/style.less +26 -26
- package/lib/components/Steps/ControlButton/style.less +5 -5
- package/lib/components/Steps/style.css +16 -16
- package/lib/components/Steps/style.less +48 -48
- package/lib/components/Table/ColumnSetting/index.d.ts +1 -0
- package/lib/components/Table/ColumnSetting/index.js +19 -14
- package/lib/components/Table/ColumnSetting/style.less +50 -50
- package/lib/components/Table/ColumnTag/style.css +4 -4
- package/lib/components/Table/ColumnTag/style.less +40 -40
- package/lib/components/Table/EmptyText.d.ts +7 -0
- package/lib/components/Table/EmptyText.js +27 -0
- package/lib/components/Table/ResizableTitle/style.less +25 -25
- package/lib/components/Table/index.d.ts +11 -83
- package/lib/components/Table/index.js +117 -288
- package/lib/components/Table/style.css +54 -44
- package/lib/components/Table/style.less +364 -345
- package/lib/components/Table/type.d.ts +63 -0
- package/lib/components/Table/type.js +8 -0
- package/lib/components/Table/util.d.ts +58 -0
- package/lib/components/Table/util.js +227 -0
- package/lib/components/Tabs/style.css +10 -10
- package/lib/components/Tabs/style.less +33 -33
- package/lib/components/TagList/Tag/style.css +5 -5
- package/lib/components/TagList/Tag/style.less +72 -72
- package/lib/components/TagList/TagSwitch/style.css +1 -1
- package/lib/components/TagList/TagSwitch/style.less +28 -28
- package/lib/components/TagList/style.css +6 -6
- package/lib/components/TagList/style.less +28 -28
- package/lib/components/Timeline/TimelineItem/style.css +1 -1
- package/lib/components/Timeline/TimelineItem/style.less +49 -49
- package/lib/components/Timeline/style.less +23 -23
- package/lib/components/TopologyChart/style.less +14 -14
- package/lib/components/Transfer/List/style.less +19 -19
- package/lib/components/Transfer/ListBody/style.less +18 -18
- package/lib/components/Transfer/style.less +14 -14
- package/lib/components/TreeSelector/style.css +21 -21
- package/lib/components/TreeSelector/style.less +56 -56
- package/lib/constants/language/datetime/en.js +4 -2
- package/lib/constants/language/datetime/type.d.ts +4 -2
- package/lib/constants/language/datetime/zh.js +4 -2
- package/lib/index.css +4726 -4702
- package/lib/index.d.ts +1 -0
- package/lib/index.js +3 -1
- package/lib/index.less +56 -55
- package/lib/style/mixin.less +45 -45
- package/lib/style/theme.less +416 -416
- package/package.json +7 -4
@@ -0,0 +1,91 @@
|
|
1
|
+
/**
|
2
|
+
* 库里面copy 出来,修改了 tooltip 的展示内容
|
3
|
+
* https://github.com/spiermar/d3-flame-graph/blob/master/src/tooltip.js
|
4
|
+
*/
|
5
|
+
import * as d3 from 'd3';
|
6
|
+
function defaultLabel(d) {
|
7
|
+
if (d.data.name === 'root') {
|
8
|
+
return "\n <div>\n <span>Name:" + d.data.name + "</span>\n </div>";
|
9
|
+
}
|
10
|
+
var percentofParent = d.parent
|
11
|
+
? ((d.value / d.parent.value) * 100).toFixed(2)
|
12
|
+
: 100;
|
13
|
+
var siblingPercentage = d.data.depthPercentage.toFixed(2);
|
14
|
+
return "\n <div>\n <span>Name:" + d.data.name + "</span><br/>\n <span>File:" + d.data.source.file + "</span><br/>\n <span>Line:" + d.data.source.line + "</span><br/>\n <span>" + siblingPercentage + "% of all " + percentofParent + "% of parent</span>\n </div>";
|
15
|
+
}
|
16
|
+
export function defaultFlamegraphTooltip() {
|
17
|
+
var rootElement = d3.select('body');
|
18
|
+
var tooltip = null;
|
19
|
+
// Function to get HTML content from data.
|
20
|
+
var html = defaultLabel;
|
21
|
+
// Function to get text content from data.
|
22
|
+
var text = defaultLabel;
|
23
|
+
// Whether to use d3's .html() to set content, otherwise use .text().
|
24
|
+
var contentIsHTML = true;
|
25
|
+
function tip() {
|
26
|
+
tooltip = rootElement
|
27
|
+
.append('div')
|
28
|
+
.style('display', 'none')
|
29
|
+
.style('position', 'absolute')
|
30
|
+
.style('opacity', 0)
|
31
|
+
.style('pointer-events', 'none')
|
32
|
+
.style('z-index', 2000)
|
33
|
+
.attr('class', 'd3-flame-graph-tip');
|
34
|
+
}
|
35
|
+
tip.show = function (d) {
|
36
|
+
tooltip
|
37
|
+
.style('display', 'block')
|
38
|
+
.style('left', event.pageX + 5 + 'px')
|
39
|
+
.style('top', event.pageY + 5 + 'px')
|
40
|
+
.transition()
|
41
|
+
.duration(200)
|
42
|
+
.style('opacity', 1)
|
43
|
+
.style('pointer-events', 'all');
|
44
|
+
if (contentIsHTML) {
|
45
|
+
tooltip.html(html(d));
|
46
|
+
}
|
47
|
+
else {
|
48
|
+
tooltip.text(text(d));
|
49
|
+
}
|
50
|
+
return tip;
|
51
|
+
};
|
52
|
+
tip.hide = function () {
|
53
|
+
tooltip
|
54
|
+
.style('display', 'none')
|
55
|
+
.transition()
|
56
|
+
.duration(200)
|
57
|
+
.style('opacity', 0)
|
58
|
+
.style('pointer-events', 'none');
|
59
|
+
return tip;
|
60
|
+
};
|
61
|
+
/**
|
62
|
+
* Gets/sets a function converting the d3 data into the tooltip's textContent.
|
63
|
+
*
|
64
|
+
* Cannot be combined with tip.html().
|
65
|
+
*/
|
66
|
+
tip.text = function (_) {
|
67
|
+
if (!arguments.length)
|
68
|
+
return text;
|
69
|
+
text = _;
|
70
|
+
contentIsHTML = false;
|
71
|
+
return tip;
|
72
|
+
};
|
73
|
+
/**
|
74
|
+
* Gets/sets a function converting the d3 data into the tooltip's innerHTML.
|
75
|
+
*
|
76
|
+
* Cannot be combined with tip.text().
|
77
|
+
*
|
78
|
+
* @deprecated prefer tip.text().
|
79
|
+
*/
|
80
|
+
tip.html = function (_) {
|
81
|
+
if (!arguments.length)
|
82
|
+
return html;
|
83
|
+
html = _;
|
84
|
+
contentIsHTML = true;
|
85
|
+
return tip;
|
86
|
+
};
|
87
|
+
tip.destroy = function () {
|
88
|
+
tooltip.remove();
|
89
|
+
};
|
90
|
+
return tip;
|
91
|
+
}
|
@@ -0,0 +1,16 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import 'd3-flame-graph/dist/d3-flamegraph.css';
|
3
|
+
export interface IFlameGraphData {
|
4
|
+
name: string;
|
5
|
+
count: number;
|
6
|
+
source?: IKeyValues;
|
7
|
+
children?: IFlameGraphData[];
|
8
|
+
}
|
9
|
+
declare const FlameGraph: ({ data, width, height, depth, searchFilters }: {
|
10
|
+
data: IFlameGraphData;
|
11
|
+
width: number;
|
12
|
+
height?: number | undefined;
|
13
|
+
depth?: number | undefined;
|
14
|
+
searchFilters?: IKeyValues<any>[] | undefined;
|
15
|
+
}) => React.JSX.Element;
|
16
|
+
export default FlameGraph;
|
@@ -0,0 +1,96 @@
|
|
1
|
+
import React, { useEffect, useRef, useMemo } from 'react';
|
2
|
+
import { flamegraph } from 'd3-flame-graph';
|
3
|
+
import * as d3 from 'd3';
|
4
|
+
import 'd3-flame-graph/dist/d3-flamegraph.css';
|
5
|
+
import { defaultFlamegraphTooltip } from './customTooltip';
|
6
|
+
import { SDK_PREFIX } from '../../constants/style';
|
7
|
+
var CELL_HEIGHT = 24;
|
8
|
+
var MIN_HEIGHT = 300;
|
9
|
+
var DEFAULT_OPACITY = 0.8;
|
10
|
+
var FlameGraph = function (_a) {
|
11
|
+
var data = _a.data, width = _a.width, height = _a.height, depth = _a.depth, searchFilters = _a.searchFilters;
|
12
|
+
var flameGraphRef = useRef(null);
|
13
|
+
var flameGraphInstance = useRef(null); // 存储 flamegraph 实例
|
14
|
+
var svgRef = useRef(null); // 存储 flamegraph 实例
|
15
|
+
var currentNodeRef = useRef(null);
|
16
|
+
var colorFunction = function (d) {
|
17
|
+
return d.data.color;
|
18
|
+
};
|
19
|
+
var flameHeight = useMemo(function () {
|
20
|
+
if (height)
|
21
|
+
return height;
|
22
|
+
if (depth) {
|
23
|
+
return depth * CELL_HEIGHT;
|
24
|
+
}
|
25
|
+
return MIN_HEIGHT;
|
26
|
+
}, [height, depth]);
|
27
|
+
useEffect(function () {
|
28
|
+
if (flameGraphInstance.current && svgRef.current) {
|
29
|
+
flameGraphInstance.current.width(width).height(flameHeight);
|
30
|
+
svgRef.current
|
31
|
+
.select('svg')
|
32
|
+
.attr('width', width)
|
33
|
+
.attr('height', flameHeight);
|
34
|
+
}
|
35
|
+
}, [width, flameHeight]);
|
36
|
+
useEffect(function () {
|
37
|
+
if (!data || !flameGraphRef.current)
|
38
|
+
return;
|
39
|
+
if (!flameGraphInstance.current) {
|
40
|
+
var flame = flamegraph()
|
41
|
+
.width(width)
|
42
|
+
.height(flameHeight)
|
43
|
+
.cellHeight(CELL_HEIGHT)
|
44
|
+
.transitionDuration(750)
|
45
|
+
.inverted(true);
|
46
|
+
var tip = defaultFlamegraphTooltip();
|
47
|
+
flame.tooltip(tip);
|
48
|
+
flame.setColorMapper(colorFunction);
|
49
|
+
flame.onClick(function (d) {
|
50
|
+
var preCurrentNode = currentNodeRef.current;
|
51
|
+
if (preCurrentNode && d === preCurrentNode) {
|
52
|
+
// 如果点击的是当前节点,回调到root)
|
53
|
+
if (preCurrentNode.parent) {
|
54
|
+
flameGraphInstance.current.resetZoom();
|
55
|
+
}
|
56
|
+
}
|
57
|
+
else {
|
58
|
+
// 否则,进入子节点
|
59
|
+
currentNodeRef.current = d;
|
60
|
+
}
|
61
|
+
});
|
62
|
+
flameGraphInstance.current = flame;
|
63
|
+
}
|
64
|
+
// 渲染火焰图到指定的 DOM 元素
|
65
|
+
svgRef.current = d3
|
66
|
+
.select(flameGraphRef.current)
|
67
|
+
.datum(data)
|
68
|
+
.call(flameGraphInstance.current);
|
69
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
70
|
+
}, [data]);
|
71
|
+
useEffect(function () {
|
72
|
+
if (svgRef.current && searchFilters) {
|
73
|
+
svgRef.current.selectAll('rect').style('opacity', function (d) {
|
74
|
+
// 清空选中的值后,图名都需要恢复
|
75
|
+
if (searchFilters.length === 0)
|
76
|
+
return DEFAULT_OPACITY;
|
77
|
+
var matchCount = 0;
|
78
|
+
searchFilters.forEach(function (item) {
|
79
|
+
if (item.field === 'method' && d.data.name === item.value[0]) {
|
80
|
+
matchCount += 1;
|
81
|
+
}
|
82
|
+
else if (item.field === 'file' &&
|
83
|
+
d.data.source.file === item.value[0]) {
|
84
|
+
matchCount += 1;
|
85
|
+
}
|
86
|
+
});
|
87
|
+
if (matchCount === searchFilters.length) {
|
88
|
+
return DEFAULT_OPACITY;
|
89
|
+
}
|
90
|
+
return 0.2;
|
91
|
+
});
|
92
|
+
}
|
93
|
+
}, [searchFilters]);
|
94
|
+
return (React.createElement("div", { ref: flameGraphRef, className: SDK_PREFIX + "-flame-graph-wrapper" }));
|
95
|
+
};
|
96
|
+
export default FlameGraph;
|
@@ -0,0 +1,14 @@
|
|
1
|
+
@import '../../style/theme.less';
|
2
|
+
|
3
|
+
.@{sdk-prefix}-flame-graph-wrapper {
|
4
|
+
:global {
|
5
|
+
.d3-flame-graph-label {
|
6
|
+
padding: 4px 8px;
|
7
|
+
text-overflow: ellipsis;
|
8
|
+
white-space: nowrap;
|
9
|
+
font-size: 11px;
|
10
|
+
cursor: pointer;
|
11
|
+
overflow: hidden;
|
12
|
+
}
|
13
|
+
}
|
14
|
+
}
|
@@ -47,7 +47,7 @@
|
|
47
47
|
text-overflow: ellipsis;
|
48
48
|
}
|
49
49
|
.ant-input-affix-wrapper:hover {
|
50
|
-
border-color: #
|
50
|
+
border-color: #436bff;
|
51
51
|
border-right-width: 1px;
|
52
52
|
}
|
53
53
|
.ant-input-rtl .ant-input-affix-wrapper:hover {
|
@@ -56,9 +56,9 @@
|
|
56
56
|
}
|
57
57
|
.ant-input-affix-wrapper:focus,
|
58
58
|
.ant-input-affix-wrapper-focused {
|
59
|
-
border-color: #
|
60
|
-
-webkit-box-shadow: 0 0 0 2px rgba(
|
61
|
-
box-shadow: 0 0 0 2px rgba(
|
59
|
+
border-color: #6b90ff;
|
60
|
+
-webkit-box-shadow: 0 0 0 2px rgba(67, 107, 255, 0.2);
|
61
|
+
box-shadow: 0 0 0 2px rgba(67, 107, 255, 0.2);
|
62
62
|
border-right-width: 1px;
|
63
63
|
outline: 0;
|
64
64
|
}
|
@@ -124,7 +124,7 @@ textarea.ant-input-affix-wrapper {
|
|
124
124
|
direction: rtl;
|
125
125
|
}
|
126
126
|
.ant-input-affix-wrapper:not(.ant-input-affix-wrapper-disabled):hover {
|
127
|
-
border-color: #
|
127
|
+
border-color: #436bff;
|
128
128
|
border-right-width: 1px;
|
129
129
|
z-index: 1;
|
130
130
|
}
|
@@ -352,7 +352,7 @@ textarea.ant-input-affix-wrapper {
|
|
352
352
|
text-overflow: ellipsis;
|
353
353
|
}
|
354
354
|
.ant-input:hover {
|
355
|
-
border-color: #
|
355
|
+
border-color: #436bff;
|
356
356
|
border-right-width: 1px;
|
357
357
|
}
|
358
358
|
.ant-input-rtl .ant-input:hover {
|
@@ -361,9 +361,9 @@ textarea.ant-input-affix-wrapper {
|
|
361
361
|
}
|
362
362
|
.ant-input:focus,
|
363
363
|
.ant-input-focused {
|
364
|
-
border-color: #
|
365
|
-
-webkit-box-shadow: 0 0 0 2px rgba(
|
366
|
-
box-shadow: 0 0 0 2px rgba(
|
364
|
+
border-color: #6b90ff;
|
365
|
+
-webkit-box-shadow: 0 0 0 2px rgba(67, 107, 255, 0.2);
|
366
|
+
box-shadow: 0 0 0 2px rgba(67, 107, 255, 0.2);
|
367
367
|
border-right-width: 1px;
|
368
368
|
outline: 0;
|
369
369
|
}
|
@@ -517,7 +517,7 @@ textarea.ant-input {
|
|
517
517
|
}
|
518
518
|
.ant-input-group-addon .ant-select-open .ant-select-selector,
|
519
519
|
.ant-input-group-addon .ant-select-focused .ant-select-selector {
|
520
|
-
color: #
|
520
|
+
color: #436bff;
|
521
521
|
}
|
522
522
|
.ant-input-group-addon .ant-cascader-picker {
|
523
523
|
margin: -9px -12px;
|
@@ -830,11 +830,11 @@ textarea.ant-input {
|
|
830
830
|
}
|
831
831
|
.ant-input-search .ant-input:hover,
|
832
832
|
.ant-input-search .ant-input:focus {
|
833
|
-
border-color: #
|
833
|
+
border-color: #436bff;
|
834
834
|
}
|
835
835
|
.ant-input-search .ant-input:hover + .ant-input-group-addon .ant-input-search-button:not(.ant-btn-primary),
|
836
836
|
.ant-input-search .ant-input:focus + .ant-input-group-addon .ant-input-search-button:not(.ant-btn-primary) {
|
837
|
-
border-left-color: #
|
837
|
+
border-left-color: #436bff;
|
838
838
|
}
|
839
839
|
.ant-input-search .ant-input-affix-wrapper {
|
840
840
|
border-radius: 0;
|
@@ -939,11 +939,11 @@ textarea.ant-input {
|
|
939
939
|
}
|
940
940
|
.ant-input-search-rtl .ant-input:hover + .ant-input-group-addon .ant-input-search-button:not(.ant-btn-primary):hover,
|
941
941
|
.ant-input-search-rtl .ant-input:focus + .ant-input-group-addon .ant-input-search-button:not(.ant-btn-primary):hover {
|
942
|
-
border-left-color: #
|
942
|
+
border-left-color: #436bff;
|
943
943
|
}
|
944
944
|
.ant-input-search-rtl > .ant-input-group > .ant-input-affix-wrapper:hover,
|
945
945
|
.ant-input-search-rtl > .ant-input-group > .ant-input-affix-wrapper-focused {
|
946
|
-
border-right-color: #
|
946
|
+
border-right-color: #436bff;
|
947
947
|
}
|
948
948
|
.ant-input-search-rtl > .ant-input-group > .ant-input-group-addon:last-child {
|
949
949
|
right: -1px;
|
@@ -1,12 +1,12 @@
|
|
1
|
-
@import 'antd/lib/input/style/index.less';
|
2
|
-
@import '../../style/theme.less';
|
3
|
-
|
4
|
-
.@{ant-prefix}-input {
|
5
|
-
&[disabled] {
|
6
|
-
border-color: @input-disabled-border-color;
|
7
|
-
}
|
8
|
-
}
|
9
|
-
|
10
|
-
.@{ant-prefix}-input-group-addon {
|
11
|
-
color: @font-color-6;
|
12
|
-
}
|
1
|
+
@import 'antd/lib/input/style/index.less';
|
2
|
+
@import '../../style/theme.less';
|
3
|
+
|
4
|
+
.@{ant-prefix}-input {
|
5
|
+
&[disabled] {
|
6
|
+
border-color: @input-disabled-border-color;
|
7
|
+
}
|
8
|
+
}
|
9
|
+
|
10
|
+
.@{ant-prefix}-input-group-addon {
|
11
|
+
color: @font-color-6;
|
12
|
+
}
|
@@ -1,25 +1,25 @@
|
|
1
|
-
@import '../../style/theme.less';
|
2
|
-
|
3
|
-
.@{sdk-prefix}-key-value-label,
|
4
|
-
.@{sdk-prefix}-key-value-value {
|
5
|
-
display: inline-block;
|
6
|
-
overflow: hidden;
|
7
|
-
text-overflow: ellipsis;
|
8
|
-
white-space: nowrap;
|
9
|
-
line-height: 1.8;
|
10
|
-
vertical-align: middle; // overflow:hidden和display: inline-block一起使用时会造成baseline的移动,进而增大高度
|
11
|
-
}
|
12
|
-
|
13
|
-
.@{sdk-prefix}-key-value-label {
|
14
|
-
color: @font-color-6;
|
15
|
-
width: 30%;
|
16
|
-
}
|
17
|
-
.@{sdk-prefix}-key-value-label-top {
|
18
|
-
padding-top: 10px;
|
19
|
-
vertical-align: top;
|
20
|
-
}
|
21
|
-
|
22
|
-
.@{sdk-prefix}-key-value-value {
|
23
|
-
color: @font-color-7;
|
24
|
-
width: 70%;
|
25
|
-
}
|
1
|
+
@import '../../style/theme.less';
|
2
|
+
|
3
|
+
.@{sdk-prefix}-key-value-label,
|
4
|
+
.@{sdk-prefix}-key-value-value {
|
5
|
+
display: inline-block;
|
6
|
+
overflow: hidden;
|
7
|
+
text-overflow: ellipsis;
|
8
|
+
white-space: nowrap;
|
9
|
+
line-height: 1.8;
|
10
|
+
vertical-align: middle; // overflow:hidden和display: inline-block一起使用时会造成baseline的移动,进而增大高度
|
11
|
+
}
|
12
|
+
|
13
|
+
.@{sdk-prefix}-key-value-label {
|
14
|
+
color: @font-color-6;
|
15
|
+
width: 30%;
|
16
|
+
}
|
17
|
+
.@{sdk-prefix}-key-value-label-top {
|
18
|
+
padding-top: 10px;
|
19
|
+
vertical-align: top;
|
20
|
+
}
|
21
|
+
|
22
|
+
.@{sdk-prefix}-key-value-value {
|
23
|
+
color: @font-color-7;
|
24
|
+
width: 70%;
|
25
|
+
}
|
@@ -9,11 +9,21 @@ var __assign = (this && this.__assign) || function () {
|
|
9
9
|
};
|
10
10
|
return __assign.apply(this, arguments);
|
11
11
|
};
|
12
|
-
import
|
12
|
+
import React from 'react';
|
13
13
|
import { Menu as BaseMenu } from 'antd';
|
14
14
|
import { SDK_PREFIX } from '../../constants/style';
|
15
15
|
var Item = BaseMenu.Item, SubMenu = BaseMenu.SubMenu;
|
16
16
|
export default function Option(option) {
|
17
|
+
var handleTitleClick = function (e, option) {
|
18
|
+
var _a;
|
19
|
+
if (option.url || option.internalUrl) {
|
20
|
+
(_a = option.onMenuClick) === null || _a === void 0 ? void 0 : _a.call(option, e);
|
21
|
+
return;
|
22
|
+
}
|
23
|
+
if (option.weburl) {
|
24
|
+
window.open(option.weburl, option.target || '_blank');
|
25
|
+
}
|
26
|
+
};
|
17
27
|
if (!option.children) {
|
18
28
|
if (option.weburl) {
|
19
29
|
return (React.createElement(Item, { key: option.key },
|
@@ -21,9 +31,7 @@ export default function Option(option) {
|
|
21
31
|
}
|
22
32
|
return React.createElement(Item, { key: option.key }, option.text);
|
23
33
|
}
|
24
|
-
return (React.createElement(SubMenu, { key: option.key, title: option.text, popupClassName: option.popupClassName,
|
25
|
-
// 如果子菜单也有url时,点击触发menu的点击回调函数
|
26
|
-
onTitleClick: function (e) { var _a; return option.url && ((_a = option.onMenuClick) === null || _a === void 0 ? void 0 : _a.call(option, e)); } }, option.children.map(function (item) {
|
34
|
+
return (React.createElement(SubMenu, { key: option.key, title: option.text, popupClassName: option.popupClassName, onTitleClick: function (e) { return handleTitleClick(e, option); } }, option.children.map(function (item) {
|
27
35
|
return Option(__assign(__assign({}, item), { onMenuClick: option.onMenuClick }));
|
28
36
|
})));
|
29
37
|
}
|
@@ -68,8 +68,8 @@
|
|
68
68
|
content: '';
|
69
69
|
}
|
70
70
|
.ant-menu.ant-menu-root:focus-visible {
|
71
|
-
-webkit-box-shadow: 0 0 0 2px #
|
72
|
-
box-shadow: 0 0 0 2px #
|
71
|
+
-webkit-box-shadow: 0 0 0 2px #e6eeff;
|
72
|
+
box-shadow: 0 0 0 2px #e6eeff;
|
73
73
|
}
|
74
74
|
.ant-menu ul,
|
75
75
|
.ant-menu ol {
|
@@ -110,7 +110,7 @@
|
|
110
110
|
transition: border-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), padding 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
|
111
111
|
}
|
112
112
|
.ant-menu-submenu-selected {
|
113
|
-
color: #
|
113
|
+
color: #436bff;
|
114
114
|
}
|
115
115
|
.ant-menu-item:active,
|
116
116
|
.ant-menu-submenu-title:active {
|
@@ -129,7 +129,7 @@
|
|
129
129
|
color: #7a869a;
|
130
130
|
}
|
131
131
|
.ant-menu-item a:hover {
|
132
|
-
color: #
|
132
|
+
color: #436bff;
|
133
133
|
}
|
134
134
|
.ant-menu-item a::before {
|
135
135
|
position: absolute;
|
@@ -144,7 +144,7 @@
|
|
144
144
|
color: #7a869a;
|
145
145
|
}
|
146
146
|
.ant-menu-item > .ant-badge a:hover {
|
147
|
-
color: #
|
147
|
+
color: #436bff;
|
148
148
|
}
|
149
149
|
.ant-menu-item-divider {
|
150
150
|
overflow: hidden;
|
@@ -166,11 +166,11 @@
|
|
166
166
|
background-color: transparent;
|
167
167
|
}
|
168
168
|
.ant-menu-item-selected {
|
169
|
-
color: #
|
169
|
+
color: #436bff;
|
170
170
|
}
|
171
171
|
.ant-menu-item-selected a,
|
172
172
|
.ant-menu-item-selected a:hover {
|
173
|
-
color: #
|
173
|
+
color: #436bff;
|
174
174
|
}
|
175
175
|
.ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected {
|
176
176
|
background-color: rgba(255, 255, 255, 0.1);
|
@@ -268,8 +268,8 @@
|
|
268
268
|
}
|
269
269
|
.ant-menu-item:not(.ant-menu-item-disabled):focus-visible,
|
270
270
|
.ant-menu-submenu-title:not(.ant-menu-item-disabled):focus-visible {
|
271
|
-
-webkit-box-shadow: 0 0 0 2px #
|
272
|
-
box-shadow: 0 0 0 2px #
|
271
|
+
-webkit-box-shadow: 0 0 0 2px #e6eeff;
|
272
|
+
box-shadow: 0 0 0 2px #e6eeff;
|
273
273
|
}
|
274
274
|
.ant-menu > .ant-menu-item-divider {
|
275
275
|
margin: 1px 0;
|
@@ -351,7 +351,7 @@
|
|
351
351
|
}
|
352
352
|
.ant-menu-submenu:hover > .ant-menu-submenu-title > .ant-menu-submenu-expand-icon,
|
353
353
|
.ant-menu-submenu:hover > .ant-menu-submenu-title > .ant-menu-submenu-arrow {
|
354
|
-
color: #
|
354
|
+
color: #436bff;
|
355
355
|
}
|
356
356
|
.ant-menu-inline-collapsed .ant-menu-submenu-arrow::before,
|
357
357
|
.ant-menu-submenu-inline .ant-menu-submenu-arrow::before {
|
@@ -381,7 +381,7 @@
|
|
381
381
|
.ant-menu-vertical .ant-menu-submenu-selected,
|
382
382
|
.ant-menu-vertical-left .ant-menu-submenu-selected,
|
383
383
|
.ant-menu-vertical-right .ant-menu-submenu-selected {
|
384
|
-
color: #
|
384
|
+
color: #436bff;
|
385
385
|
}
|
386
386
|
.ant-menu-horizontal {
|
387
387
|
line-height: 46px;
|
@@ -404,7 +404,7 @@
|
|
404
404
|
.ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-submenu-open,
|
405
405
|
.ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-item-selected,
|
406
406
|
.ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-submenu-selected {
|
407
|
-
color: #
|
407
|
+
color: #436bff;
|
408
408
|
}
|
409
409
|
.ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-item:hover::after,
|
410
410
|
.ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-submenu:hover::after,
|
@@ -414,7 +414,7 @@
|
|
414
414
|
.ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-submenu-open::after,
|
415
415
|
.ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-item-selected::after,
|
416
416
|
.ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-submenu-selected::after {
|
417
|
-
border-bottom: 2px solid #
|
417
|
+
border-bottom: 2px solid #436bff;
|
418
418
|
}
|
419
419
|
.ant-menu-horizontal > .ant-menu-item,
|
420
420
|
.ant-menu-horizontal > .ant-menu-submenu {
|
@@ -441,13 +441,13 @@
|
|
441
441
|
color: #7a869a;
|
442
442
|
}
|
443
443
|
.ant-menu-horizontal > .ant-menu-item a:hover {
|
444
|
-
color: #
|
444
|
+
color: #436bff;
|
445
445
|
}
|
446
446
|
.ant-menu-horizontal > .ant-menu-item a::before {
|
447
447
|
bottom: -2px;
|
448
448
|
}
|
449
449
|
.ant-menu-horizontal > .ant-menu-item-selected a {
|
450
|
-
color: #
|
450
|
+
color: #436bff;
|
451
451
|
}
|
452
452
|
.ant-menu-horizontal::after {
|
453
453
|
display: block;
|
@@ -469,7 +469,7 @@
|
|
469
469
|
top: 0;
|
470
470
|
right: 0;
|
471
471
|
bottom: 0;
|
472
|
-
border-right: 3px solid #
|
472
|
+
border-right: 3px solid #436bff;
|
473
473
|
-webkit-transform: scaleY(0.0001);
|
474
474
|
transform: scaleY(0.0001);
|
475
475
|
opacity: 0;
|
@@ -706,22 +706,22 @@
|
|
706
706
|
.ant-menu-light .ant-menu:not(.ant-menu-inline) .ant-menu-submenu-open,
|
707
707
|
.ant-menu-light .ant-menu-submenu-active,
|
708
708
|
.ant-menu-light .ant-menu-submenu-title:hover {
|
709
|
-
color: #
|
709
|
+
color: #436bff;
|
710
710
|
}
|
711
711
|
.ant-menu.ant-menu-root:focus-visible {
|
712
|
-
-webkit-box-shadow: 0 0 0 2px #
|
713
|
-
box-shadow: 0 0 0 2px #
|
712
|
+
-webkit-box-shadow: 0 0 0 2px #2e4dd9;
|
713
|
+
box-shadow: 0 0 0 2px #2e4dd9;
|
714
714
|
}
|
715
715
|
.ant-menu-dark .ant-menu-item:focus-visible,
|
716
716
|
.ant-menu-dark .ant-menu-submenu-title:focus-visible {
|
717
|
-
-webkit-box-shadow: 0 0 0 2px #
|
718
|
-
box-shadow: 0 0 0 2px #
|
717
|
+
-webkit-box-shadow: 0 0 0 2px #2e4dd9;
|
718
|
+
box-shadow: 0 0 0 2px #2e4dd9;
|
719
719
|
}
|
720
720
|
.ant-menu.ant-menu-dark,
|
721
721
|
.ant-menu-dark .ant-menu-sub,
|
722
722
|
.ant-menu.ant-menu-dark .ant-menu-sub {
|
723
723
|
color: #ffffff;
|
724
|
-
background: #
|
724
|
+
background: #436bff;
|
725
725
|
}
|
726
726
|
.ant-menu.ant-menu-dark .ant-menu-submenu-title .ant-menu-submenu-arrow,
|
727
727
|
.ant-menu-dark .ant-menu-sub .ant-menu-submenu-title .ant-menu-submenu-arrow,
|
@@ -752,7 +752,7 @@
|
|
752
752
|
top: 0;
|
753
753
|
margin-top: 0;
|
754
754
|
padding: 0 20px;
|
755
|
-
border-color: #
|
755
|
+
border-color: #436bff;
|
756
756
|
border-bottom: 0;
|
757
757
|
}
|
758
758
|
.ant-menu-dark.ant-menu-horizontal > .ant-menu-item:hover {
|
@@ -1,18 +1,18 @@
|
|
1
|
-
@import 'antd/lib/menu/style/index.less';
|
2
|
-
@import '../../style/theme.less';
|
3
|
-
|
4
|
-
.@{ant-prefix}-menu-vertical.@{ant-prefix}-menu-sub:not([class*='-active']),
|
5
|
-
.@{ant-prefix}-menu-vertical-left.@{ant-prefix}-menu-sub:not([class*='-active']),
|
6
|
-
.@{ant-prefix}-menu-vertical-right.@{ant-prefix}-menu-sub:not([class*='-active']) {
|
7
|
-
max-height: 320px;
|
8
|
-
}
|
9
|
-
.@{ant-prefix}-menu-item {
|
10
|
-
.@{sdk-prefix}-menu-item-a {
|
11
|
-
color: @font-color-7;
|
12
|
-
}
|
13
|
-
}
|
14
|
-
.@{ant-prefix}-menu-horizontal
|
15
|
-
> .@{ant-prefix}-menu-item
|
16
|
-
.@{sdk-prefix}-menu-item-a {
|
17
|
-
color: @font-color-7;
|
18
|
-
}
|
1
|
+
@import 'antd/lib/menu/style/index.less';
|
2
|
+
@import '../../style/theme.less';
|
3
|
+
|
4
|
+
.@{ant-prefix}-menu-vertical.@{ant-prefix}-menu-sub:not([class*='-active']),
|
5
|
+
.@{ant-prefix}-menu-vertical-left.@{ant-prefix}-menu-sub:not([class*='-active']),
|
6
|
+
.@{ant-prefix}-menu-vertical-right.@{ant-prefix}-menu-sub:not([class*='-active']) {
|
7
|
+
max-height: 320px;
|
8
|
+
}
|
9
|
+
.@{ant-prefix}-menu-item {
|
10
|
+
.@{sdk-prefix}-menu-item-a {
|
11
|
+
color: @font-color-7;
|
12
|
+
}
|
13
|
+
}
|
14
|
+
.@{ant-prefix}-menu-horizontal
|
15
|
+
> .@{ant-prefix}-menu-item
|
16
|
+
.@{sdk-prefix}-menu-item-a {
|
17
|
+
color: @font-color-7;
|
18
|
+
}
|