@alfalab/core-components-chart 3.1.7 → 3.1.8
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/Component.js +15 -15
- package/components/Dot/index.css +8 -8
- package/components/Dot/index.js +1 -1
- package/components/Legends/index.css +16 -17
- package/components/Legends/index.js +1 -1
- package/components/Tick/index.css +12 -9
- package/components/Tick/index.js +1 -1
- package/components/TooltipContent/index.css +16 -20
- package/components/TooltipContent/index.js +1 -1
- package/cssm/Component.js +14 -14
- package/cssm/components/Legends/index.module.css +15 -16
- package/cssm/components/Tick/index.module.css +11 -8
- package/cssm/components/TooltipContent/index.module.css +15 -19
- package/cssm/hooks/useSettings/index.js +2 -2
- package/cssm/hooks/useSettings/utils/setDatas.js +2 -2
- package/cssm/hooks/useSettings/utils/setGradientCharts.js +2 -2
- package/cssm/index.js +1 -1
- package/cssm/index.module.css +12 -10
- package/esm/Component.js +2 -2
- package/esm/components/Dot/index.css +8 -8
- package/esm/components/Dot/index.js +1 -1
- package/esm/components/Legends/index.css +16 -17
- package/esm/components/Legends/index.js +1 -1
- package/esm/components/Tick/index.css +12 -9
- package/esm/components/Tick/index.js +1 -1
- package/esm/components/TooltipContent/index.css +16 -20
- package/esm/components/TooltipContent/index.js +1 -1
- package/esm/hooks/useSettings/index.js +1 -1
- package/esm/hooks/useSettings/utils/setDatas.js +1 -1
- package/esm/hooks/useSettings/utils/setGradientCharts.js +1 -1
- package/esm/index.css +13 -11
- package/esm/index.js +1 -1
- package/hooks/useSettings/index.js +2 -2
- package/hooks/useSettings/utils/setDatas.js +2 -2
- package/hooks/useSettings/utils/setGradientCharts.js +2 -2
- package/index.css +13 -11
- package/index.js +1 -1
- package/modern/Component.js +1 -1
- package/modern/components/Dot/index.css +8 -8
- package/modern/components/Dot/index.js +1 -1
- package/modern/components/Legends/index.css +16 -17
- package/modern/components/Legends/index.js +1 -1
- package/modern/components/Tick/index.css +12 -9
- package/modern/components/Tick/index.js +1 -1
- package/modern/components/TooltipContent/index.css +16 -20
- package/modern/components/TooltipContent/index.js +1 -1
- package/modern/index.css +13 -11
- package/package.json +5 -4
- package/cssm/tslib.es6-19b064c1.d.ts +0 -36
- package/cssm/tslib.es6-19b064c1.js +0 -28
- package/esm/tslib.es6-69453a3a.d.ts +0 -36
- package/esm/tslib.es6-69453a3a.js +0 -28
- package/tslib.es6-692855d9.d.ts +0 -36
- package/tslib.es6-692855d9.js +0 -28
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var tslib = require('tslib');
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var hooks_useSettings_utils_setComposedChartsMargin = require('./utils/setComposedChartsMargin.js');
|
|
6
6
|
var hooks_useSettings_utils_setDatas = require('./utils/setDatas.js');
|
|
@@ -15,7 +15,7 @@ var useSettings = function (options) {
|
|
|
15
15
|
var _d = React.useState(0), filterCount = _d[0], setFilterCount = _d[1];
|
|
16
16
|
React.useEffect(function () {
|
|
17
17
|
var _a;
|
|
18
|
-
var settings =
|
|
18
|
+
var settings = tslib.__assign({}, options);
|
|
19
19
|
var brush = settings.brush, legend = settings.legend, series = settings.series, labels = settings.labels, composeChart = settings.composeChart, xAxis = settings.xAxis;
|
|
20
20
|
if (((_a = settings.legend) === null || _a === void 0 ? void 0 : _a.margin) && brush && legend)
|
|
21
21
|
settings.legend.margin.top = hooks_useSettings_utils_setLegendMargin.setLegendMargin(brush, legend);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var tslib = require('tslib');
|
|
4
4
|
|
|
5
5
|
var setDatas = function (series, labels) {
|
|
6
6
|
var initData = [];
|
|
@@ -25,7 +25,7 @@ var setDatas = function (series, labels) {
|
|
|
25
25
|
if (index === -1)
|
|
26
26
|
initData.push(obj);
|
|
27
27
|
else
|
|
28
|
-
initData[index] =
|
|
28
|
+
initData[index] = tslib.__assign(tslib.__assign({}, initData[index]), obj);
|
|
29
29
|
}
|
|
30
30
|
return null;
|
|
31
31
|
});
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var tslib = require('tslib');
|
|
4
4
|
|
|
5
5
|
var setGradientCharts = function (series) {
|
|
6
6
|
var filterSeries = series.filter(function (item) { return item.chart !== 'gradient'; });
|
|
@@ -17,7 +17,7 @@ var setGradientCharts = function (series) {
|
|
|
17
17
|
};
|
|
18
18
|
});
|
|
19
19
|
}
|
|
20
|
-
accum.push(
|
|
20
|
+
accum.push(tslib.__assign(tslib.__assign({}, item), { zIndex: -100, chart: 'gradient', hideLegend: true, hideTooltip: true, properties: tslib.__assign(tslib.__assign({}, item.properties), { dataKey: "".concat(item.properties.dataKey, "-gradient"), fill: fill }), data: newData || item.data }));
|
|
21
21
|
}
|
|
22
22
|
accum.push(item);
|
|
23
23
|
return accum;
|
package/cssm/index.js
CHANGED
package/cssm/index.module.css
CHANGED
|
@@ -1,25 +1,27 @@
|
|
|
1
1
|
:root {
|
|
2
|
+
} /* deprecated */ :root {
|
|
2
3
|
--color-light-text-primary: #0b1f35;
|
|
3
|
-
}
|
|
4
|
-
:root {
|
|
4
|
+
} :root {
|
|
5
|
+
} :root {
|
|
6
|
+
} :root {
|
|
5
7
|
|
|
6
8
|
/* Hard */
|
|
7
9
|
|
|
8
10
|
/* Up */
|
|
9
11
|
|
|
10
12
|
/* Hard up */
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
+
} :root {
|
|
14
|
+
} :root {
|
|
15
|
+
} :root {
|
|
16
|
+
} :root {
|
|
17
|
+
} .coreChart :global(.recharts-line path) {
|
|
13
18
|
transition: d 0.2s ease-out;
|
|
14
|
-
}
|
|
15
|
-
.coreChart :global(.recharts-text tspan) {
|
|
19
|
+
} .coreChart :global(.recharts-text tspan) {
|
|
16
20
|
fill: var(--color-light-text-primary);
|
|
17
21
|
font-size: 16px;
|
|
18
22
|
line-height: 22px;
|
|
19
|
-
}
|
|
20
|
-
.bar {
|
|
23
|
+
} .bar {
|
|
21
24
|
transition: opacity 0.2s ease-out, d 0.2s ease-out;
|
|
22
|
-
}
|
|
23
|
-
.unfocused {
|
|
25
|
+
} .unfocused {
|
|
24
26
|
opacity: 0.3;
|
|
25
27
|
}
|
package/esm/Component.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { __assign } from 'tslib';
|
|
2
2
|
import React, { useState, useRef, useMemo, useCallback, useEffect } from 'react';
|
|
3
3
|
import cn from 'classnames';
|
|
4
4
|
import { Legend, CartesianGrid, XAxis, YAxis, Brush, Tooltip, Area, Line, Bar, LabelList, Cell, ResponsiveContainer, ComposedChart } from 'recharts';
|
|
@@ -29,7 +29,7 @@ var CustomizedHOC = function (Component, options) {
|
|
|
29
29
|
return NewComponent;
|
|
30
30
|
};
|
|
31
31
|
|
|
32
|
-
var styles = {"coreChart":"
|
|
32
|
+
var styles = {"coreChart":"chart__coreChart_l53sx","bar":"chart__bar_l53sx","unfocused":"chart__unfocused_l53sx"};
|
|
33
33
|
require('./index.css')
|
|
34
34
|
|
|
35
35
|
var Chart = function (props) {
|
|
@@ -1,19 +1,19 @@
|
|
|
1
|
-
/* hash:
|
|
2
|
-
.
|
|
1
|
+
/* hash: 1g8f5 */
|
|
2
|
+
.chart__dotUnfocused_112s3 {
|
|
3
3
|
opacity: 0.3;
|
|
4
4
|
}
|
|
5
5
|
|
|
6
|
-
.
|
|
7
|
-
.
|
|
8
|
-
.
|
|
6
|
+
.chart__dot_112s3,
|
|
7
|
+
.chart__dotItem_112s3,
|
|
8
|
+
.chart__dotWrap_112s3 {
|
|
9
9
|
transition: all 0.2s ease;
|
|
10
10
|
}
|
|
11
11
|
|
|
12
|
-
.
|
|
13
|
-
animation:
|
|
12
|
+
.chart__dot_112s3 {
|
|
13
|
+
animation: chart__showDot_112s3 0.5s ease;
|
|
14
14
|
}
|
|
15
15
|
|
|
16
|
-
@keyframes
|
|
16
|
+
@keyframes chart__showDot_112s3 {
|
|
17
17
|
from {
|
|
18
18
|
opacity: 0;
|
|
19
19
|
}
|
|
@@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react';
|
|
|
2
2
|
import cn from 'classnames';
|
|
3
3
|
import { PointIcon } from '../../icons/Point.js';
|
|
4
4
|
|
|
5
|
-
var styles = {"dotUnfocused":"
|
|
5
|
+
var styles = {"dotUnfocused":"chart__dotUnfocused_112s3","dot":"chart__dot_112s3","dotItem":"chart__dotItem_112s3","dotWrap":"chart__dotWrap_112s3","showDot":"chart__showDot_112s3"};
|
|
6
6
|
require('./index.css')
|
|
7
7
|
|
|
8
8
|
var Dot = React.forwardRef(function (_a, ref) {
|
|
@@ -1,40 +1,39 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: 18ofx */
|
|
2
2
|
:root {
|
|
3
|
+
} /* deprecated */ :root {
|
|
4
|
+
} :root {
|
|
5
|
+
} :root {
|
|
6
|
+
} :root {
|
|
3
7
|
|
|
4
8
|
/* Hard */
|
|
5
9
|
|
|
6
10
|
/* Up */
|
|
7
11
|
|
|
8
12
|
/* Hard up */
|
|
9
|
-
}
|
|
10
|
-
:root {
|
|
13
|
+
} :root {
|
|
14
|
+
} :root {
|
|
11
15
|
--gap-2xl: 32px;
|
|
12
|
-
}
|
|
13
|
-
|
|
16
|
+
} :root {
|
|
17
|
+
} :root {
|
|
18
|
+
} .chart__legendContent_v620y {
|
|
14
19
|
display: flex;
|
|
15
20
|
align-items: center;
|
|
16
21
|
flex-wrap: wrap;
|
|
17
|
-
}
|
|
18
|
-
.chart__legendWrap_hzv13 {
|
|
22
|
+
} .chart__legendWrap_v620y {
|
|
19
23
|
width: 100%;
|
|
20
24
|
margin: 0;
|
|
21
25
|
padding: 0;
|
|
22
|
-
}
|
|
23
|
-
.chart__legendItem_hzv13 {
|
|
26
|
+
} .chart__legendItem_v620y {
|
|
24
27
|
margin-right: var(--gap-2xl);
|
|
25
28
|
cursor: pointer;
|
|
26
29
|
display: inline-block;
|
|
27
|
-
}
|
|
28
|
-
.chart__legendItem_hzv13:last-child {
|
|
30
|
+
} .chart__legendItem_v620y:last-child {
|
|
29
31
|
margin-right: 0;
|
|
30
|
-
}
|
|
31
|
-
.chart__legendUnactive_hzv13 {
|
|
32
|
+
} .chart__legendUnactive_v620y {
|
|
32
33
|
opacity: 0.3;
|
|
33
|
-
}
|
|
34
|
-
.chart__legendIcon_hzv13 {
|
|
34
|
+
} .chart__legendIcon_v620y {
|
|
35
35
|
margin-right: 13px;
|
|
36
36
|
display: flex;
|
|
37
|
-
}
|
|
38
|
-
.chart__legendValue_hzv13 {
|
|
37
|
+
} .chart__legendValue_v620y {
|
|
39
38
|
text-transform: capitalize;
|
|
40
39
|
}
|
|
@@ -6,7 +6,7 @@ import { CircleLineIcon } from '../../icons/CircleLine.js';
|
|
|
6
6
|
import { FilledCircleIcon } from '../../icons/FilledCircle.js';
|
|
7
7
|
import { StrokeCircleIcon } from '../../icons/StrokeCircle.js';
|
|
8
8
|
|
|
9
|
-
var styles = {"legendContent":"
|
|
9
|
+
var styles = {"legendContent":"chart__legendContent_v620y","legendWrap":"chart__legendWrap_v620y","legendItem":"chart__legendItem_v620y","legendUnactive":"chart__legendUnactive_v620y","legendIcon":"chart__legendIcon_v620y","legendValue":"chart__legendValue_v620y"};
|
|
10
10
|
require('./index.css')
|
|
11
11
|
|
|
12
12
|
var icons = {
|
|
@@ -1,27 +1,30 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: iq4ad */
|
|
2
2
|
:root {
|
|
3
|
+
} /* deprecated */ :root {
|
|
3
4
|
--color-dark-bg-primary: #0b1f35;
|
|
4
5
|
--color-light-text-primary: #0b1f35;
|
|
5
|
-
}
|
|
6
|
-
:root {
|
|
6
|
+
} :root {
|
|
7
|
+
} :root {
|
|
8
|
+
} :root {
|
|
7
9
|
|
|
8
10
|
/* Hard */
|
|
9
11
|
|
|
10
12
|
/* Up */
|
|
11
13
|
|
|
12
14
|
/* Hard up */
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
+
} :root {
|
|
16
|
+
} :root {
|
|
17
|
+
} :root {
|
|
18
|
+
} :root {
|
|
19
|
+
} .chart__tickText_sx2d9 {
|
|
15
20
|
fill: var(--color-light-text-primary);
|
|
16
21
|
font-size: 16px;
|
|
17
22
|
line-height: 24px;
|
|
18
23
|
font-weight: 400;
|
|
19
|
-
}
|
|
20
|
-
.chart__circle_1p75j {
|
|
24
|
+
} .chart__circle_sx2d9 {
|
|
21
25
|
opacity: 0.3;
|
|
22
26
|
fill: var(--color-dark-bg-primary);
|
|
23
|
-
}
|
|
24
|
-
.chart__circle_1p75j {
|
|
27
|
+
} .chart__circle_sx2d9 {
|
|
25
28
|
opacity: 0.3;
|
|
26
29
|
fill: var(--color-dark-bg-primary);
|
|
27
30
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import cn from 'classnames';
|
|
3
3
|
|
|
4
|
-
var styles = {"tickText":"
|
|
4
|
+
var styles = {"tickText":"chart__tickText_sx2d9","circle":"chart__circle_sx2d9"};
|
|
5
5
|
require('./index.css')
|
|
6
6
|
|
|
7
7
|
var Tick = function (_a) {
|
|
@@ -1,9 +1,11 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: kl17q */
|
|
2
2
|
:root {
|
|
3
|
+
} /* deprecated */ :root {
|
|
3
4
|
--color-light-bg-primary: #fff;
|
|
4
5
|
--color-light-border-primary: #dbdee1;
|
|
5
|
-
}
|
|
6
|
-
:root {
|
|
6
|
+
} :root {
|
|
7
|
+
} :root {
|
|
8
|
+
} :root {
|
|
7
9
|
--shadow-l: 0 0 24px rgba(11, 31, 53, 0.12), 0 12px 24px rgba(11, 31, 53, 0.24);
|
|
8
10
|
|
|
9
11
|
/* Hard */
|
|
@@ -11,15 +13,14 @@
|
|
|
11
13
|
/* Up */
|
|
12
14
|
|
|
13
15
|
/* Hard up */
|
|
14
|
-
}
|
|
15
|
-
:
|
|
16
|
+
} :root {
|
|
17
|
+
--border-radius-m: 8px;
|
|
18
|
+
} :root {
|
|
16
19
|
--gap-s: 12px;
|
|
17
20
|
--gap-m: 16px;
|
|
18
|
-
}
|
|
19
|
-
:root {
|
|
20
|
-
|
|
21
|
-
}
|
|
22
|
-
.chart__tooltip_1tjmf {
|
|
21
|
+
} :root {
|
|
22
|
+
} :root {
|
|
23
|
+
} .chart__tooltip_1g2qp {
|
|
23
24
|
background-color: var(--color-light-bg-primary);
|
|
24
25
|
border: 1px solid var(--color-light-border-primary);
|
|
25
26
|
box-shadow: var(--shadow-l);
|
|
@@ -27,18 +28,15 @@
|
|
|
27
28
|
padding: var(--gap-s) var(--gap-m);
|
|
28
29
|
pointer-events: none;
|
|
29
30
|
position: relative;
|
|
30
|
-
}
|
|
31
|
-
.chart__tooltipList_1tjmf {
|
|
31
|
+
} .chart__tooltipList_1g2qp {
|
|
32
32
|
position: relative;
|
|
33
33
|
z-index: 5;
|
|
34
34
|
list-style-type: none;
|
|
35
35
|
padding: 0;
|
|
36
36
|
margin: 0;
|
|
37
|
-
}
|
|
38
|
-
.chart__tooltipItem_1tjmf {
|
|
37
|
+
} .chart__tooltipItem_1g2qp {
|
|
39
38
|
margin-bottom: 10px;
|
|
40
|
-
}
|
|
41
|
-
.chart__tooltipArrow_1tjmf {
|
|
39
|
+
} .chart__tooltipArrow_1g2qp {
|
|
42
40
|
position: absolute;
|
|
43
41
|
left: 0;
|
|
44
42
|
top: 50%;
|
|
@@ -47,8 +45,7 @@
|
|
|
47
45
|
height: 10px;
|
|
48
46
|
border: 1px solid var(--color-light-border-primary);
|
|
49
47
|
background-color: var(--color-light-bg-primary);
|
|
50
|
-
}
|
|
51
|
-
.chart__tooltipArrow_1tjmf:before {
|
|
48
|
+
} .chart__tooltipArrow_1g2qp:before {
|
|
52
49
|
content: '';
|
|
53
50
|
position: absolute;
|
|
54
51
|
left: -2px;
|
|
@@ -58,8 +55,7 @@
|
|
|
58
55
|
border-style: solid;
|
|
59
56
|
border-width: 0 24px 24px 0;
|
|
60
57
|
border-color: transparent var(--color-light-bg-primary) transparent transparent;
|
|
61
|
-
}
|
|
62
|
-
.chart__tooltipArrowRight_1tjmf {
|
|
58
|
+
} .chart__tooltipArrowRight_1g2qp {
|
|
63
59
|
left: 100%;
|
|
64
60
|
transform: translate(-50%, -50%) scale(-1, 1) rotate(45deg);
|
|
65
61
|
}
|
|
@@ -2,7 +2,7 @@ import React from 'react';
|
|
|
2
2
|
import cn from 'classnames';
|
|
3
3
|
import { Typography } from '@alfalab/core-components-typography/esm';
|
|
4
4
|
|
|
5
|
-
var styles = {"tooltip":"
|
|
5
|
+
var styles = {"tooltip":"chart__tooltip_1g2qp","tooltipList":"chart__tooltipList_1g2qp","tooltipItem":"chart__tooltipItem_1g2qp","tooltipArrow":"chart__tooltipArrow_1g2qp","tooltipArrowRight":"chart__tooltipArrowRight_1g2qp"};
|
|
6
6
|
require('./index.css')
|
|
7
7
|
|
|
8
8
|
var TooltipContent = function (_a) {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { __assign } from 'tslib';
|
|
2
2
|
import { useState, useEffect } from 'react';
|
|
3
3
|
import { setComposedChartsMargin } from './utils/setComposedChartsMargin.js';
|
|
4
4
|
import { setDatas } from './utils/setDatas.js';
|
package/esm/index.css
CHANGED
|
@@ -1,26 +1,28 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: 175n2 */
|
|
2
2
|
:root {
|
|
3
|
+
} /* deprecated */ :root {
|
|
3
4
|
--color-light-text-primary: #0b1f35;
|
|
4
|
-
}
|
|
5
|
-
:root {
|
|
5
|
+
} :root {
|
|
6
|
+
} :root {
|
|
7
|
+
} :root {
|
|
6
8
|
|
|
7
9
|
/* Hard */
|
|
8
10
|
|
|
9
11
|
/* Up */
|
|
10
12
|
|
|
11
13
|
/* Hard up */
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
+
} :root {
|
|
15
|
+
} :root {
|
|
16
|
+
} :root {
|
|
17
|
+
} :root {
|
|
18
|
+
} .chart__coreChart_l53sx .recharts-line path {
|
|
14
19
|
transition: d 0.2s ease-out;
|
|
15
|
-
}
|
|
16
|
-
.chart__coreChart_sapp3 .recharts-text tspan {
|
|
20
|
+
} .chart__coreChart_l53sx .recharts-text tspan {
|
|
17
21
|
fill: var(--color-light-text-primary);
|
|
18
22
|
font-size: 16px;
|
|
19
23
|
line-height: 22px;
|
|
20
|
-
}
|
|
21
|
-
.chart__bar_sapp3 {
|
|
24
|
+
} .chart__bar_l53sx {
|
|
22
25
|
transition: opacity 0.2s ease-out, d 0.2s ease-out;
|
|
23
|
-
}
|
|
24
|
-
.chart__unfocused_sapp3 {
|
|
26
|
+
} .chart__unfocused_l53sx {
|
|
25
27
|
opacity: 0.3;
|
|
26
28
|
}
|
package/esm/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var tslib = require('tslib');
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var hooks_useSettings_utils_setComposedChartsMargin = require('./utils/setComposedChartsMargin.js');
|
|
6
6
|
var hooks_useSettings_utils_setDatas = require('./utils/setDatas.js');
|
|
@@ -15,7 +15,7 @@ var useSettings = function (options) {
|
|
|
15
15
|
var _d = React.useState(0), filterCount = _d[0], setFilterCount = _d[1];
|
|
16
16
|
React.useEffect(function () {
|
|
17
17
|
var _a;
|
|
18
|
-
var settings =
|
|
18
|
+
var settings = tslib.__assign({}, options);
|
|
19
19
|
var brush = settings.brush, legend = settings.legend, series = settings.series, labels = settings.labels, composeChart = settings.composeChart, xAxis = settings.xAxis;
|
|
20
20
|
if (((_a = settings.legend) === null || _a === void 0 ? void 0 : _a.margin) && brush && legend)
|
|
21
21
|
settings.legend.margin.top = hooks_useSettings_utils_setLegendMargin.setLegendMargin(brush, legend);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var tslib = require('tslib');
|
|
4
4
|
|
|
5
5
|
var setDatas = function (series, labels) {
|
|
6
6
|
var initData = [];
|
|
@@ -25,7 +25,7 @@ var setDatas = function (series, labels) {
|
|
|
25
25
|
if (index === -1)
|
|
26
26
|
initData.push(obj);
|
|
27
27
|
else
|
|
28
|
-
initData[index] =
|
|
28
|
+
initData[index] = tslib.__assign(tslib.__assign({}, initData[index]), obj);
|
|
29
29
|
}
|
|
30
30
|
return null;
|
|
31
31
|
});
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var tslib = require('tslib');
|
|
4
4
|
|
|
5
5
|
var setGradientCharts = function (series) {
|
|
6
6
|
var filterSeries = series.filter(function (item) { return item.chart !== 'gradient'; });
|
|
@@ -17,7 +17,7 @@ var setGradientCharts = function (series) {
|
|
|
17
17
|
};
|
|
18
18
|
});
|
|
19
19
|
}
|
|
20
|
-
accum.push(
|
|
20
|
+
accum.push(tslib.__assign(tslib.__assign({}, item), { zIndex: -100, chart: 'gradient', hideLegend: true, hideTooltip: true, properties: tslib.__assign(tslib.__assign({}, item.properties), { dataKey: "".concat(item.properties.dataKey, "-gradient"), fill: fill }), data: newData || item.data }));
|
|
21
21
|
}
|
|
22
22
|
accum.push(item);
|
|
23
23
|
return accum;
|
package/index.css
CHANGED
|
@@ -1,26 +1,28 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: 175n2 */
|
|
2
2
|
:root {
|
|
3
|
+
} /* deprecated */ :root {
|
|
3
4
|
--color-light-text-primary: #0b1f35;
|
|
4
|
-
}
|
|
5
|
-
:root {
|
|
5
|
+
} :root {
|
|
6
|
+
} :root {
|
|
7
|
+
} :root {
|
|
6
8
|
|
|
7
9
|
/* Hard */
|
|
8
10
|
|
|
9
11
|
/* Up */
|
|
10
12
|
|
|
11
13
|
/* Hard up */
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
+
} :root {
|
|
15
|
+
} :root {
|
|
16
|
+
} :root {
|
|
17
|
+
} :root {
|
|
18
|
+
} .chart__coreChart_l53sx .recharts-line path {
|
|
14
19
|
transition: d 0.2s ease-out;
|
|
15
|
-
}
|
|
16
|
-
.chart__coreChart_sapp3 .recharts-text tspan {
|
|
20
|
+
} .chart__coreChart_l53sx .recharts-text tspan {
|
|
17
21
|
fill: var(--color-light-text-primary);
|
|
18
22
|
font-size: 16px;
|
|
19
23
|
line-height: 22px;
|
|
20
|
-
}
|
|
21
|
-
.chart__bar_sapp3 {
|
|
24
|
+
} .chart__bar_l53sx {
|
|
22
25
|
transition: opacity 0.2s ease-out, d 0.2s ease-out;
|
|
23
|
-
}
|
|
24
|
-
.chart__unfocused_sapp3 {
|
|
26
|
+
} .chart__unfocused_l53sx {
|
|
25
27
|
opacity: 0.3;
|
|
26
28
|
}
|
package/index.js
CHANGED
package/modern/Component.js
CHANGED
|
@@ -28,7 +28,7 @@ const CustomizedHOC = (Component, options) => {
|
|
|
28
28
|
return NewComponent;
|
|
29
29
|
};
|
|
30
30
|
|
|
31
|
-
const styles = {"coreChart":"
|
|
31
|
+
const styles = {"coreChart":"chart__coreChart_l53sx","bar":"chart__bar_l53sx","unfocused":"chart__unfocused_l53sx"};
|
|
32
32
|
require('./index.css')
|
|
33
33
|
|
|
34
34
|
const Chart = (props) => {
|
|
@@ -1,19 +1,19 @@
|
|
|
1
|
-
/* hash:
|
|
2
|
-
.
|
|
1
|
+
/* hash: 1g8f5 */
|
|
2
|
+
.chart__dotUnfocused_112s3 {
|
|
3
3
|
opacity: 0.3;
|
|
4
4
|
}
|
|
5
5
|
|
|
6
|
-
.
|
|
7
|
-
.
|
|
8
|
-
.
|
|
6
|
+
.chart__dot_112s3,
|
|
7
|
+
.chart__dotItem_112s3,
|
|
8
|
+
.chart__dotWrap_112s3 {
|
|
9
9
|
transition: all 0.2s ease;
|
|
10
10
|
}
|
|
11
11
|
|
|
12
|
-
.
|
|
13
|
-
animation:
|
|
12
|
+
.chart__dot_112s3 {
|
|
13
|
+
animation: chart__showDot_112s3 0.5s ease;
|
|
14
14
|
}
|
|
15
15
|
|
|
16
|
-
@keyframes
|
|
16
|
+
@keyframes chart__showDot_112s3 {
|
|
17
17
|
from {
|
|
18
18
|
opacity: 0;
|
|
19
19
|
}
|
|
@@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react';
|
|
|
2
2
|
import cn from 'classnames';
|
|
3
3
|
import { PointIcon } from '../../icons/Point.js';
|
|
4
4
|
|
|
5
|
-
const styles = {"dotUnfocused":"
|
|
5
|
+
const styles = {"dotUnfocused":"chart__dotUnfocused_112s3","dot":"chart__dot_112s3","dotItem":"chart__dotItem_112s3","dotWrap":"chart__dotWrap_112s3","showDot":"chart__showDot_112s3"};
|
|
6
6
|
require('./index.css')
|
|
7
7
|
|
|
8
8
|
const Dot = React.forwardRef(({ cx, cy, index, activeDot, dataKey, dotSettings, value, stroke }, ref) => {
|
|
@@ -1,40 +1,39 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: 18ofx */
|
|
2
2
|
:root {
|
|
3
|
+
} /* deprecated */ :root {
|
|
4
|
+
} :root {
|
|
5
|
+
} :root {
|
|
6
|
+
} :root {
|
|
3
7
|
|
|
4
8
|
/* Hard */
|
|
5
9
|
|
|
6
10
|
/* Up */
|
|
7
11
|
|
|
8
12
|
/* Hard up */
|
|
9
|
-
}
|
|
10
|
-
:root {
|
|
13
|
+
} :root {
|
|
14
|
+
} :root {
|
|
11
15
|
--gap-2xl: 32px;
|
|
12
|
-
}
|
|
13
|
-
|
|
16
|
+
} :root {
|
|
17
|
+
} :root {
|
|
18
|
+
} .chart__legendContent_v620y {
|
|
14
19
|
display: flex;
|
|
15
20
|
align-items: center;
|
|
16
21
|
flex-wrap: wrap;
|
|
17
|
-
}
|
|
18
|
-
.chart__legendWrap_hzv13 {
|
|
22
|
+
} .chart__legendWrap_v620y {
|
|
19
23
|
width: 100%;
|
|
20
24
|
margin: 0;
|
|
21
25
|
padding: 0;
|
|
22
|
-
}
|
|
23
|
-
.chart__legendItem_hzv13 {
|
|
26
|
+
} .chart__legendItem_v620y {
|
|
24
27
|
margin-right: var(--gap-2xl);
|
|
25
28
|
cursor: pointer;
|
|
26
29
|
display: inline-block;
|
|
27
|
-
}
|
|
28
|
-
.chart__legendItem_hzv13:last-child {
|
|
30
|
+
} .chart__legendItem_v620y:last-child {
|
|
29
31
|
margin-right: 0;
|
|
30
|
-
}
|
|
31
|
-
.chart__legendUnactive_hzv13 {
|
|
32
|
+
} .chart__legendUnactive_v620y {
|
|
32
33
|
opacity: 0.3;
|
|
33
|
-
}
|
|
34
|
-
.chart__legendIcon_hzv13 {
|
|
34
|
+
} .chart__legendIcon_v620y {
|
|
35
35
|
margin-right: 13px;
|
|
36
36
|
display: flex;
|
|
37
|
-
}
|
|
38
|
-
.chart__legendValue_hzv13 {
|
|
37
|
+
} .chart__legendValue_v620y {
|
|
39
38
|
text-transform: capitalize;
|
|
40
39
|
}
|
|
@@ -6,7 +6,7 @@ import { CircleLineIcon } from '../../icons/CircleLine.js';
|
|
|
6
6
|
import { FilledCircleIcon } from '../../icons/FilledCircle.js';
|
|
7
7
|
import { StrokeCircleIcon } from '../../icons/StrokeCircle.js';
|
|
8
8
|
|
|
9
|
-
const styles = {"legendContent":"
|
|
9
|
+
const styles = {"legendContent":"chart__legendContent_v620y","legendWrap":"chart__legendWrap_v620y","legendItem":"chart__legendItem_v620y","legendUnactive":"chart__legendUnactive_v620y","legendIcon":"chart__legendIcon_v620y","legendValue":"chart__legendValue_v620y"};
|
|
10
10
|
require('./index.css')
|
|
11
11
|
|
|
12
12
|
const icons = {
|