@alfalab/core-components-chart 3.1.4 → 3.1.5
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 +39 -41
- package/components/CustomizedLabel.js +5 -7
- package/components/Dot/index.css +8 -8
- package/components/Dot/index.js +9 -11
- package/components/Legends/index.css +8 -8
- package/components/Legends/index.js +13 -15
- package/components/LinearGradient.js +3 -5
- package/components/RectBar.js +5 -7
- package/components/Tick/index.css +4 -4
- package/components/Tick/index.js +7 -9
- package/components/TooltipContent/index.css +7 -7
- package/components/TooltipContent/index.js +12 -14
- package/cssm/Component.js +41 -43
- package/cssm/components/CustomizedLabel.js +5 -7
- package/cssm/components/Dot/index.js +10 -12
- package/cssm/components/Legends/index.js +13 -15
- package/cssm/components/LinearGradient.js +3 -5
- package/cssm/components/RectBar.js +5 -7
- package/cssm/components/Tick/index.js +7 -9
- package/cssm/components/TooltipContent/index.js +12 -14
- package/cssm/hooks/usePathBar/index.js +0 -2
- package/cssm/hooks/usePathBar/utils/getRadius.js +0 -2
- package/cssm/hooks/useSettings/index.js +1 -3
- package/cssm/hooks/useSettings/utils/setComposedChartsMargin.js +0 -2
- package/cssm/hooks/useSettings/utils/setDatas.js +4 -6
- package/cssm/hooks/useSettings/utils/setGradientCharts.js +2 -4
- package/cssm/hooks/useSettings/utils/setLegendMargin.js +0 -2
- package/cssm/hooks/useSettings/utils/sortByIndex.js +0 -2
- package/cssm/icons/Circle.js +4 -6
- package/cssm/icons/CircleLine.js +5 -7
- package/cssm/icons/FilledCircle.js +8 -10
- package/cssm/icons/Point.js +5 -7
- package/cssm/icons/StrokeCircle.js +4 -6
- package/cssm/index.js +9 -11
- package/cssm/{tslib.es6-0de342ae.d.ts → tslib.es6-19b064c1.d.ts} +0 -0
- package/cssm/{tslib.es6-0de342ae.js → tslib.es6-19b064c1.js} +0 -0
- package/cssm/types/utils/index.d.ts +1 -0
- package/esm/Component.js +23 -23
- package/esm/components/CustomizedLabel.js +1 -1
- package/esm/components/Dot/index.css +8 -8
- package/esm/components/Dot/index.js +3 -3
- package/esm/components/Legends/index.css +8 -8
- package/esm/components/Legends/index.js +4 -4
- package/esm/components/LinearGradient.js +1 -1
- package/esm/components/RectBar.js +2 -2
- package/esm/components/Tick/index.css +4 -4
- package/esm/components/Tick/index.js +2 -2
- package/esm/components/TooltipContent/index.css +7 -7
- package/esm/components/TooltipContent/index.js +2 -2
- package/esm/hooks/useSettings/index.js +1 -1
- package/esm/hooks/useSettings/utils/setDatas.js +4 -4
- package/esm/hooks/useSettings/utils/setGradientCharts.js +2 -2
- package/esm/index.css +5 -5
- package/esm/index.js +7 -7
- package/esm/{tslib.es6-98750278.d.ts → tslib.es6-c1e06c73.d.ts} +0 -0
- package/esm/{tslib.es6-98750278.js → tslib.es6-c1e06c73.js} +0 -0
- package/esm/types/utils/index.d.ts +1 -0
- package/hooks/usePathBar/index.js +0 -2
- package/hooks/usePathBar/utils/getRadius.js +0 -2
- package/hooks/useSettings/index.js +1 -3
- package/hooks/useSettings/utils/setComposedChartsMargin.js +0 -2
- package/hooks/useSettings/utils/setDatas.js +4 -6
- package/hooks/useSettings/utils/setGradientCharts.js +2 -4
- package/hooks/useSettings/utils/setLegendMargin.js +0 -2
- package/hooks/useSettings/utils/sortByIndex.js +0 -2
- package/icons/Circle.js +4 -6
- package/icons/CircleLine.js +5 -7
- package/icons/FilledCircle.js +8 -10
- package/icons/Point.js +5 -7
- package/icons/StrokeCircle.js +4 -6
- package/index.css +5 -5
- package/index.js +7 -9
- package/modern/Component.js +10 -10
- package/modern/components/CustomizedLabel.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 +8 -8
- package/modern/components/Legends/index.js +1 -1
- package/modern/components/RectBar.js +1 -1
- package/modern/components/Tick/index.css +4 -4
- package/modern/components/Tick/index.js +1 -1
- package/modern/components/TooltipContent/index.css +7 -7
- package/modern/components/TooltipContent/index.js +1 -1
- package/modern/index.css +5 -5
- package/modern/index.js +6 -6
- package/modern/types/utils/index.d.ts +1 -0
- package/package.json +2 -2
- package/{tslib.es6-27fe16ea.d.ts → tslib.es6-2bc3955e.d.ts} +0 -0
- package/{tslib.es6-27fe16ea.js → tslib.es6-2bc3955e.js} +0 -0
- package/types/utils/index.d.ts +1 -0
|
@@ -1,37 +1,35 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
3
|
var React = require('react');
|
|
6
4
|
var cn = require('classnames');
|
|
7
5
|
var coreComponentsTypography = require('@alfalab/core-components-typography');
|
|
8
6
|
|
|
9
|
-
function
|
|
7
|
+
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
10
8
|
|
|
11
|
-
var React__default = /*#__PURE__*/
|
|
12
|
-
var cn__default = /*#__PURE__*/
|
|
9
|
+
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
10
|
+
var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
|
|
13
11
|
|
|
14
|
-
var styles = {"tooltip":"
|
|
12
|
+
var styles = {"tooltip":"chart__tooltip_4pmy3","tooltipList":"chart__tooltipList_4pmy3","tooltipItem":"chart__tooltipItem_4pmy3","tooltipArrow":"chart__tooltipArrow_4pmy3","tooltipArrowRight":"chart__tooltipArrowRight_4pmy3"};
|
|
15
13
|
require('./index.css')
|
|
16
14
|
|
|
17
15
|
var TooltipContent = function (_a) {
|
|
18
16
|
var payload = _a.payload, separator = _a.separator, label = _a.label, tooltipArrowSide = _a.tooltipArrowSide, arrow = _a.arrow, series = _a.series, labelFormatter = _a.labelFormatter, labelStyle = _a.labelStyle;
|
|
19
17
|
if (!label || payload.length === 0)
|
|
20
18
|
return null;
|
|
21
|
-
return (React__default
|
|
22
|
-
arrow && (React__default
|
|
23
|
-
React__default
|
|
24
|
-
React__default
|
|
25
|
-
React__default
|
|
19
|
+
return (React__default.default.createElement("div", { className: cn__default.default(styles.tooltip) },
|
|
20
|
+
arrow && (React__default.default.createElement("span", { className: cn__default.default(styles.tooltipArrow, tooltipArrowSide ? '' : styles.tooltipArrowRight) })),
|
|
21
|
+
React__default.default.createElement("ul", { className: cn__default.default(styles.tooltipList) },
|
|
22
|
+
React__default.default.createElement("li", { className: cn__default.default(styles.tooltipItem), style: labelStyle },
|
|
23
|
+
React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', tag: 'span', weight: 'medium', className: cn__default.default(styles.tooltipLabel) }, labelFormatter ? labelFormatter(label) : label)),
|
|
26
24
|
payload.map(function (entry) {
|
|
27
25
|
var data = series.find(function (d) { return d.properties.dataKey === entry.dataKey; });
|
|
28
26
|
if ((data === null || data === void 0 ? void 0 : data.hideTooltip) || (data === null || data === void 0 ? void 0 : data.hide))
|
|
29
27
|
return null;
|
|
30
|
-
return (React__default
|
|
31
|
-
React__default
|
|
28
|
+
return (React__default.default.createElement("li", { className: cn__default.default(styles.tooltipItem), key: entry.dataKey, style: { color: entry.color } },
|
|
29
|
+
React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', tag: 'span', weight: 'medium', className: cn__default.default(styles.tooltipValue) },
|
|
32
30
|
(entry === null || entry === void 0 ? void 0 : entry.formatter) ? entry.formatter(entry.value) : entry.value,
|
|
33
31
|
separator || ' '),
|
|
34
|
-
React__default
|
|
32
|
+
React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'secondary-large', tag: 'span', className: cn__default.default(styles.tooltipName) }, "".concat(entry.name))));
|
|
35
33
|
}))));
|
|
36
34
|
};
|
|
37
35
|
|
package/cssm/Component.js
CHANGED
|
@@ -1,46 +1,44 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var tslib_es6 = require('./tslib.es6-0de342ae.js');
|
|
3
|
+
var tslib_es6 = require('./tslib.es6-19b064c1.js');
|
|
6
4
|
var React = require('react');
|
|
7
5
|
var cn = require('classnames');
|
|
8
6
|
var recharts = require('recharts');
|
|
9
|
-
require('./hooks/usePathBar/utils/getRadius.js');
|
|
10
|
-
require('./hooks/usePathBar/index.js');
|
|
11
7
|
var components_CustomizedLabel = require('./components/CustomizedLabel.js');
|
|
8
|
+
var components_Dot_index = require('./components/Dot/index.js');
|
|
9
|
+
var components_Legends_index = require('./components/Legends/index.js');
|
|
10
|
+
var components_LinearGradient = require('./components/LinearGradient.js');
|
|
11
|
+
var components_RectBar = require('./components/RectBar.js');
|
|
12
|
+
var components_Tick_index = require('./components/Tick/index.js');
|
|
13
|
+
var components_TooltipContent_index = require('./components/TooltipContent/index.js');
|
|
14
|
+
var hooks_useSettings_index = require('./hooks/useSettings/index.js');
|
|
15
|
+
var styles = require('./index.module.css');
|
|
16
|
+
require('./hooks/usePathBar/index.js');
|
|
17
|
+
require('./hooks/usePathBar/utils/getRadius.js');
|
|
12
18
|
require('./icons/Point.js');
|
|
13
19
|
require('./components/Dot/index.module.css');
|
|
14
|
-
var components_Dot_index = require('./components/Dot/index.js');
|
|
15
20
|
require('@alfalab/core-components-typography/cssm');
|
|
16
21
|
require('./icons/Circle.js');
|
|
17
22
|
require('./icons/CircleLine.js');
|
|
18
23
|
require('./icons/FilledCircle.js');
|
|
19
24
|
require('./icons/StrokeCircle.js');
|
|
20
25
|
require('./components/Legends/index.module.css');
|
|
21
|
-
var components_Legends_index = require('./components/Legends/index.js');
|
|
22
|
-
var components_LinearGradient = require('./components/LinearGradient.js');
|
|
23
|
-
var components_RectBar = require('./components/RectBar.js');
|
|
24
26
|
require('./components/Tick/index.module.css');
|
|
25
|
-
var components_Tick_index = require('./components/Tick/index.js');
|
|
26
27
|
require('./components/TooltipContent/index.module.css');
|
|
27
|
-
var components_TooltipContent_index = require('./components/TooltipContent/index.js');
|
|
28
28
|
require('./hooks/useSettings/utils/setComposedChartsMargin.js');
|
|
29
29
|
require('./hooks/useSettings/utils/setDatas.js');
|
|
30
30
|
require('./hooks/useSettings/utils/setGradientCharts.js');
|
|
31
31
|
require('./hooks/useSettings/utils/setLegendMargin.js');
|
|
32
32
|
require('./hooks/useSettings/utils/sortByIndex.js');
|
|
33
|
-
var hooks_useSettings_index = require('./hooks/useSettings/index.js');
|
|
34
|
-
var styles = require('./index.module.css');
|
|
35
33
|
|
|
36
|
-
function
|
|
34
|
+
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
37
35
|
|
|
38
|
-
var React__default = /*#__PURE__*/
|
|
39
|
-
var cn__default = /*#__PURE__*/
|
|
40
|
-
var styles__default = /*#__PURE__*/
|
|
36
|
+
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
37
|
+
var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
|
|
38
|
+
var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
|
|
41
39
|
|
|
42
40
|
var CustomizedHOC = function (Component, options) {
|
|
43
|
-
var NewComponent = function (props) { return React__default
|
|
41
|
+
var NewComponent = function (props) { return React__default.default.createElement(Component, tslib_es6.__assign({}, props, options)); };
|
|
44
42
|
return NewComponent;
|
|
45
43
|
};
|
|
46
44
|
|
|
@@ -64,18 +62,18 @@ var Chart = function (props) {
|
|
|
64
62
|
if (chart !== 'gradient' || !gradient)
|
|
65
63
|
return null;
|
|
66
64
|
var gid = gradient.gid, points = gradient.points;
|
|
67
|
-
return (React__default
|
|
65
|
+
return (React__default.default.createElement(components_LinearGradient.LinearGradient, { key: "".concat(state.id, "-").concat(gid), id: state.id, gid: gid, points: points }));
|
|
68
66
|
});
|
|
69
67
|
}, [state]);
|
|
70
68
|
var toggleChart = React.useCallback(function (item) {
|
|
71
69
|
var chart = item.chart, dataKey = item.properties.dataKey;
|
|
72
70
|
var withGrad = chart === 'area';
|
|
73
71
|
var changed = false;
|
|
74
|
-
if (charts[""
|
|
72
|
+
if (charts["".concat(dataKey)] && filterCount > 1) {
|
|
75
73
|
changed = true;
|
|
76
74
|
setFilterCount(function (prev) { return prev - 1; });
|
|
77
75
|
}
|
|
78
|
-
if (!charts[""
|
|
76
|
+
if (!charts["".concat(dataKey)]) {
|
|
79
77
|
changed = true;
|
|
80
78
|
setFilterCount(function (prev) { return prev + 1; });
|
|
81
79
|
}
|
|
@@ -83,9 +81,9 @@ var Chart = function (props) {
|
|
|
83
81
|
return;
|
|
84
82
|
setCharts(function (prev) {
|
|
85
83
|
var newState = tslib_es6.__assign({}, prev);
|
|
86
|
-
newState[""
|
|
84
|
+
newState["".concat(dataKey)] = !newState["".concat(dataKey)];
|
|
87
85
|
if (withGrad)
|
|
88
|
-
newState[dataKey
|
|
86
|
+
newState["".concat(dataKey, "-gradient")] = !newState["".concat(dataKey, "-gradient")];
|
|
89
87
|
return newState;
|
|
90
88
|
});
|
|
91
89
|
}, [charts, filterCount, setCharts, setFilterCount]);
|
|
@@ -104,14 +102,14 @@ var Chart = function (props) {
|
|
|
104
102
|
var translate = ((_a = state === null || state === void 0 ? void 0 : state.xAxis) === null || _a === void 0 ? void 0 : _a.tickMargin) && ((_b = state === null || state === void 0 ? void 0 : state.legend) === null || _b === void 0 ? void 0 : _b.verticalAlign) !== 'top'
|
|
105
103
|
? state.xAxis.tickMargin + (((_c = state === null || state === void 0 ? void 0 : state.brush) === null || _c === void 0 ? void 0 : _c.brushMargin) || 0)
|
|
106
104
|
: 0;
|
|
107
|
-
return (React__default
|
|
108
|
-
transform: "translateY("
|
|
105
|
+
return (React__default.default.createElement(recharts.Legend, tslib_es6.__assign({}, (state.legend || null), { content: React__default.default.createElement(components_Legends_index.Legends, { legend: state.legend, series: state.series, id: state.id, toggleChart: toggleChart, ref: legendRef, charts: charts }), wrapperStyle: {
|
|
106
|
+
transform: "translateY(".concat(translate, "px)"),
|
|
109
107
|
} })));
|
|
110
108
|
}, [state, charts, toggleChart, legendRef]);
|
|
111
109
|
var renderCartesianGrid = React.useMemo(function () {
|
|
112
110
|
if (!(state === null || state === void 0 ? void 0 : state.cartesianGrid))
|
|
113
111
|
return null;
|
|
114
|
-
return React__default
|
|
112
|
+
return React__default.default.createElement(recharts.CartesianGrid, tslib_es6.__assign({}, state.cartesianGrid));
|
|
115
113
|
}, [state]);
|
|
116
114
|
var renderXAxis = React.useMemo(function () {
|
|
117
115
|
var _a;
|
|
@@ -127,7 +125,7 @@ var Chart = function (props) {
|
|
|
127
125
|
else {
|
|
128
126
|
tick = true;
|
|
129
127
|
}
|
|
130
|
-
return React__default
|
|
128
|
+
return React__default.default.createElement(recharts.XAxis, tslib_es6.__assign({}, state.xAxis, { tick: tick }));
|
|
131
129
|
}, [state]);
|
|
132
130
|
var renderYAxis = React.useMemo(function () {
|
|
133
131
|
var _a;
|
|
@@ -143,38 +141,38 @@ var Chart = function (props) {
|
|
|
143
141
|
else {
|
|
144
142
|
tick = true;
|
|
145
143
|
}
|
|
146
|
-
return React__default
|
|
144
|
+
return React__default.default.createElement(recharts.YAxis, tslib_es6.__assign({}, state.yAxis, { tick: tick }));
|
|
147
145
|
}, [state]);
|
|
148
146
|
var renderBrush = React.useMemo(function () {
|
|
149
147
|
if (!(state === null || state === void 0 ? void 0 : state.brush))
|
|
150
148
|
return null;
|
|
151
|
-
return React__default
|
|
149
|
+
return React__default.default.createElement(recharts.Brush, tslib_es6.__assign({ y: typeof yBrush === 'number' ? yBrush : 0 }, state.brush));
|
|
152
150
|
}, [state, yBrush]);
|
|
153
151
|
var renderTooltip = React.useMemo(function () {
|
|
154
152
|
if (!(state === null || state === void 0 ? void 0 : state.tooltip))
|
|
155
153
|
return null;
|
|
156
|
-
return (React__default
|
|
154
|
+
return (React__default.default.createElement(recharts.Tooltip, tslib_es6.__assign({ ref: tooltipRef }, state.tooltip, { content: CustomizedHOC(components_TooltipContent_index.TooltipContent, { series: state.series, tooltipArrowSide: tooltipArrowSide }) })));
|
|
157
155
|
}, [state, tooltipArrowSide]);
|
|
158
156
|
var renderChartsItems = React.useMemo(function () {
|
|
159
157
|
if (!state || !charts)
|
|
160
158
|
return null;
|
|
161
159
|
return state.series.map(function (item) {
|
|
162
160
|
var chart = item.chart, properties = item.properties, radius = item.radius, labelList = item.labelList;
|
|
163
|
-
var show = charts[""
|
|
161
|
+
var show = charts["".concat(properties.dataKey)];
|
|
164
162
|
switch (chart) {
|
|
165
163
|
case 'bar':
|
|
166
|
-
return show && !(item === null || item === void 0 ? void 0 : item.hide) ? (React__default
|
|
167
|
-
labelList && (React__default
|
|
164
|
+
return show && !(item === null || item === void 0 ? void 0 : item.hide) ? (React__default.default.createElement(recharts.Bar, tslib_es6.__assign({ key: "".concat(state.id, "-").concat(properties.dataKey) }, properties, { shape: React__default.default.createElement(components_RectBar.RectBar, { radius: radius }) }),
|
|
165
|
+
labelList && (React__default.default.createElement(recharts.LabelList, tslib_es6.__assign({ dataKey: properties.dataKey.toString() }, labelList, { content: React__default.default.createElement(components_CustomizedLabel.CustomizedLabel, { radius: radius }) }))),
|
|
168
166
|
data.map(function (_, index) {
|
|
169
|
-
var key = state.id
|
|
170
|
-
return (React__default
|
|
167
|
+
var key = "".concat(state.id, "-").concat(properties.dataKey, "-").concat(index);
|
|
168
|
+
return (React__default.default.createElement(recharts.Cell, { key: key, className: cn__default.default(styles__default.default.bar, typeof activeDotsState.active === 'number' &&
|
|
171
169
|
activeDotsState.active !== index
|
|
172
|
-
? styles__default
|
|
170
|
+
? styles__default.default.unfocused
|
|
173
171
|
: '') }));
|
|
174
172
|
}))) : null;
|
|
175
173
|
case 'area':
|
|
176
174
|
case 'line':
|
|
177
|
-
return show && !(item === null || item === void 0 ? void 0 : item.hide) ? (React__default
|
|
175
|
+
return show && !(item === null || item === void 0 ? void 0 : item.hide) ? (React__default.default.createElement(recharts.Line, tslib_es6.__assign({ key: "".concat(state.id, "-").concat(properties.dataKey) }, properties, { dot: properties.dot && properties.dotSettings
|
|
178
176
|
? CustomizedHOC(components_Dot_index.Dot, {
|
|
179
177
|
activeDot: activeDotsState.active,
|
|
180
178
|
dotSettings: properties.dotSettings,
|
|
@@ -184,8 +182,8 @@ var Chart = function (props) {
|
|
|
184
182
|
})
|
|
185
183
|
: false, activeDot: false }))) : null;
|
|
186
184
|
case 'gradient':
|
|
187
|
-
return show && !(item === null || item === void 0 ? void 0 : item.hide) ? (React__default
|
|
188
|
-
? "url(#"
|
|
185
|
+
return show && !(item === null || item === void 0 ? void 0 : item.hide) ? (React__default.default.createElement(recharts.Area, tslib_es6.__assign({}, item.properties, { key: "".concat(state.id, "-").concat(item.properties.dataKey), dataKey: "".concat(item.properties.dataKey), stroke: 'transparent', fill: item.gradient.gid
|
|
186
|
+
? "url(#".concat(state.id, "-").concat(item.gradient.gid, ")")
|
|
189
187
|
: item.properties.fill, dot: false, activeDot: false }))) : null;
|
|
190
188
|
default:
|
|
191
189
|
return null;
|
|
@@ -266,10 +264,10 @@ var Chart = function (props) {
|
|
|
266
264
|
};
|
|
267
265
|
if (!data || !charts || !state)
|
|
268
266
|
return null;
|
|
269
|
-
return (React__default
|
|
270
|
-
React__default
|
|
271
|
-
React__default
|
|
272
|
-
React__default
|
|
267
|
+
return (React__default.default.createElement("div", { className: styles__default.default.coreChart, ref: svgRef, id: (state === null || state === void 0 ? void 0 : state.id) || '', style: { width: '100%', height: '100%' } },
|
|
268
|
+
React__default.default.createElement(recharts.ResponsiveContainer, { debounce: ((_a = state === null || state === void 0 ? void 0 : state.responsiveContainer) === null || _a === void 0 ? void 0 : _a.debounce) ? state.responsiveContainer.debounce : 0, width: '100%' },
|
|
269
|
+
React__default.default.createElement(recharts.ComposedChart, tslib_es6.__assign({}, state === null || state === void 0 ? void 0 : state.composeChart, { onMouseMove: mouseMove, onMouseLeave: mouseLeave, data: data }),
|
|
270
|
+
React__default.default.createElement("defs", null, renderGradient),
|
|
273
271
|
state.cartesianGrid && renderCartesianGrid,
|
|
274
272
|
state.xAxis && renderXAxis,
|
|
275
273
|
state.yAxis && renderYAxis,
|
|
@@ -1,20 +1,18 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
3
|
var React = require('react');
|
|
6
|
-
require('../hooks/usePathBar/utils/getRadius.js');
|
|
7
4
|
var hooks_usePathBar_index = require('../hooks/usePathBar/index.js');
|
|
5
|
+
require('../hooks/usePathBar/utils/getRadius.js');
|
|
8
6
|
|
|
9
|
-
function
|
|
7
|
+
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
10
8
|
|
|
11
|
-
var React__default = /*#__PURE__*/
|
|
9
|
+
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
12
10
|
|
|
13
11
|
var CustomizedLabel = function (_a) {
|
|
14
12
|
var x = _a.x, y = _a.y, value = _a.value, offset = _a.offset, radius = _a.radius, height = _a.height, width = _a.width, formatter = _a.formatter;
|
|
15
13
|
var initHeight = hooks_usePathBar_index.usePathBar({ radius: radius, height: height })[0];
|
|
16
|
-
return (React__default
|
|
17
|
-
React__default
|
|
14
|
+
return (React__default.default.createElement("text", { x: x + width / 2, y: y + height - (initHeight + offset), width: width, height: initHeight, textAnchor: 'middle' },
|
|
15
|
+
React__default.default.createElement("tspan", { x: x + width / 2 }, formatter ? formatter(value) : value)));
|
|
18
16
|
};
|
|
19
17
|
|
|
20
18
|
exports.CustomizedLabel = CustomizedLabel;
|
|
@@ -1,19 +1,17 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
3
|
var React = require('react');
|
|
6
4
|
var cn = require('classnames');
|
|
7
5
|
var icons_Point = require('../../icons/Point.js');
|
|
8
6
|
var styles = require('./index.module.css');
|
|
9
7
|
|
|
10
|
-
function
|
|
8
|
+
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
11
9
|
|
|
12
|
-
var React__default = /*#__PURE__*/
|
|
13
|
-
var cn__default = /*#__PURE__*/
|
|
14
|
-
var styles__default = /*#__PURE__*/
|
|
10
|
+
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
11
|
+
var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
|
|
12
|
+
var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
|
|
15
13
|
|
|
16
|
-
var Dot = React__default
|
|
14
|
+
var Dot = React__default.default.forwardRef(function (_a, ref) {
|
|
17
15
|
var cx = _a.cx, cy = _a.cy, index = _a.index, activeDot = _a.activeDot, dataKey = _a.dataKey, dotSettings = _a.dotSettings, value = _a.value, stroke = _a.stroke;
|
|
18
16
|
var _b = React.useState(0), windowWidth = _b[0], setWindowWidth = _b[1];
|
|
19
17
|
var _c = React.useState(0), height = _c[0], setHeight = _c[1];
|
|
@@ -43,12 +41,12 @@ var Dot = React__default['default'].forwardRef(function (_a, ref) {
|
|
|
43
41
|
}, [activeDot, index, option]);
|
|
44
42
|
if (!value)
|
|
45
43
|
return null;
|
|
46
|
-
return (React__default
|
|
47
|
-
React__default
|
|
48
|
-
React__default
|
|
49
|
-
? styles__default
|
|
44
|
+
return (React__default.default.createElement("g", { ref: ref, className: cn__default.default(styles__default.default.dot), transform: "translate(".concat(cx - width / 2, ", ").concat(cy - height / 2, ")") },
|
|
45
|
+
React__default.default.createElement("g", { className: cn__default.default(styles__default.default.dotWrap), transform: "scale(".concat(activeDot === index ? (option === null || option === void 0 ? void 0 : option.scale) || 0 : (option === null || option === void 0 ? void 0 : option.initScale) || 0, ")") },
|
|
46
|
+
React__default.default.createElement("svg", { className: cn__default.default(styles__default.default.dotItem, activeDot === index ? styles__default.default.dotActive : '', typeof activeDot === 'number' && activeDot !== index
|
|
47
|
+
? styles__default.default.dotUnfocused
|
|
50
48
|
: ''), "data-id": index, "data-name": dataKey, width: (option === null || option === void 0 ? void 0 : option.width) || 0, height: (option === null || option === void 0 ? void 0 : option.height) || 0 },
|
|
51
|
-
React__default
|
|
49
|
+
React__default.default.createElement(icons_Point.PointIcon, { fill: stroke })))));
|
|
52
50
|
});
|
|
53
51
|
|
|
54
52
|
exports.Dot = Dot;
|
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
3
|
var React = require('react');
|
|
6
4
|
var cn = require('classnames');
|
|
7
5
|
var coreComponentsTypography = require('@alfalab/core-components-typography/cssm');
|
|
@@ -11,11 +9,11 @@ var icons_FilledCircle = require('../../icons/FilledCircle.js');
|
|
|
11
9
|
var icons_StrokeCircle = require('../../icons/StrokeCircle.js');
|
|
12
10
|
var styles = require('./index.module.css');
|
|
13
11
|
|
|
14
|
-
function
|
|
12
|
+
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
15
13
|
|
|
16
|
-
var React__default = /*#__PURE__*/
|
|
17
|
-
var cn__default = /*#__PURE__*/
|
|
18
|
-
var styles__default = /*#__PURE__*/
|
|
14
|
+
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
15
|
+
var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
|
|
16
|
+
var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
|
|
19
17
|
|
|
20
18
|
var icons = {
|
|
21
19
|
circleLine: icons_CircleLine.CircleLineIcon,
|
|
@@ -23,25 +21,25 @@ var icons = {
|
|
|
23
21
|
strokeCircle: icons_StrokeCircle.StrokeCircleIcon,
|
|
24
22
|
circle: icons_Circle.CircleIcon,
|
|
25
23
|
};
|
|
26
|
-
var Legends = React__default
|
|
24
|
+
var Legends = React__default.default.forwardRef(function (_a, ref) {
|
|
27
25
|
var legend = _a.legend, series = _a.series, id = _a.id, charts = _a.charts, toggleChart = _a.toggleChart;
|
|
28
26
|
var style = {
|
|
29
27
|
textAlign: legend.align || 'center',
|
|
30
|
-
transform: "translateY("
|
|
31
|
-
(legend.verticalAlign === 'top' ? -1 : 1)
|
|
28
|
+
transform: "translateY(".concat(((legend === null || legend === void 0 ? void 0 : legend.marginTop) ? legend.marginTop : 0) *
|
|
29
|
+
(legend.verticalAlign === 'top' ? -1 : 1), "px)"),
|
|
32
30
|
};
|
|
33
|
-
return (React__default
|
|
31
|
+
return (React__default.default.createElement("ul", { ref: ref, className: cn__default.default(styles__default.default.legendWrap), style: style }, series.map(function (item) {
|
|
34
32
|
var _a, _b;
|
|
35
33
|
if (item.hideLegend || item.hide)
|
|
36
34
|
return null;
|
|
37
35
|
var Icon = icons[item.icon] || icons_Circle.CircleIcon;
|
|
38
|
-
return (React__default
|
|
39
|
-
React__default
|
|
40
|
-
Icon ? (React__default
|
|
41
|
-
React__default
|
|
36
|
+
return (React__default.default.createElement("li", { role: 'presentation', key: "".concat(id, "-").concat(item.properties.dataKey), className: cn__default.default(styles__default.default.legendItem, charts["".concat(item.properties.dataKey)] ? '' : styles__default.default.legendUnactive), onClick: function () { return toggleChart(item); } },
|
|
37
|
+
React__default.default.createElement("div", { className: cn__default.default(styles__default.default.legendContent) },
|
|
38
|
+
Icon ? (React__default.default.createElement("i", { className: cn__default.default(styles__default.default.legendIcon) },
|
|
39
|
+
React__default.default.createElement(Icon, { fill: ((_a = item.properties) === null || _a === void 0 ? void 0 : _a.fill) ||
|
|
42
40
|
((_b = item.properties) === null || _b === void 0 ? void 0 : _b.stroke) ||
|
|
43
41
|
'', height: legend.iconHeight || 16 }))) : null,
|
|
44
|
-
React__default
|
|
42
|
+
React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', tag: 'span', className: cn__default.default(styles__default.default.legendValue) }, item.properties.name))));
|
|
45
43
|
})));
|
|
46
44
|
});
|
|
47
45
|
|
|
@@ -1,16 +1,14 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
3
|
var React = require('react');
|
|
6
4
|
|
|
7
|
-
function
|
|
5
|
+
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
8
6
|
|
|
9
|
-
var React__default = /*#__PURE__*/
|
|
7
|
+
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
10
8
|
|
|
11
9
|
var LinearGradient = function (_a) {
|
|
12
10
|
var id = _a.id, gid = _a.gid, points = _a.points;
|
|
13
|
-
return (React__default
|
|
11
|
+
return (React__default.default.createElement("linearGradient", { key: "".concat(id, "-").concat(gid), id: "".concat(id, "-").concat(gid), x1: '0', y1: '0', x2: '0', y2: '1' }, points.map(function (point, index) { return (React__default.default.createElement("stop", { key: "".concat(id).concat(gid, "-").concat(index.toString()), offset: "".concat(point.offset, "%"), stopColor: point.stopColor, stopOpacity: point.stopOpacity })); })));
|
|
14
12
|
};
|
|
15
13
|
|
|
16
14
|
exports.LinearGradient = LinearGradient;
|
|
@@ -1,18 +1,16 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
3
|
var React = require('react');
|
|
6
|
-
require('../hooks/usePathBar/utils/getRadius.js');
|
|
7
4
|
var hooks_usePathBar_index = require('../hooks/usePathBar/index.js');
|
|
5
|
+
require('../hooks/usePathBar/utils/getRadius.js');
|
|
8
6
|
|
|
9
|
-
function
|
|
7
|
+
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
10
8
|
|
|
11
|
-
var React__default = /*#__PURE__*/
|
|
9
|
+
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
12
10
|
|
|
13
11
|
// eslint-disable-next-line complexity
|
|
14
12
|
var getPath = function (x, width, height, initHeight, topRadius, bottomRadius, initY) {
|
|
15
|
-
return "\n M"
|
|
13
|
+
return "\n M".concat(x + ((height !== 0 && bottomRadius) || 0), " ").concat(initY + initHeight || 0, "\n Q").concat(x, " ").concat(initY + initHeight, " ").concat(x, " ").concat(initY + initHeight - ((height !== 0 && bottomRadius) || 0), "\n L").concat(x, " ").concat(initY + ((height !== 0 && topRadius) || 0), "\n Q").concat(x, " ").concat(initY, " ").concat(x + ((height !== 0 && topRadius) || 0), " ").concat(initY, "\n L").concat(x + width - ((height !== 0 && topRadius) || 0), " ").concat(initY, "\n Q").concat(x + width, " ").concat(initY, " ").concat(x + width, " ").concat(initY + (topRadius || 0), "\n L").concat(x + width, " ").concat(initY + initHeight - ((height !== 0 && bottomRadius) || 0), "\n Q").concat(x + width, " ").concat(initY + initHeight, " ").concat(x + width - ((height !== 0 && bottomRadius) || 0), " ").concat(initY + initHeight, "\n Z\n ");
|
|
16
14
|
};
|
|
17
15
|
var RectBar = function (_a) {
|
|
18
16
|
var fill = _a.fill, x = _a.x, y = _a.y, width = _a.width, height = _a.height, radius = _a.radius, background = _a.background;
|
|
@@ -22,7 +20,7 @@ var RectBar = function (_a) {
|
|
|
22
20
|
background: background,
|
|
23
21
|
y: y,
|
|
24
22
|
}), initHeight = _b[0], topRadius = _b[1], bottomRadius = _b[2], initY = _b[3];
|
|
25
|
-
return React.useMemo(function () { return (React__default
|
|
23
|
+
return React.useMemo(function () { return (React__default.default.createElement("path", { d: getPath(x, width, height, initHeight, topRadius, bottomRadius, initY), stroke: 'none', fill: fill })); }, [x, width, height, initHeight, topRadius, bottomRadius, initY, fill]);
|
|
26
24
|
};
|
|
27
25
|
|
|
28
26
|
exports.RectBar = RectBar;
|
|
@@ -1,16 +1,14 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
3
|
var React = require('react');
|
|
6
4
|
var cn = require('classnames');
|
|
7
5
|
var styles = require('./index.module.css');
|
|
8
6
|
|
|
9
|
-
function
|
|
7
|
+
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
10
8
|
|
|
11
|
-
var React__default = /*#__PURE__*/
|
|
12
|
-
var cn__default = /*#__PURE__*/
|
|
13
|
-
var styles__default = /*#__PURE__*/
|
|
9
|
+
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
10
|
+
var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
|
|
11
|
+
var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
|
|
14
12
|
|
|
15
13
|
var Tick = function (_a) {
|
|
16
14
|
var y = _a.y, payload = _a.payload, tickFormatter = _a.tickFormatter, xAxis = _a.xAxis;
|
|
@@ -19,9 +17,9 @@ var Tick = function (_a) {
|
|
|
19
17
|
(xAxis.tickMargin > 0 ? xAxis.tickMargin - radius / 2 : xAxis.tickMargin === 0)
|
|
20
18
|
? (radius / 2) * -1
|
|
21
19
|
: null;
|
|
22
|
-
return (React__default
|
|
23
|
-
React__default
|
|
24
|
-
React__default
|
|
20
|
+
return (React__default.default.createElement("g", { className: cn__default.default(styles__default.default.tick), opacity: '1', textAnchor: 'middle', transform: "translate(".concat(payload.coordinate, ", ").concat(y - (typeof marginTick === 'number' ? marginTick : 0) - radius * 2, ")") },
|
|
21
|
+
React__default.default.createElement("text", { className: cn__default.default(styles__default.default.tickText), y: '30' }, tickFormatter ? tickFormatter(payload.value) : payload.value),
|
|
22
|
+
React__default.default.createElement("circle", { r: radius, className: cn__default.default(styles__default.default.circle) })));
|
|
25
23
|
};
|
|
26
24
|
|
|
27
25
|
exports.Tick = Tick;
|
|
@@ -1,36 +1,34 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
3
|
var React = require('react');
|
|
6
4
|
var cn = require('classnames');
|
|
7
5
|
var coreComponentsTypography = require('@alfalab/core-components-typography/cssm');
|
|
8
6
|
var styles = require('./index.module.css');
|
|
9
7
|
|
|
10
|
-
function
|
|
8
|
+
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
11
9
|
|
|
12
|
-
var React__default = /*#__PURE__*/
|
|
13
|
-
var cn__default = /*#__PURE__*/
|
|
14
|
-
var styles__default = /*#__PURE__*/
|
|
10
|
+
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
11
|
+
var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
|
|
12
|
+
var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
|
|
15
13
|
|
|
16
14
|
var TooltipContent = function (_a) {
|
|
17
15
|
var payload = _a.payload, separator = _a.separator, label = _a.label, tooltipArrowSide = _a.tooltipArrowSide, arrow = _a.arrow, series = _a.series, labelFormatter = _a.labelFormatter, labelStyle = _a.labelStyle;
|
|
18
16
|
if (!label || payload.length === 0)
|
|
19
17
|
return null;
|
|
20
|
-
return (React__default
|
|
21
|
-
arrow && (React__default
|
|
22
|
-
React__default
|
|
23
|
-
React__default
|
|
24
|
-
React__default
|
|
18
|
+
return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.tooltip) },
|
|
19
|
+
arrow && (React__default.default.createElement("span", { className: cn__default.default(styles__default.default.tooltipArrow, tooltipArrowSide ? '' : styles__default.default.tooltipArrowRight) })),
|
|
20
|
+
React__default.default.createElement("ul", { className: cn__default.default(styles__default.default.tooltipList) },
|
|
21
|
+
React__default.default.createElement("li", { className: cn__default.default(styles__default.default.tooltipItem), style: labelStyle },
|
|
22
|
+
React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', tag: 'span', weight: 'medium', className: cn__default.default(styles__default.default.tooltipLabel) }, labelFormatter ? labelFormatter(label) : label)),
|
|
25
23
|
payload.map(function (entry) {
|
|
26
24
|
var data = series.find(function (d) { return d.properties.dataKey === entry.dataKey; });
|
|
27
25
|
if ((data === null || data === void 0 ? void 0 : data.hideTooltip) || (data === null || data === void 0 ? void 0 : data.hide))
|
|
28
26
|
return null;
|
|
29
|
-
return (React__default
|
|
30
|
-
React__default
|
|
27
|
+
return (React__default.default.createElement("li", { className: cn__default.default(styles__default.default.tooltipItem), key: entry.dataKey, style: { color: entry.color } },
|
|
28
|
+
React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'primary-medium', tag: 'span', weight: 'medium', className: cn__default.default(styles__default.default.tooltipValue) },
|
|
31
29
|
(entry === null || entry === void 0 ? void 0 : entry.formatter) ? entry.formatter(entry.value) : entry.value,
|
|
32
30
|
separator || ' '),
|
|
33
|
-
React__default
|
|
31
|
+
React__default.default.createElement(coreComponentsTypography.Typography.Text, { view: 'secondary-large', tag: 'span', className: cn__default.default(styles__default.default.tooltipName) }, "".concat(entry.name))));
|
|
34
32
|
}))));
|
|
35
33
|
};
|
|
36
34
|
|
|
@@ -1,8 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var tslib_es6 = require('../../tslib.es6-0de342ae.js');
|
|
3
|
+
var tslib_es6 = require('../../tslib.es6-19b064c1.js');
|
|
6
4
|
var React = require('react');
|
|
7
5
|
var hooks_useSettings_utils_setComposedChartsMargin = require('./utils/setComposedChartsMargin.js');
|
|
8
6
|
var hooks_useSettings_utils_setDatas = require('./utils/setDatas.js');
|
|
@@ -1,8 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var tslib_es6 = require('../../../tslib.es6-0de342ae.js');
|
|
3
|
+
var tslib_es6 = require('../../../tslib.es6-19b064c1.js');
|
|
6
4
|
|
|
7
5
|
var setDatas = function (series, labels) {
|
|
8
6
|
var initData = [];
|
|
@@ -18,9 +16,9 @@ var setDatas = function (series, labels) {
|
|
|
18
16
|
var obj = {
|
|
19
17
|
label: label,
|
|
20
18
|
};
|
|
21
|
-
obj[""
|
|
22
|
-
if (!chartsNames[""
|
|
23
|
-
chartsNames[""
|
|
19
|
+
obj["".concat(dataKey)] = item.value;
|
|
20
|
+
if (!chartsNames["".concat(dataKey)])
|
|
21
|
+
chartsNames["".concat(dataKey)] = true;
|
|
24
22
|
var index = initData
|
|
25
23
|
.map(function (dataItem) { return dataItem.label; })
|
|
26
24
|
.indexOf(label);
|