@semcore/d3-chart 1.0.0-8 → 1.2.0
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/CHANGELOG.md +62 -0
- package/lib/cjs/Area.js +71 -49
- package/lib/cjs/Area.js.map +1 -1
- package/lib/cjs/Axis.js +148 -142
- package/lib/cjs/Axis.js.map +1 -1
- package/lib/cjs/Bar.js +101 -54
- package/lib/cjs/Bar.js.map +1 -1
- package/lib/cjs/ClipPath.js +110 -0
- package/lib/cjs/ClipPath.js.map +1 -0
- package/lib/cjs/Donut.js +169 -68
- package/lib/cjs/Donut.js.map +1 -1
- package/lib/cjs/Dots.js +55 -21
- package/lib/cjs/Dots.js.map +1 -1
- package/lib/cjs/GroupBar.js +7 -6
- package/lib/cjs/GroupBar.js.map +1 -1
- package/lib/cjs/HorizontalBar.js +72 -45
- package/lib/cjs/HorizontalBar.js.map +1 -1
- package/lib/cjs/Hover.js +46 -47
- package/lib/cjs/Hover.js.map +1 -1
- package/lib/cjs/Line.js +63 -41
- package/lib/cjs/Line.js.map +1 -1
- package/lib/cjs/Plot.js +16 -29
- package/lib/cjs/Plot.js.map +1 -1
- package/lib/cjs/ResponsiveContainer.js +13 -9
- package/lib/cjs/ResponsiveContainer.js.map +1 -1
- package/lib/cjs/StackBar.js +6 -6
- package/lib/cjs/StackBar.js.map +1 -1
- package/lib/cjs/StackedArea.js +8 -9
- package/lib/cjs/StackedArea.js.map +1 -1
- package/lib/cjs/Tooltip.js +49 -75
- package/lib/cjs/Tooltip.js.map +1 -1
- package/lib/cjs/Venn.js +235 -0
- package/lib/cjs/Venn.js.map +1 -0
- package/lib/cjs/index.js +8 -0
- package/lib/cjs/index.js.map +1 -1
- package/lib/cjs/style/area.shadow.css +11 -10
- package/lib/cjs/style/bar.shadow.css +4 -0
- package/lib/cjs/style/donut.shadow.css +1 -0
- package/lib/cjs/style/dot.shadow.css +19 -0
- package/lib/cjs/style/line.shadow.css +4 -15
- package/lib/cjs/style/tooltip.shadow.css +1 -0
- package/lib/cjs/style/venn.shadow.css +23 -0
- package/lib/cjs/utils.js +8 -1
- package/lib/cjs/utils.js.map +1 -1
- package/lib/es6/Area.js +72 -50
- package/lib/es6/Area.js.map +1 -1
- package/lib/es6/Axis.js +149 -143
- package/lib/es6/Axis.js.map +1 -1
- package/lib/es6/Bar.js +100 -54
- package/lib/es6/Bar.js.map +1 -1
- package/lib/es6/ClipPath.js +91 -0
- package/lib/es6/ClipPath.js.map +1 -0
- package/lib/es6/Donut.js +167 -67
- package/lib/es6/Donut.js.map +1 -1
- package/lib/es6/Dots.js +51 -20
- package/lib/es6/Dots.js.map +1 -1
- package/lib/es6/GroupBar.js +7 -6
- package/lib/es6/GroupBar.js.map +1 -1
- package/lib/es6/HorizontalBar.js +72 -45
- package/lib/es6/HorizontalBar.js.map +1 -1
- package/lib/es6/Hover.js +47 -48
- package/lib/es6/Hover.js.map +1 -1
- package/lib/es6/Line.js +65 -43
- package/lib/es6/Line.js.map +1 -1
- package/lib/es6/Plot.js +17 -29
- package/lib/es6/Plot.js.map +1 -1
- package/lib/es6/ResponsiveContainer.js +13 -7
- package/lib/es6/ResponsiveContainer.js.map +1 -1
- package/lib/es6/StackBar.js +6 -6
- package/lib/es6/StackBar.js.map +1 -1
- package/lib/es6/StackedArea.js +8 -9
- package/lib/es6/StackedArea.js.map +1 -1
- package/lib/es6/Tooltip.js +52 -76
- package/lib/es6/Tooltip.js.map +1 -1
- package/lib/es6/Venn.js +217 -0
- package/lib/es6/Venn.js.map +1 -0
- package/lib/es6/index.js +1 -0
- package/lib/es6/index.js.map +1 -1
- package/lib/es6/style/area.shadow.css +11 -10
- package/lib/es6/style/bar.shadow.css +4 -0
- package/lib/es6/style/donut.shadow.css +1 -0
- package/lib/es6/style/dot.shadow.css +19 -0
- package/lib/es6/style/line.shadow.css +4 -15
- package/lib/es6/style/tooltip.shadow.css +1 -0
- package/lib/es6/style/venn.shadow.css +23 -0
- package/lib/es6/utils.js +6 -1
- package/lib/es6/utils.js.map +1 -1
- package/lib/types/Area.d.ts +7 -8
- package/lib/types/Axis.d.ts +6 -6
- package/lib/types/Bar.d.ts +7 -3
- package/lib/types/ClipPath.d.ts +26 -0
- package/lib/types/Donut.d.ts +12 -2
- package/lib/types/GroupBar.d.ts +2 -2
- package/lib/types/HorizontalBar.d.ts +7 -3
- package/lib/types/Hover.d.ts +2 -2
- package/lib/types/Line.d.ts +9 -4
- package/{src/types/Plot.ts → lib/types/Plot.d.ts} +2 -2
- package/lib/types/ResponsiveContainer.d.ts +1 -1
- package/lib/types/StackBar.d.ts +3 -11
- package/lib/types/StackedArea.d.ts +7 -6
- package/lib/types/Tooltip.d.ts +4 -4
- package/lib/types/Venn.d.ts +45 -0
- package/lib/types/context.d.ts +1 -1
- package/lib/types/index.d.ts +6 -0
- package/package.json +10 -5
- package/src/Area.js +43 -14
- package/src/Axis.js +24 -22
- package/src/Bar.js +69 -24
- package/src/ClipPath.js +36 -0
- package/src/Donut.js +84 -12
- package/src/Dots.js +36 -20
- package/src/GroupBar.js +1 -0
- package/src/HorizontalBar.js +49 -22
- package/src/Hover.js +3 -3
- package/src/Line.js +41 -13
- package/src/Plot.js +3 -7
- package/src/ResponsiveContainer.js +3 -3
- package/src/StackBar.js +1 -1
- package/src/StackedArea.js +3 -2
- package/src/Tooltip.js +11 -12
- package/src/Venn.js +112 -0
- package/src/index.js +1 -0
- package/src/style/area.shadow.css +11 -10
- package/src/style/bar.shadow.css +4 -0
- package/src/style/donut.shadow.css +1 -0
- package/src/style/dot.shadow.css +19 -0
- package/src/style/line.shadow.css +4 -15
- package/src/style/tooltip.shadow.css +1 -0
- package/src/style/venn.shadow.css +23 -0
- package/src/types/Area.d.ts +7 -8
- package/src/types/Axis.d.ts +6 -6
- package/src/types/Bar.d.ts +7 -3
- package/src/types/ClipPath.d.ts +26 -0
- package/src/types/Donut.d.ts +12 -2
- package/src/types/GroupBar.d.ts +2 -2
- package/src/types/HorizontalBar.d.ts +7 -3
- package/src/types/Hover.d.ts +2 -2
- package/src/types/Line.d.ts +9 -4
- package/src/types/Plot.d.ts +16 -0
- package/src/types/ResponsiveContainer.d.ts +1 -1
- package/src/types/StackBar.d.ts +3 -11
- package/src/types/StackedArea.d.ts +7 -6
- package/src/types/Tooltip.d.ts +4 -4
- package/src/types/Venn.d.ts +45 -0
- package/src/types/context.d.ts +1 -1
- package/src/types/index.d.ts +6 -0
- package/src/utils.js +7 -1
- package/lib/cjs/style/chart.shadow.css +0 -4
- package/lib/cjs/types/Plot.js +0 -2
- package/lib/cjs/types/Plot.js.map +0 -1
- package/lib/es6/style/chart.shadow.css +0 -4
- package/lib/es6/types/Plot.js +0 -2
- package/lib/es6/types/Plot.js.map +0 -1
- package/src/style/chart.shadow.css +0 -4
package/lib/cjs/Donut.js
CHANGED
|
@@ -23,14 +23,12 @@ var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/ge
|
|
|
23
23
|
|
|
24
24
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
25
25
|
|
|
26
|
-
var
|
|
26
|
+
var _core = require("@semcore/core");
|
|
27
27
|
|
|
28
28
|
var _react = _interopRequireDefault(require("react"));
|
|
29
29
|
|
|
30
30
|
var _d3Shape = require("d3-shape");
|
|
31
31
|
|
|
32
|
-
var _core = require("@semcore/core");
|
|
33
|
-
|
|
34
32
|
var _canUseDOM = _interopRequireDefault(require("@semcore/utils/lib/canUseDOM"));
|
|
35
33
|
|
|
36
34
|
var _getOriginChildren = _interopRequireDefault(require("@semcore/utils/lib/getOriginChildren"));
|
|
@@ -39,27 +37,75 @@ var _utils = require("./utils");
|
|
|
39
37
|
|
|
40
38
|
var _createElement = _interopRequireDefault(require("./createElement"));
|
|
41
39
|
|
|
40
|
+
var _uniqueID = _interopRequireDefault(require("@semcore/utils/lib/uniqueID"));
|
|
41
|
+
|
|
42
|
+
var _d3Interpolate = require("d3-interpolate");
|
|
43
|
+
|
|
44
|
+
var _d3Transition = require("d3-transition");
|
|
45
|
+
|
|
42
46
|
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
|
|
43
47
|
|
|
44
48
|
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
45
49
|
|
|
46
50
|
/*__reshadow-styles__:"./style/donut.shadow.css"*/
|
|
47
|
-
var
|
|
51
|
+
var style = (
|
|
48
52
|
/*__reshadow_css_start__*/
|
|
49
|
-
|
|
53
|
+
_core.sstyled.insert(
|
|
50
54
|
/*__inner_css_start__*/
|
|
51
|
-
".
|
|
55
|
+
".___SPie_1ar8h_gg_{stroke:#fff;fill:var(--color_3mch97)}.___SLabel_1ar8h_gg_{text-anchor:middle;vertical-anchor:middle}"
|
|
52
56
|
/*__inner_css_end__*/
|
|
53
|
-
, "
|
|
57
|
+
, "3mch97_gg_")
|
|
54
58
|
/*__reshadow_css_end__*/
|
|
55
59
|
, {
|
|
56
|
-
"__SPie": "
|
|
57
|
-
"
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
60
|
+
"__SPie": "___SPie_1ar8h_gg_",
|
|
61
|
+
"--color": "--color_3mch97",
|
|
62
|
+
"__SLabel": "___SLabel_1ar8h_gg_"
|
|
63
|
+
});
|
|
61
64
|
var DEFAULT_INSTANCE = Symbol('DEFAULT_INSTANCE');
|
|
62
65
|
|
|
66
|
+
function animationInitialPie(_ref3) {
|
|
67
|
+
var halfsize = _ref3.halfsize,
|
|
68
|
+
d3Arc = _ref3.d3Arc,
|
|
69
|
+
arcs = _ref3.arcs;
|
|
70
|
+
return function (_, ind) {
|
|
71
|
+
var d = arcs[ind];
|
|
72
|
+
if (!d) return function () {
|
|
73
|
+
return '';
|
|
74
|
+
};
|
|
75
|
+
var iStart = (0, _d3Interpolate.interpolate)(halfsize ? -Math.PI / 2 : 0, d.startAngle);
|
|
76
|
+
var iEnd = (0, _d3Interpolate.interpolate)(halfsize ? -Math.PI / 2 : 0, d.endAngle);
|
|
77
|
+
return function (t) {
|
|
78
|
+
d.startAngle = iStart(t);
|
|
79
|
+
d.endAngle = iEnd(t);
|
|
80
|
+
return d3Arc(d);
|
|
81
|
+
};
|
|
82
|
+
};
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
function animationUpdatePie(_ref4) {
|
|
86
|
+
var halfsize = _ref4.halfsize,
|
|
87
|
+
arcs = _ref4.arcs,
|
|
88
|
+
d3Arc = _ref4.d3Arc;
|
|
89
|
+
return function (_, ind) {
|
|
90
|
+
var d = arcs[ind];
|
|
91
|
+
|
|
92
|
+
if (this._current) {
|
|
93
|
+
var i = (0, _d3Interpolate.interpolate)(this._current, d);
|
|
94
|
+
this._current = i(0);
|
|
95
|
+
return function (t) {
|
|
96
|
+
return d3Arc(i(t));
|
|
97
|
+
};
|
|
98
|
+
} else {
|
|
99
|
+
this._current = d;
|
|
100
|
+
return animationInitialPie({
|
|
101
|
+
halfsize: halfsize,
|
|
102
|
+
arcs: arcs,
|
|
103
|
+
d3Arc: d3Arc
|
|
104
|
+
})(_, ind);
|
|
105
|
+
}
|
|
106
|
+
};
|
|
107
|
+
}
|
|
108
|
+
|
|
63
109
|
var DonutRoot = /*#__PURE__*/function (_Component) {
|
|
64
110
|
(0, _inherits2["default"])(DonutRoot, _Component);
|
|
65
111
|
|
|
@@ -77,9 +123,9 @@ var DonutRoot = /*#__PURE__*/function (_Component) {
|
|
|
77
123
|
_this = _super.call.apply(_super, [this].concat(args));
|
|
78
124
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "virtualElement", (0, _canUseDOM["default"])() ? document.createElement('div') : {});
|
|
79
125
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "bindHandlerTooltip", function (visible, props) {
|
|
80
|
-
return function (
|
|
81
|
-
var x =
|
|
82
|
-
y =
|
|
126
|
+
return function (_ref5) {
|
|
127
|
+
var x = _ref5.clientX,
|
|
128
|
+
y = _ref5.clientY;
|
|
83
129
|
var eventEmitter = _this.asProps.eventEmitter;
|
|
84
130
|
_this.virtualElement.getBoundingClientRect = _this.generateGetBoundingClientRect(x, y);
|
|
85
131
|
_this.virtualElement[_utils.CONSTANT.VIRTUAL_ELEMENT] = true;
|
|
@@ -90,6 +136,14 @@ var DonutRoot = /*#__PURE__*/function (_Component) {
|
|
|
90
136
|
}
|
|
91
137
|
|
|
92
138
|
(0, _createClass2["default"])(DonutRoot, [{
|
|
139
|
+
key: "id",
|
|
140
|
+
get: function get() {
|
|
141
|
+
var _this$asProps = this.asProps,
|
|
142
|
+
uid = _this$asProps.uid,
|
|
143
|
+
id = _this$asProps.id;
|
|
144
|
+
return id || uid;
|
|
145
|
+
}
|
|
146
|
+
}, {
|
|
93
147
|
key: "generateGetBoundingClientRect",
|
|
94
148
|
value: function generateGetBoundingClientRect() {
|
|
95
149
|
var x = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
|
|
@@ -108,10 +162,10 @@ var DonutRoot = /*#__PURE__*/function (_Component) {
|
|
|
108
162
|
}, {
|
|
109
163
|
key: "getArcs",
|
|
110
164
|
value: function getArcs() {
|
|
111
|
-
var _this$
|
|
112
|
-
Children = _this$
|
|
113
|
-
data = _this$
|
|
114
|
-
d3Pie = _this$
|
|
165
|
+
var _this$asProps2 = this.asProps,
|
|
166
|
+
Children = _this$asProps2.Children,
|
|
167
|
+
data = _this$asProps2.data,
|
|
168
|
+
d3Pie = _this$asProps2.d3Pie;
|
|
115
169
|
var pieData = Object.entries(data);
|
|
116
170
|
|
|
117
171
|
if (d3Pie[DEFAULT_INSTANCE]) {
|
|
@@ -123,22 +177,30 @@ var DonutRoot = /*#__PURE__*/function (_Component) {
|
|
|
123
177
|
return acc;
|
|
124
178
|
}, []);
|
|
125
179
|
|
|
126
|
-
pieData = Object.entries(data).filter(function (
|
|
127
|
-
var
|
|
128
|
-
key =
|
|
180
|
+
pieData = Object.entries(data).filter(function (_ref6) {
|
|
181
|
+
var _ref7 = (0, _slicedToArray2["default"])(_ref6, 1),
|
|
182
|
+
key = _ref7[0];
|
|
129
183
|
|
|
130
184
|
return keys.includes(key);
|
|
131
|
-
}).sort(function (
|
|
132
|
-
var
|
|
133
|
-
a =
|
|
185
|
+
}).sort(function (_ref8, _ref9) {
|
|
186
|
+
var _ref10 = (0, _slicedToArray2["default"])(_ref8, 1),
|
|
187
|
+
a = _ref10[0];
|
|
134
188
|
|
|
135
|
-
var
|
|
136
|
-
b =
|
|
189
|
+
var _ref11 = (0, _slicedToArray2["default"])(_ref9, 1),
|
|
190
|
+
b = _ref11[0];
|
|
137
191
|
|
|
138
192
|
return keys.indexOf(a) > keys.indexOf(b) ? 1 : -1;
|
|
139
193
|
});
|
|
140
194
|
}
|
|
141
195
|
|
|
196
|
+
var minValue = pieData.reduce(function (acc, cur) {
|
|
197
|
+
if (cur[1]) acc += cur[1];
|
|
198
|
+
return acc;
|
|
199
|
+
}, 0) / 100;
|
|
200
|
+
pieData = pieData.map(function (d) {
|
|
201
|
+
if (d[1] && d[1] < minValue) d[1] = minValue;
|
|
202
|
+
return d;
|
|
203
|
+
});
|
|
142
204
|
return d3Pie(pieData);
|
|
143
205
|
}
|
|
144
206
|
}, {
|
|
@@ -147,7 +209,7 @@ var DonutRoot = /*#__PURE__*/function (_Component) {
|
|
|
147
209
|
var d3Arc = this.asProps.d3Arc;
|
|
148
210
|
return {
|
|
149
211
|
data: this.arcs.find(function (arc) {
|
|
150
|
-
return arc.data[0]
|
|
212
|
+
return arc.data[0] === props.dataKey;
|
|
151
213
|
}),
|
|
152
214
|
d3Arc: d3Arc,
|
|
153
215
|
onMouseMove: this.bindHandlerTooltip(true, props),
|
|
@@ -167,12 +229,49 @@ var DonutRoot = /*#__PURE__*/function (_Component) {
|
|
|
167
229
|
color: '#E4ECF1'
|
|
168
230
|
};
|
|
169
231
|
}
|
|
232
|
+
}, {
|
|
233
|
+
key: "componentDidUpdate",
|
|
234
|
+
value: function componentDidUpdate(prevProps) {
|
|
235
|
+
var _this$asProps3 = this.asProps,
|
|
236
|
+
data = _this$asProps3.data,
|
|
237
|
+
duration = _this$asProps3.duration,
|
|
238
|
+
d3Arc = _this$asProps3.d3Arc,
|
|
239
|
+
halfsize = _this$asProps3.halfsize;
|
|
240
|
+
var arcs = this.arcs;
|
|
241
|
+
|
|
242
|
+
if (prevProps.$rootProps.data !== data && duration > 0) {
|
|
243
|
+
(0, _d3Transition.transition)().selection().selectAll("#".concat(this.id, " [data-ui-name=\"Donut.Pie\"]")).transition().duration(duration).attrTween('d', animationUpdatePie({
|
|
244
|
+
d3Arc: d3Arc,
|
|
245
|
+
arcs: arcs,
|
|
246
|
+
halfsize: halfsize
|
|
247
|
+
}));
|
|
248
|
+
}
|
|
249
|
+
}
|
|
250
|
+
}, {
|
|
251
|
+
key: "componentDidMount",
|
|
252
|
+
value: function componentDidMount() {
|
|
253
|
+
var _this$asProps4 = this.asProps,
|
|
254
|
+
duration = _this$asProps4.duration,
|
|
255
|
+
d3Arc = _this$asProps4.d3Arc,
|
|
256
|
+
halfsize = _this$asProps4.halfsize;
|
|
257
|
+
var arcs = this.arcs;
|
|
258
|
+
|
|
259
|
+
if (duration > 0) {
|
|
260
|
+
(0, _d3Transition.transition)().selection().selectAll("#".concat(this.id, " [data-ui-name=\"Donut.Pie\"]")).each(function (_, ind) {
|
|
261
|
+
this._current = arcs[ind];
|
|
262
|
+
}).transition().duration(duration).attrTween('d', animationInitialPie({
|
|
263
|
+
halfsize: halfsize,
|
|
264
|
+
d3Arc: d3Arc,
|
|
265
|
+
arcs: arcs
|
|
266
|
+
}));
|
|
267
|
+
}
|
|
268
|
+
}
|
|
170
269
|
}, {
|
|
171
270
|
key: "render",
|
|
172
271
|
value: function render() {
|
|
173
|
-
var _this$
|
|
174
|
-
halfsize = _this$
|
|
175
|
-
size = _this$
|
|
272
|
+
var _this$asProps5 = this.asProps,
|
|
273
|
+
halfsize = _this$asProps5.halfsize,
|
|
274
|
+
size = _this$asProps5.size;
|
|
176
275
|
|
|
177
276
|
var _size = (0, _slicedToArray2["default"])(size, 2),
|
|
178
277
|
width = _size[0],
|
|
@@ -182,6 +281,7 @@ var DonutRoot = /*#__PURE__*/function (_Component) {
|
|
|
182
281
|
var k = halfsize ? 1 : 2;
|
|
183
282
|
this.arcs = this.getArcs();
|
|
184
283
|
return /*#__PURE__*/_react["default"].createElement(Element, {
|
|
284
|
+
id: this.id,
|
|
185
285
|
render: "g",
|
|
186
286
|
childrenPosition: "inside",
|
|
187
287
|
transform: "translate(".concat(width / 2, ",").concat(height / k, ")")
|
|
@@ -193,12 +293,13 @@ var DonutRoot = /*#__PURE__*/function (_Component) {
|
|
|
193
293
|
|
|
194
294
|
(0, _defineProperty2["default"])(DonutRoot, "displayName", 'Donut');
|
|
195
295
|
(0, _defineProperty2["default"])(DonutRoot, "style", style);
|
|
196
|
-
(0, _defineProperty2["default"])(DonutRoot, "
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
halfsize =
|
|
201
|
-
|
|
296
|
+
(0, _defineProperty2["default"])(DonutRoot, "enhance", [(0, _uniqueID["default"])()]);
|
|
297
|
+
(0, _defineProperty2["default"])(DonutRoot, "defaultProps", function (_ref14) {
|
|
298
|
+
var _ref14$innerRadius = _ref14.innerRadius,
|
|
299
|
+
innerRadius = _ref14$innerRadius === void 0 ? 0 : _ref14$innerRadius,
|
|
300
|
+
_ref14$halfsize = _ref14.halfsize,
|
|
301
|
+
halfsize = _ref14$halfsize === void 0 ? false : _ref14$halfsize,
|
|
302
|
+
size = _ref14.$rootProps.size;
|
|
202
303
|
|
|
203
304
|
var _size2 = (0, _slicedToArray2["default"])(size, 2),
|
|
204
305
|
width = _size2[0],
|
|
@@ -206,9 +307,9 @@ var DonutRoot = /*#__PURE__*/function (_Component) {
|
|
|
206
307
|
|
|
207
308
|
var minORmax = halfsize ? Math.max : Math.min;
|
|
208
309
|
var d3Arc = (0, _d3Shape.arc)().outerRadius(minORmax(width, height) / 2).innerRadius(innerRadius);
|
|
209
|
-
var d3Pie = (0, _d3Shape.pie)().sort(null).value(function (
|
|
210
|
-
var
|
|
211
|
-
value =
|
|
310
|
+
var d3Pie = (0, _d3Shape.pie)().sort(null).value(function (_ref15) {
|
|
311
|
+
var _ref16 = (0, _slicedToArray2["default"])(_ref15, 2),
|
|
312
|
+
value = _ref16[1];
|
|
212
313
|
|
|
213
314
|
return value;
|
|
214
315
|
});
|
|
@@ -220,38 +321,38 @@ var DonutRoot = /*#__PURE__*/function (_Component) {
|
|
|
220
321
|
|
|
221
322
|
return {
|
|
222
323
|
d3Pie: d3Pie,
|
|
223
|
-
d3Arc: d3Arc
|
|
324
|
+
d3Arc: d3Arc,
|
|
325
|
+
duration: 500
|
|
224
326
|
};
|
|
225
327
|
});
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
color =
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
328
|
+
|
|
329
|
+
function Pie(_ref12) {
|
|
330
|
+
var _ref;
|
|
331
|
+
|
|
332
|
+
var SPie = _ref12.Element,
|
|
333
|
+
styles = _ref12.styles,
|
|
334
|
+
d3Arc = _ref12.d3Arc,
|
|
335
|
+
data = _ref12.data,
|
|
336
|
+
_ref12$color = _ref12.color,
|
|
337
|
+
color = _ref12$color === void 0 ? '#50aef4' : _ref12$color;
|
|
338
|
+
return _ref = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SPie, _ref.cn("SPie", {
|
|
339
|
+
"render": "path",
|
|
340
|
+
"color": color,
|
|
341
|
+
"d": d3Arc(data)
|
|
342
|
+
}));
|
|
240
343
|
}
|
|
241
344
|
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
var SLabel =
|
|
246
|
-
styles =
|
|
247
|
-
Children =
|
|
248
|
-
return
|
|
249
|
-
render: "text",
|
|
250
|
-
x: "0",
|
|
251
|
-
y: "0"
|
|
252
|
-
}), /*#__PURE__*/_react["default"].createElement(Children, {
|
|
253
|
-
className: _core.styled.styles["__Children"]
|
|
254
|
-
}))));
|
|
345
|
+
function Label(_ref13) {
|
|
346
|
+
var _ref2;
|
|
347
|
+
|
|
348
|
+
var SLabel = _ref13.Element,
|
|
349
|
+
styles = _ref13.styles,
|
|
350
|
+
Children = _ref13.Children;
|
|
351
|
+
return _ref2 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SLabel, _ref2.cn("SLabel", {
|
|
352
|
+
"render": "text",
|
|
353
|
+
"x": "0",
|
|
354
|
+
"y": "0"
|
|
355
|
+
}), /*#__PURE__*/_react["default"].createElement(Children, _ref2.cn("Children", {})));
|
|
255
356
|
}
|
|
256
357
|
|
|
257
358
|
var Donut = (0, _createElement["default"])(DonutRoot, {
|
package/lib/cjs/Donut.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Donut.js"],"names":["DEFAULT_INSTANCE","Symbol","DonutRoot","document","createElement","visible","props","x","clientX","y","clientY","eventEmitter","asProps","virtualElement","getBoundingClientRect","generateGetBoundingClientRect","CONSTANT","VIRTUAL_ELEMENT","emit","width","height","top","right","bottom","left","Children","data","d3Pie","pieData","Object","entries","keys","React","toArray","reduce","acc","child","isValidElement","type","Donut","Pie","push","dataKey","filter","key","includes","sort","a","b","indexOf","d3Arc","arcs","find","arc","onMouseMove","bindHandlerTooltip","onMouseLeave","endAngle","Math","PI","startAngle","color","halfsize","size","Element","k","getArcs","Component","style","innerRadius","$rootProps","minORmax","max","min","outerRadius","value","SPie","styles","Label","SLabel","EmptyData"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { arc, pie } from 'd3-shape';\nimport { Component, styled } from '@semcore/core';\nimport canUseDOM from '@semcore/utils/lib/canUseDOM';\nimport getOriginChildren from '@semcore/utils/lib/getOriginChildren';\nimport { CONSTANT } from './utils';\nimport createElement from './createElement';\n\nimport style from './style/donut.shadow.css';\n\nconst DEFAULT_INSTANCE = Symbol('DEFAULT_INSTANCE');\n\nclass DonutRoot extends Component {\n static displayName = 'Donut';\n static style = style;\n\n static defaultProps = ({ innerRadius = 0, halfsize = false, $rootProps: { size } }) => {\n const [width, height] = size;\n const minORmax = halfsize ? Math.max : Math.min;\n const d3Arc = arc()\n .outerRadius(minORmax(width, height) / 2)\n .innerRadius(innerRadius);\n let d3Pie = pie()\n .sort(null)\n .value(([, value]) => value);\n d3Pie[DEFAULT_INSTANCE] = true;\n\n if (halfsize) {\n d3Pie = d3Pie.startAngle(-Math.PI / 2).endAngle(Math.PI / 2);\n }\n return {\n d3Pie,\n d3Arc,\n };\n };\n\n virtualElement = canUseDOM() ? document.createElement('div') : {};\n\n generateGetBoundingClientRect(x = 0, y = 0) {\n return () => ({\n width: 0,\n height: 0,\n top: y,\n right: x,\n bottom: y,\n left: x,\n });\n }\n\n getArcs() {\n let { Children, data, d3Pie } = this.asProps;\n let pieData = Object.entries(data);\n\n if (d3Pie[DEFAULT_INSTANCE]) {\n const keys = React.Children.toArray(getOriginChildren(Children)).reduce((acc, child) => {\n if (React.isValidElement(child) && child.type === Donut.Pie) {\n acc.push(child.props.dataKey);\n }\n return acc;\n }, []);\n pieData = Object.entries(data)\n .filter(([key]) => keys.includes(key))\n .sort(([a], [b]) => (keys.indexOf(a) > keys.indexOf(b) ? 1 : -1));\n }\n return d3Pie(pieData);\n }\n\n bindHandlerTooltip = (visible, props) => ({ clientX: x, clientY: y }) => {\n const { eventEmitter } = this.asProps;\n this.virtualElement.getBoundingClientRect = this.generateGetBoundingClientRect(x, y);\n this.virtualElement[CONSTANT.VIRTUAL_ELEMENT] = true;\n eventEmitter.emit('onTooltipVisible', visible, props, this.virtualElement);\n };\n\n getPieProps(props) {\n const { d3Arc } = this.asProps;\n return {\n data: this.arcs.find((arc) => arc.data[0] == props.dataKey),\n d3Arc,\n onMouseMove: this.bindHandlerTooltip(true, props),\n onMouseLeave: this.bindHandlerTooltip(false, props),\n };\n }\n\n getEmptyDataProps() {\n const { d3Arc } = this.asProps;\n return {\n data: {\n endAngle: Math.PI * 2,\n startAngle: 0,\n },\n d3Arc,\n color: '#E4ECF1',\n };\n }\n\n render() {\n const { halfsize, size } = this.asProps;\n const [width, height] = size;\n const Element = this.Element;\n const k = halfsize ? 1 : 2;\n this.arcs = this.getArcs();\n return (\n <Element\n render=\"g\"\n childrenPosition=\"inside\"\n transform={`translate(${width / 2},${height / k})`}\n />\n );\n }\n}\n\nfunction Pie({ Element: SPie, styles, d3Arc, data, color = '#50aef4' }) {\n return styled(styles)(<SPie render=\"path\" fill={color} d={d3Arc(data)} />);\n}\n\nfunction Label({ Element: SLabel, styles, Children }) {\n return styled(styles)(\n <SLabel render=\"text\" x=\"0\" y=\"0\">\n <Children />\n </SLabel>,\n );\n}\n\nconst Donut = createElement(DonutRoot, { Pie, Label, EmptyData: Pie });\n\nexport default Donut;\n"],"file":"Donut.js"}
|
|
1
|
+
{"version":3,"sources":["../../src/Donut.js"],"names":["DEFAULT_INSTANCE","Symbol","animationInitialPie","halfsize","d3Arc","arcs","_","ind","d","iStart","Math","PI","startAngle","iEnd","endAngle","t","animationUpdatePie","_current","i","DonutRoot","document","createElement","visible","props","x","clientX","y","clientY","eventEmitter","asProps","virtualElement","getBoundingClientRect","generateGetBoundingClientRect","CONSTANT","VIRTUAL_ELEMENT","emit","uid","id","width","height","top","right","bottom","left","Children","data","d3Pie","pieData","Object","entries","keys","React","toArray","reduce","acc","child","isValidElement","type","Donut","Pie","push","dataKey","filter","key","includes","sort","a","b","indexOf","minValue","cur","map","find","arc","onMouseMove","bindHandlerTooltip","onMouseLeave","color","prevProps","duration","$rootProps","selection","selectAll","transition","attrTween","each","size","Element","k","getArcs","Component","style","innerRadius","minORmax","max","min","outerRadius","value","SPie","styles","Label","SLabel","EmptyData"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAEA;;AAFA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;AAIA,IAAMA,gBAAgB,GAAGC,MAAM,CAAC,kBAAD,CAA/B;;AAEA,SAASC,mBAAT,QAAwD;AAAA,MAAzBC,QAAyB,SAAzBA,QAAyB;AAAA,MAAfC,KAAe,SAAfA,KAAe;AAAA,MAARC,IAAQ,SAARA,IAAQ;AACtD,SAAO,UAASC,CAAT,EAAYC,GAAZ,EAAiB;AACtB,QAAMC,CAAC,GAAGH,IAAI,CAACE,GAAD,CAAd;AACA,QAAI,CAACC,CAAL,EAAQ,OAAO;AAAA,aAAM,EAAN;AAAA,KAAP;AACR,QAAMC,MAAM,GAAG,gCAAYN,QAAQ,GAAG,CAACO,IAAI,CAACC,EAAN,GAAW,CAAd,GAAkB,CAAtC,EAAyCH,CAAC,CAACI,UAA3C,CAAf;AACA,QAAMC,IAAI,GAAG,gCAAYV,QAAQ,GAAG,CAACO,IAAI,CAACC,EAAN,GAAW,CAAd,GAAkB,CAAtC,EAAyCH,CAAC,CAACM,QAA3C,CAAb;AACA,WAAO,UAASC,CAAT,EAAY;AACjBP,MAAAA,CAAC,CAACI,UAAF,GAAeH,MAAM,CAACM,CAAD,CAArB;AACAP,MAAAA,CAAC,CAACM,QAAF,GAAaD,IAAI,CAACE,CAAD,CAAjB;AACA,aAAOX,KAAK,CAACI,CAAD,CAAZ;AACD,KAJD;AAKD,GAVD;AAWD;;AAED,SAASQ,kBAAT,QAAuD;AAAA,MAAzBb,QAAyB,SAAzBA,QAAyB;AAAA,MAAfE,IAAe,SAAfA,IAAe;AAAA,MAATD,KAAS,SAATA,KAAS;AACrD,SAAO,UAASE,CAAT,EAAYC,GAAZ,EAAiB;AACtB,QAAMC,CAAC,GAAGH,IAAI,CAACE,GAAD,CAAd;;AACA,QAAI,KAAKU,QAAT,EAAmB;AACjB,UAAMC,CAAC,GAAG,gCAAY,KAAKD,QAAjB,EAA2BT,CAA3B,CAAV;AACA,WAAKS,QAAL,GAAgBC,CAAC,CAAC,CAAD,CAAjB;AACA,aAAO,UAASH,CAAT,EAAY;AACjB,eAAOX,KAAK,CAACc,CAAC,CAACH,CAAD,CAAF,CAAZ;AACD,OAFD;AAGD,KAND,MAMO;AACL,WAAKE,QAAL,GAAgBT,CAAhB;AACA,aAAON,mBAAmB,CAAC;AAAEC,QAAAA,QAAQ,EAARA,QAAF;AAAYE,QAAAA,IAAI,EAAJA,IAAZ;AAAkBD,QAAAA,KAAK,EAALA;AAAlB,OAAD,CAAnB,CAA+CE,CAA/C,EAAkDC,GAAlD,CAAP;AACD;AACF,GAZD;AAaD;;IAEKY,S;;;;;;;;;;;;;;;uGA+Ba,+BAAcC,QAAQ,CAACC,aAAT,CAAuB,KAAvB,CAAd,GAA8C,E;2GAiC1C,UAACC,OAAD,EAAUC,KAAV;AAAA,aAAoB,iBAAgC;AAAA,YAApBC,CAAoB,SAA7BC,OAA6B;AAAA,YAARC,CAAQ,SAAjBC,OAAiB;AAAA,YAC/DC,YAD+D,GAC9C,MAAKC,OADyC,CAC/DD,YAD+D;AAEvE,cAAKE,cAAL,CAAoBC,qBAApB,GAA4C,MAAKC,6BAAL,CAAmCR,CAAnC,EAAsCE,CAAtC,CAA5C;AACA,cAAKI,cAAL,CAAoBG,gBAASC,eAA7B,IAAgD,IAAhD;AACAN,QAAAA,YAAY,CAACO,IAAb,CAAkB,kBAAlB,EAAsCb,OAAtC,EAA+CC,KAA/C,EAAsD,MAAKO,cAA3D;AACD,OALoB;AAAA,K;;;;;;SAtCrB,eAAS;AAAA,0BACa,KAAKD,OADlB;AAAA,UACCO,GADD,iBACCA,GADD;AAAA,UACMC,EADN,iBACMA,EADN;AAEP,aAAOA,EAAE,IAAID,GAAb;AACD;;;WAID,yCAA4C;AAAA,UAAdZ,CAAc,uEAAV,CAAU;AAAA,UAAPE,CAAO,uEAAH,CAAG;AAC1C,aAAO;AAAA,eAAO;AAAEY,UAAAA,KAAK,EAAE,CAAT;AAAYC,UAAAA,MAAM,EAAE,CAApB;AAAuBC,UAAAA,GAAG,EAAEd,CAA5B;AAA+Be,UAAAA,KAAK,EAAEjB,CAAtC;AAAyCkB,UAAAA,MAAM,EAAEhB,CAAjD;AAAoDiB,UAAAA,IAAI,EAAEnB;AAA1D,SAAP;AAAA,OAAP;AACD;;;WAED,mBAAU;AAAA,2BACwB,KAAKK,OAD7B;AAAA,UACFe,QADE,kBACFA,QADE;AAAA,UACQC,IADR,kBACQA,IADR;AAAA,UACcC,KADd,kBACcA,KADd;AAER,UAAIC,OAAO,GAAGC,MAAM,CAACC,OAAP,CAAeJ,IAAf,CAAd;;AAEA,UAAIC,KAAK,CAAC9C,gBAAD,CAAT,EAA6B;AAC3B,YAAMkD,IAAI,GAAGC,kBAAMP,QAAN,CAAeQ,OAAf,CAAuB,mCAAkBR,QAAlB,CAAvB,EAAoDS,MAApD,CAA2D,UAACC,GAAD,EAAMC,KAAN,EAAgB;AACtF,cAAI,gCAAMC,cAAN,CAAqBD,KAArB,KAA+BA,KAAK,CAACE,IAAN,KAAeC,KAAK,CAACC,GAAxD,EAA6D;AAC3DL,YAAAA,GAAG,CAACM,IAAJ,CAASL,KAAK,CAAChC,KAAN,CAAYsC,OAArB;AACD;;AACD,iBAAOP,GAAP;AACD,SALY,EAKV,EALU,CAAb;;AAMAP,QAAAA,OAAO,GAAGC,MAAM,CAACC,OAAP,CAAeJ,IAAf,EACPiB,MADO,CACA;AAAA;AAAA,cAAEC,GAAF;;AAAA,iBAAWb,IAAI,CAACc,QAAL,CAAcD,GAAd,CAAX;AAAA,SADA,EAEPE,IAFO,CAEF;AAAA;AAAA,cAAEC,CAAF;;AAAA;AAAA,cAAOC,CAAP;;AAAA,iBAAejB,IAAI,CAACkB,OAAL,CAAaF,CAAb,IAAkBhB,IAAI,CAACkB,OAAL,CAAaD,CAAb,CAAlB,GAAoC,CAApC,GAAwC,CAAC,CAAxD;AAAA,SAFE,CAAV;AAGD;;AACD,UAAME,QAAQ,GACZtB,OAAO,CAACM,MAAR,CAAe,UAACC,GAAD,EAAMgB,GAAN,EAAc;AAC3B,YAAIA,GAAG,CAAC,CAAD,CAAP,EAAYhB,GAAG,IAAIgB,GAAG,CAAC,CAAD,CAAV;AACZ,eAAOhB,GAAP;AACD,OAHD,EAGG,CAHH,IAGQ,GAJV;AAKAP,MAAAA,OAAO,GAAGA,OAAO,CAACwB,GAAR,CAAY,UAAC/D,CAAD,EAAO;AAC3B,YAAIA,CAAC,CAAC,CAAD,CAAD,IAAQA,CAAC,CAAC,CAAD,CAAD,GAAO6D,QAAnB,EAA6B7D,CAAC,CAAC,CAAD,CAAD,GAAO6D,QAAP;AAC7B,eAAO7D,CAAP;AACD,OAHS,CAAV;AAIA,aAAOsC,KAAK,CAACC,OAAD,CAAZ;AACD;;;WASD,qBAAYxB,KAAZ,EAAmB;AAAA,UACTnB,KADS,GACC,KAAKyB,OADN,CACTzB,KADS;AAEjB,aAAO;AACLyC,QAAAA,IAAI,EAAE,KAAKxC,IAAL,CAAUmE,IAAV,CAAe,UAACC,GAAD;AAAA,iBAASA,GAAG,CAAC5B,IAAJ,CAAS,CAAT,MAAgBtB,KAAK,CAACsC,OAA/B;AAAA,SAAf,CADD;AAELzD,QAAAA,KAAK,EAALA,KAFK;AAGLsE,QAAAA,WAAW,EAAE,KAAKC,kBAAL,CAAwB,IAAxB,EAA8BpD,KAA9B,CAHR;AAILqD,QAAAA,YAAY,EAAE,KAAKD,kBAAL,CAAwB,KAAxB,EAA+BpD,KAA/B;AAJT,OAAP;AAMD;;;WAED,6BAAoB;AAAA,UACVnB,KADU,GACA,KAAKyB,OADL,CACVzB,KADU;AAElB,aAAO;AACLyC,QAAAA,IAAI,EAAE;AACJ/B,UAAAA,QAAQ,EAAEJ,IAAI,CAACC,EAAL,GAAU,CADhB;AAEJC,UAAAA,UAAU,EAAE;AAFR,SADD;AAKLR,QAAAA,KAAK,EAALA,KALK;AAMLyE,QAAAA,KAAK,EAAE;AANF,OAAP;AAQD;;;WAED,4BAAmBC,SAAnB,EAA8B;AAAA,2BACgB,KAAKjD,OADrB;AAAA,UACpBgB,IADoB,kBACpBA,IADoB;AAAA,UACdkC,QADc,kBACdA,QADc;AAAA,UACJ3E,KADI,kBACJA,KADI;AAAA,UACGD,QADH,kBACGA,QADH;AAE5B,UAAME,IAAI,GAAG,KAAKA,IAAlB;;AACA,UAAIyE,SAAS,CAACE,UAAV,CAAqBnC,IAArB,KAA8BA,IAA9B,IAAsCkC,QAAQ,GAAG,CAArD,EAAwD;AACtD,wCACGE,SADH,GAEGC,SAFH,YAEiB,KAAK7C,EAFtB,oCAGG8C,UAHH,GAIGJ,QAJH,CAIYA,QAJZ,EAKGK,SALH,CAKa,GALb,EAKkBpE,kBAAkB,CAAC;AAAEZ,UAAAA,KAAK,EAALA,KAAF;AAASC,UAAAA,IAAI,EAAJA,IAAT;AAAeF,UAAAA,QAAQ,EAARA;AAAf,SAAD,CALpC;AAMD;AACF;;;WAED,6BAAoB;AAAA,2BACoB,KAAK0B,OADzB;AAAA,UACVkD,QADU,kBACVA,QADU;AAAA,UACA3E,KADA,kBACAA,KADA;AAAA,UACOD,QADP,kBACOA,QADP;AAElB,UAAME,IAAI,GAAG,KAAKA,IAAlB;;AACA,UAAI0E,QAAQ,GAAG,CAAf,EAAkB;AAChB,wCACGE,SADH,GAEGC,SAFH,YAEiB,KAAK7C,EAFtB,oCAGGgD,IAHH,CAGQ,UAAS/E,CAAT,EAAYC,GAAZ,EAAiB;AACrB,eAAKU,QAAL,GAAgBZ,IAAI,CAACE,GAAD,CAApB;AACD,SALH,EAMG4E,UANH,GAOGJ,QAPH,CAOYA,QAPZ,EAQGK,SARH,CAQa,GARb,EAQkBlF,mBAAmB,CAAC;AAAEC,UAAAA,QAAQ,EAARA,QAAF;AAAYC,UAAAA,KAAK,EAALA,KAAZ;AAAmBC,UAAAA,IAAI,EAAJA;AAAnB,SAAD,CARrC;AASD;AACF;;;WAED,kBAAS;AAAA,2BACoB,KAAKwB,OADzB;AAAA,UACC1B,QADD,kBACCA,QADD;AAAA,UACWmF,IADX,kBACWA,IADX;;AAAA,kDAEiBA,IAFjB;AAAA,UAEAhD,KAFA;AAAA,UAEOC,MAFP;;AAGP,UAAMgD,OAAO,GAAG,KAAKA,OAArB;AACA,UAAMC,CAAC,GAAGrF,QAAQ,GAAG,CAAH,GAAO,CAAzB;AACA,WAAKE,IAAL,GAAY,KAAKoF,OAAL,EAAZ;AACA,0BACE,gCAAC,OAAD;AACE,QAAA,EAAE,EAAE,KAAKpD,EADX;AAEE,QAAA,MAAM,EAAC,GAFT;AAGE,QAAA,gBAAgB,EAAC,QAHnB;AAIE,QAAA,SAAS,sBAAeC,KAAK,GAAG,CAAvB,cAA4BC,MAAM,GAAGiD,CAArC;AAJX,QADF;AAQD;;;EAxIqBE,e;;iCAAlBvE,S,iBACiB,O;iCADjBA,S,WAEWwE,K;iCAFXxE,S,aAGa,CAAC,2BAAD,C;iCAHbA,S,kBAKkB,kBAAiE;AAAA,kCAA9DyE,WAA8D;AAAA,MAA9DA,WAA8D,mCAAhD,CAAgD;AAAA,+BAA7CzF,QAA6C;AAAA,MAA7CA,QAA6C,gCAAlC,KAAkC;AAAA,MAAbmF,IAAa,UAA3BN,UAA2B,CAAbM,IAAa;;AAAA,+CAC7DA,IAD6D;AAAA,MAC9EhD,KAD8E;AAAA,MACvEC,MADuE;;AAErF,MAAMsD,QAAQ,GAAG1F,QAAQ,GAAGO,IAAI,CAACoF,GAAR,GAAcpF,IAAI,CAACqF,GAA5C;AACA,MAAM3F,KAAK,GAAG,oBACX4F,WADW,CACCH,QAAQ,CAACvD,KAAD,EAAQC,MAAR,CAAR,GAA0B,CAD3B,EAEXqD,WAFW,CAECA,WAFD,CAAd;AAGA,MAAI9C,KAAK,GAAG,oBACTmB,IADS,CACJ,IADI,EAETgC,KAFS,CAEH;AAAA;AAAA,QAAIA,KAAJ;;AAAA,WAAeA,KAAf;AAAA,GAFG,CAAZ;AAGAnD,EAAAA,KAAK,CAAC9C,gBAAD,CAAL,GAA0B,IAA1B;;AAEA,MAAIG,QAAJ,EAAc;AACZ2C,IAAAA,KAAK,GAAGA,KAAK,CAAClC,UAAN,CAAiB,CAACF,IAAI,CAACC,EAAN,GAAW,CAA5B,EAA+BG,QAA/B,CAAwCJ,IAAI,CAACC,EAAL,GAAU,CAAlD,CAAR;AACD;;AACD,SAAO;AACLmC,IAAAA,KAAK,EAALA,KADK;AAEL1C,IAAAA,KAAK,EAALA,KAFK;AAGL2E,IAAAA,QAAQ,EAAE;AAHL,GAAP;AAKD,C;;AAmHH,SAASpB,GAAT,SAAwE;AAAA;;AAAA,MAAhDuC,IAAgD,UAAzDX,OAAyD;AAAA,MAA1CY,MAA0C,UAA1CA,MAA0C;AAAA,MAAlC/F,KAAkC,UAAlCA,KAAkC;AAAA,MAA3ByC,IAA2B,UAA3BA,IAA2B;AAAA,4BAArBgC,KAAqB;AAAA,MAArBA,KAAqB,6BAAb,SAAa;AACtE,gBAAO,mBAAQsB,MAAR,CAAP,eAAuB,gCAAC,IAAD;AAAA,cAAa,MAAb;AAAA,aAA2BtB,KAA3B;AAAA,SAAqCzE,KAAK,CAACyC,IAAD;AAA1C,KAAvB;AACD;;AAED,SAASuD,KAAT,SAAsD;AAAA;;AAAA,MAA5BC,MAA4B,UAArCd,OAAqC;AAAA,MAApBY,MAAoB,UAApBA,MAAoB;AAAA,MAAZvD,QAAY,UAAZA,QAAY;AACpD,iBAAO,mBAAQuD,MAAR,CAAP,eACE,gCAAC,MAAD;AAAA,cAAe,MAAf;AAAA,SAAwB,GAAxB;AAAA,SAA8B;AAA9B,mBACE,gCAAC,QAAD,2BADF,CADF;AAKD;;AAED,IAAMzC,KAAK,GAAG,+BAAcvC,SAAd,EAAyB;AAAEwC,EAAAA,GAAG,EAAHA,GAAF;AAAOyC,EAAAA,KAAK,EAALA,KAAP;AAAcE,EAAAA,SAAS,EAAE3C;AAAzB,CAAzB,CAAd;eAEeD,K","sourcesContent":["import React from 'react';\nimport { arc, pie } from 'd3-shape';\nimport { Component, sstyled } from '@semcore/core';\nimport canUseDOM from '@semcore/utils/lib/canUseDOM';\nimport getOriginChildren from '@semcore/utils/lib/getOriginChildren';\nimport { CONSTANT } from './utils';\nimport createElement from './createElement';\nimport uniqueIDEnhancement from '@semcore/utils/lib/uniqueID';\nimport { interpolate } from 'd3-interpolate';\nimport { transition } from 'd3-transition';\n\nimport style from './style/donut.shadow.css';\n\nconst DEFAULT_INSTANCE = Symbol('DEFAULT_INSTANCE');\n\nfunction animationInitialPie({ halfsize, d3Arc, arcs }) {\n return function(_, ind) {\n const d = arcs[ind];\n if (!d) return () => '';\n const iStart = interpolate(halfsize ? -Math.PI / 2 : 0, d.startAngle);\n const iEnd = interpolate(halfsize ? -Math.PI / 2 : 0, d.endAngle);\n return function(t) {\n d.startAngle = iStart(t);\n d.endAngle = iEnd(t);\n return d3Arc(d);\n };\n };\n}\n\nfunction animationUpdatePie({ halfsize, arcs, d3Arc }) {\n return function(_, ind) {\n const d = arcs[ind];\n if (this._current) {\n const i = interpolate(this._current, d);\n this._current = i(0);\n return function(t) {\n return d3Arc(i(t));\n };\n } else {\n this._current = d;\n return animationInitialPie({ halfsize, arcs, d3Arc })(_, ind);\n }\n };\n}\n\nclass DonutRoot extends Component {\n static displayName = 'Donut';\n static style = style;\n static enhance = [uniqueIDEnhancement()];\n\n static defaultProps = ({ innerRadius = 0, halfsize = false, $rootProps: { size } }) => {\n const [width, height] = size;\n const minORmax = halfsize ? Math.max : Math.min;\n const d3Arc = arc()\n .outerRadius(minORmax(width, height) / 2)\n .innerRadius(innerRadius);\n let d3Pie = pie()\n .sort(null)\n .value(([, value]) => value);\n d3Pie[DEFAULT_INSTANCE] = true;\n\n if (halfsize) {\n d3Pie = d3Pie.startAngle(-Math.PI / 2).endAngle(Math.PI / 2);\n }\n return {\n d3Pie,\n d3Arc,\n duration: 500,\n };\n };\n\n get id() {\n const { uid, id } = this.asProps;\n return id || uid;\n }\n\n virtualElement = canUseDOM() ? document.createElement('div') : {};\n\n generateGetBoundingClientRect(x = 0, y = 0) {\n return () => ({ width: 0, height: 0, top: y, right: x, bottom: y, left: x });\n }\n\n getArcs() {\n let { Children, data, d3Pie } = this.asProps;\n let pieData = Object.entries(data);\n\n if (d3Pie[DEFAULT_INSTANCE]) {\n const keys = React.Children.toArray(getOriginChildren(Children)).reduce((acc, child) => {\n if (React.isValidElement(child) && child.type === Donut.Pie) {\n acc.push(child.props.dataKey);\n }\n return acc;\n }, []);\n pieData = Object.entries(data)\n .filter(([key]) => keys.includes(key))\n .sort(([a], [b]) => (keys.indexOf(a) > keys.indexOf(b) ? 1 : -1));\n }\n const minValue =\n pieData.reduce((acc, cur) => {\n if (cur[1]) acc += cur[1];\n return acc;\n }, 0) / 100;\n pieData = pieData.map((d) => {\n if (d[1] && d[1] < minValue) d[1] = minValue;\n return d;\n });\n return d3Pie(pieData);\n }\n\n bindHandlerTooltip = (visible, props) => ({ clientX: x, clientY: y }) => {\n const { eventEmitter } = this.asProps;\n this.virtualElement.getBoundingClientRect = this.generateGetBoundingClientRect(x, y);\n this.virtualElement[CONSTANT.VIRTUAL_ELEMENT] = true;\n eventEmitter.emit('onTooltipVisible', visible, props, this.virtualElement);\n };\n\n getPieProps(props) {\n const { d3Arc } = this.asProps;\n return {\n data: this.arcs.find((arc) => arc.data[0] === props.dataKey),\n d3Arc,\n onMouseMove: this.bindHandlerTooltip(true, props),\n onMouseLeave: this.bindHandlerTooltip(false, props),\n };\n }\n\n getEmptyDataProps() {\n const { d3Arc } = this.asProps;\n return {\n data: {\n endAngle: Math.PI * 2,\n startAngle: 0,\n },\n d3Arc,\n color: '#E4ECF1',\n };\n }\n\n componentDidUpdate(prevProps) {\n const { data, duration, d3Arc, halfsize } = this.asProps;\n const arcs = this.arcs;\n if (prevProps.$rootProps.data !== data && duration > 0) {\n transition()\n .selection()\n .selectAll(`#${this.id} [data-ui-name=\"Donut.Pie\"]`)\n .transition()\n .duration(duration)\n .attrTween('d', animationUpdatePie({ d3Arc, arcs, halfsize }));\n }\n }\n\n componentDidMount() {\n const { duration, d3Arc, halfsize } = this.asProps;\n const arcs = this.arcs;\n if (duration > 0) {\n transition()\n .selection()\n .selectAll(`#${this.id} [data-ui-name=\"Donut.Pie\"]`)\n .each(function(_, ind) {\n this._current = arcs[ind];\n })\n .transition()\n .duration(duration)\n .attrTween('d', animationInitialPie({ halfsize, d3Arc, arcs }));\n }\n }\n\n render() {\n const { halfsize, size } = this.asProps;\n const [width, height] = size;\n const Element = this.Element;\n const k = halfsize ? 1 : 2;\n this.arcs = this.getArcs();\n return (\n <Element\n id={this.id}\n render=\"g\"\n childrenPosition=\"inside\"\n transform={`translate(${width / 2},${height / k})`}\n />\n );\n }\n}\n\nfunction Pie({ Element: SPie, styles, d3Arc, data, color = '#50aef4' }) {\n return sstyled(styles)(<SPie render=\"path\" color={color} d={d3Arc(data)} />);\n}\n\nfunction Label({ Element: SLabel, styles, Children }) {\n return sstyled(styles)(\n <SLabel render=\"text\" x=\"0\" y=\"0\">\n <Children />\n </SLabel>,\n );\n}\n\nconst Donut = createElement(DonutRoot, { Pie, Label, EmptyData: Pie });\n\nexport default Donut;\n"],"file":"Donut.js"}
|
package/lib/cjs/Dots.js
CHANGED
|
@@ -9,24 +9,46 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
9
9
|
});
|
|
10
10
|
exports["default"] = void 0;
|
|
11
11
|
|
|
12
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
13
|
+
|
|
12
14
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
13
15
|
|
|
16
|
+
var _core = require("@semcore/core");
|
|
17
|
+
|
|
14
18
|
var _d3Array = require("d3-array");
|
|
15
19
|
|
|
16
20
|
var _react = _interopRequireWildcard(require("react"));
|
|
17
21
|
|
|
18
|
-
var _core = require("@semcore/core");
|
|
19
|
-
|
|
20
22
|
var _rafTrottle = _interopRequireDefault(require("@semcore/utils/lib/rafTrottle"));
|
|
21
23
|
|
|
22
24
|
var _utils = require("./utils");
|
|
23
25
|
|
|
24
|
-
var
|
|
26
|
+
var _createElement = _interopRequireDefault(require("./createElement"));
|
|
27
|
+
|
|
28
|
+
var _animation = require("@semcore/animation");
|
|
29
|
+
|
|
30
|
+
/*__reshadow-styles__:"./style/dot.shadow.css"*/
|
|
31
|
+
var style = (
|
|
32
|
+
/*__reshadow_css_start__*/
|
|
33
|
+
_core.sstyled.insert(
|
|
34
|
+
/*__inner_css_start__*/
|
|
35
|
+
".___SDot_vvre7_gg_{stroke-width:2px;stroke:#fff;r:6px;fill:var(--color_8nea8t);transition-property:cx,cy;transition-duration:var(--duration_8nea8t);transition-timing-function:ease-in-out}.___SDot_vvre7_gg_.__hide_vvre7_gg_{display:none}.___SDot_vvre7_gg_.__active_vvre7_gg_{r:8px}"
|
|
36
|
+
/*__inner_css_end__*/
|
|
37
|
+
, "8nea8t_gg_")
|
|
38
|
+
/*__reshadow_css_end__*/
|
|
39
|
+
, {
|
|
40
|
+
"__SDot": "___SDot_vvre7_gg_",
|
|
41
|
+
"--color": "--color_8nea8t",
|
|
42
|
+
"--duration": "--duration_8nea8t",
|
|
43
|
+
"_hide": "__hide_vvre7_gg_",
|
|
44
|
+
"_active": "__active_vvre7_gg_"
|
|
45
|
+
});
|
|
25
46
|
|
|
26
47
|
function Dots(props) {
|
|
27
48
|
var SDot = props.Element,
|
|
28
49
|
styles = props.styles,
|
|
29
50
|
data = props.data,
|
|
51
|
+
color = props.color,
|
|
30
52
|
d3 = props.d3,
|
|
31
53
|
x = props.x,
|
|
32
54
|
y = props.y,
|
|
@@ -34,12 +56,14 @@ function Dots(props) {
|
|
|
34
56
|
display = props.display,
|
|
35
57
|
hide = props.hide,
|
|
36
58
|
rootRef = props.rootRef,
|
|
37
|
-
scale = props.scale
|
|
59
|
+
scale = props.scale,
|
|
60
|
+
_props$duration = props.duration,
|
|
61
|
+
duration = _props$duration === void 0 ? 500 : _props$duration;
|
|
38
62
|
var bisect = (0, _d3Array.bisector)(function (d) {
|
|
39
63
|
return d[x];
|
|
40
64
|
}).center;
|
|
41
65
|
|
|
42
|
-
var _useState = (0, _react.useState)(
|
|
66
|
+
var _useState = (0, _react.useState)(null),
|
|
43
67
|
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
|
44
68
|
activeIndex = _useState2[0],
|
|
45
69
|
setActiveIndex = _useState2[1];
|
|
@@ -69,30 +93,40 @@ function Dots(props) {
|
|
|
69
93
|
unsubscribeMouseLeaveRoot();
|
|
70
94
|
};
|
|
71
95
|
}, [eventEmitter, data, x, y]);
|
|
96
|
+
var renderCircle = (0, _react.useCallback)( /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
|
|
97
|
+
return /*#__PURE__*/_react["default"].createElement(_animation.FadeInOut, (0, _extends2["default"])({
|
|
98
|
+
ref: ref,
|
|
99
|
+
tag: "circle"
|
|
100
|
+
}, props));
|
|
101
|
+
}), [props]);
|
|
72
102
|
return data.reduce(function (acc, d, i) {
|
|
103
|
+
var _ref;
|
|
104
|
+
|
|
73
105
|
var isPrev = d3.defined()(data[i - 1] || {});
|
|
74
106
|
var isNext = d3.defined()(data[i + 1] || {});
|
|
75
107
|
var active = i === activeIndex;
|
|
76
108
|
if (!d3.defined()(d)) return acc;
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
}
|
|
91
|
-
|
|
109
|
+
acc.push((_ref = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SDot, _ref.cn("SDot", {
|
|
110
|
+
"key": i,
|
|
111
|
+
"render": renderCircle,
|
|
112
|
+
"visible": display || i === activeIndex || !isPrev && !isNext,
|
|
113
|
+
"__excludeProps": ['data', 'scale', 'value', 'display'],
|
|
114
|
+
"value": d,
|
|
115
|
+
"index": i,
|
|
116
|
+
"cx": d3.x()(d),
|
|
117
|
+
"cy": d3.y()(d),
|
|
118
|
+
"active": active,
|
|
119
|
+
"hide": hide,
|
|
120
|
+
"color": color,
|
|
121
|
+
"use:duration": "".concat(duration, "ms")
|
|
122
|
+
}))));
|
|
92
123
|
return acc;
|
|
93
124
|
}, []);
|
|
94
125
|
}
|
|
95
126
|
|
|
96
|
-
|
|
127
|
+
Dots.style = style;
|
|
128
|
+
|
|
129
|
+
var _default = (0, _createElement["default"])(Dots);
|
|
130
|
+
|
|
97
131
|
exports["default"] = _default;
|
|
98
132
|
//# sourceMappingURL=Dots.js.map
|
package/lib/cjs/Dots.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Dots.js"],"names":["Dots","props","SDot","Element","styles","data","d3","x","y","eventEmitter","display","hide","rootRef","scale","bisect","d","center","activeIndex","setActiveIndex","handlerMouseMoveRoot","e","xScale","current","pX","vX","handlerMouseLeaveRoot","unsubscribeMouseMoveRoot","subscribe","persist","unsubscribeMouseLeaveRoot","reduce","acc","i","isPrev","defined","isNext","active","push"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../src/Dots.js"],"names":["Dots","props","SDot","Element","styles","data","color","d3","x","y","eventEmitter","display","hide","rootRef","scale","duration","bisect","d","center","activeIndex","setActiveIndex","handlerMouseMoveRoot","e","xScale","current","pX","vX","handlerMouseLeaveRoot","unsubscribeMouseMoveRoot","subscribe","persist","unsubscribeMouseLeaveRoot","renderCircle","React","forwardRef","ref","reduce","acc","i","isPrev","defined","isNext","active","push","style"],"mappings":"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","sourcesContent":["import { bisector } from 'd3-array';\nimport React, { useCallback, useEffect, useState } from 'react';\nimport { sstyled } from '@semcore/core';\nimport trottle from '@semcore/utils/lib/rafTrottle';\nimport { eventToPoint, invert } from './utils';\nimport createElement from './createElement';\nimport { FadeInOut } from '@semcore/animation';\n\nimport style from './style/dot.shadow.css';\n\nfunction Dots(props) {\n const {\n Element: SDot,\n styles,\n data,\n color,\n d3,\n x,\n y,\n eventEmitter,\n display,\n hide,\n rootRef,\n scale,\n duration = 500,\n } = props;\n const bisect = bisector((d) => d[x]).center;\n const [activeIndex, setActiveIndex] = useState(null);\n\n const handlerMouseMoveRoot = useCallback(\n trottle((e) => {\n const [xScale] = scale;\n const [pX] = eventToPoint(e, rootRef.current);\n const vX = invert(xScale, pX);\n setActiveIndex(bisect(data, vX));\n }),\n [scale, data],\n );\n\n const handlerMouseLeaveRoot = useCallback(\n trottle(() => {\n setActiveIndex(null);\n }),\n [],\n );\n\n useEffect(() => {\n const unsubscribeMouseMoveRoot = eventEmitter.subscribe('onMouseMoveRoot', (e) => {\n e.persist();\n handlerMouseMoveRoot(e);\n });\n\n const unsubscribeMouseLeaveRoot = eventEmitter.subscribe(\n 'onMouseLeaveRoot',\n handlerMouseLeaveRoot,\n );\n\n return () => {\n unsubscribeMouseMoveRoot();\n unsubscribeMouseLeaveRoot();\n };\n }, [eventEmitter, data, x, y]);\n\n const renderCircle = useCallback(\n React.forwardRef((props, ref) => {\n return <FadeInOut ref={ref} tag=\"circle\" {...props} />;\n }),\n [props],\n );\n\n return data.reduce((acc, d, i) => {\n const isPrev = d3.defined()(data[i - 1] || {});\n const isNext = d3.defined()(data[i + 1] || {});\n const active = i === activeIndex;\n if (!d3.defined()(d)) return acc;\n acc.push(\n sstyled(styles)(\n <SDot\n key={i}\n render={renderCircle}\n visible={display || i === activeIndex || (!isPrev && !isNext)}\n __excludeProps={['data', 'scale', 'value', 'display']}\n value={d}\n index={i}\n cx={d3.x()(d)}\n cy={d3.y()(d)}\n active={active}\n hide={hide}\n color={color}\n use:duration={`${duration}ms`}\n />,\n ),\n );\n return acc;\n }, []);\n}\n\nDots.style = style;\n\nexport default createElement(Dots);\n"],"file":"Dots.js"}
|
package/lib/cjs/GroupBar.js
CHANGED
|
@@ -42,14 +42,14 @@ var _ref = (
|
|
|
42
42
|
/*__reshadow_css_start__*/
|
|
43
43
|
(0, _core.__css__)(
|
|
44
44
|
/*__inner_css_start__*/
|
|
45
|
-
".
|
|
45
|
+
".___SBar_urkei_gg_{fill:var(--color);transition-property:height,width,y;transition-duration:var(--duration);transition-timing-function:ease-in-out}.___SBar_urkei_gg_.__hide_urkei_gg_{display:none}.___SBackground_urkei_gg_{fill:#e4ecf1}"
|
|
46
46
|
/*__inner_css_end__*/
|
|
47
|
-
, "
|
|
47
|
+
, "1om7b1x_gg_")
|
|
48
48
|
/*__reshadow_css_end__*/
|
|
49
49
|
, {
|
|
50
|
-
"__SBar": "
|
|
51
|
-
"_hide": "
|
|
52
|
-
"__SBackground": "
|
|
50
|
+
"__SBar": "___SBar_urkei_gg_",
|
|
51
|
+
"_hide": "__hide_urkei_gg_",
|
|
52
|
+
"__SBackground": "___SBackground_urkei_gg_"
|
|
53
53
|
}),
|
|
54
54
|
style = (0, _extends2["default"])({}, _ref);
|
|
55
55
|
|
|
@@ -70,7 +70,8 @@ var GroupBarRoot = /*#__PURE__*/function (_Component) {
|
|
|
70
70
|
Children = _this$asProps.Children,
|
|
71
71
|
scale = _this$asProps.scale,
|
|
72
72
|
scaleGroup = _this$asProps.scaleGroup,
|
|
73
|
-
x = _this$asProps.x;
|
|
73
|
+
x = _this$asProps.x; // TODO: классный костыль =)
|
|
74
|
+
|
|
74
75
|
var xyScale = x ? scale[0] : scale[1];
|
|
75
76
|
if (scaleGroup) return scaleGroup;
|
|
76
77
|
|
package/lib/cjs/GroupBar.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/GroupBar.js"],"names":["GroupBarRoot","asProps","Children","scale","scaleGroup","x","xyScale","domain","React","toArray","reduce","acc","child","isValidElement","type","GroupBar","Bar","push","props","y","HorizontalBar","copy","range","bandwidth","paddingInner","paddingOuter","offset","width","height","Element","getScaleGroup","Component","style"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;;;IAIMA,Y;;;;;;;;;;;;WAKJ,yBAAgB;AAAA,0BAC6B,KAAKC,OADlC;AAAA,UACNC,QADM,iBACNA,QADM;AAAA,UACIC,KADJ,iBACIA,KADJ;AAAA,UACWC,UADX,iBACWA,UADX;AAAA,UACuBC,CADvB,iBACuBA,CADvB
|
|
1
|
+
{"version":3,"sources":["../../src/GroupBar.js"],"names":["GroupBarRoot","asProps","Children","scale","scaleGroup","x","xyScale","domain","React","toArray","reduce","acc","child","isValidElement","type","GroupBar","Bar","push","props","y","HorizontalBar","copy","range","bandwidth","paddingInner","paddingOuter","offset","width","height","Element","getScaleGroup","Component","style"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;;;IAIMA,Y;;;;;;;;;;;;WAKJ,yBAAgB;AAAA,0BAC6B,KAAKC,OADlC;AAAA,UACNC,QADM,iBACNA,QADM;AAAA,UACIC,KADJ,iBACIA,KADJ;AAAA,UACWC,UADX,iBACWA,UADX;AAAA,UACuBC,CADvB,iBACuBA,CADvB,EAEd;;AACA,UAAMC,OAAO,GAAGD,CAAC,GAAGF,KAAK,CAAC,CAAD,CAAR,GAAcA,KAAK,CAAC,CAAD,CAApC;AAEA,UAAIC,UAAJ,EAAgB,OAAOA,UAAP;;AAEhB,UAAMG,MAAM,GAAGC,kBAAMN,QAAN,CAAeO,OAAf,CAAuB,mCAAkBP,QAAlB,CAAvB,EAAoDQ,MAApD,CAA2D,UAACC,GAAD,EAAMC,KAAN,EAAgB;AACxF,YAAI,gCAAMC,cAAN,CAAqBD,KAArB,KAA+BA,KAAK,CAACE,IAAN,KAAeC,QAAQ,CAACC,GAA3D,EAAgE;AAC9DL,UAAAA,GAAG,CAACM,IAAJ,CAASL,KAAK,CAACM,KAAN,CAAYC,CAArB;AACD;;AACD,YAAI,gCAAMN,cAAN,CAAqBD,KAArB,KAA+BA,KAAK,CAACE,IAAN,KAAeC,QAAQ,CAACK,aAA3D,EAA0E;AACxET,UAAAA,GAAG,CAACM,IAAJ,CAASL,KAAK,CAACM,KAAN,CAAYb,CAArB;AACD;;AACD,eAAOM,GAAP;AACD,OARc,EAQZ,EARY,CAAf;;AAUA,aAAOL,OAAO,CACXe,IADI,GAEJC,KAFI,CAEE,CAAC,CAAD,EAAIhB,OAAO,CAACiB,SAAR,EAAJ,CAFF,EAGJhB,MAHI,CAGGA,MAHH,EAIJiB,YAJI,CAISlB,OAAO,CAACmB,YAAR,EAJT,EAKJA,YALI,CAKS,CALT,CAAP;AAMD;;;WAED,4BAAmB;AAAA,UAALN,CAAK,SAALA,CAAK;AAAA,UACTd,CADS,GACH,KAAKJ,OADF,CACTI,CADS;AAGjB,aAAO;AACLqB,QAAAA,MAAM,EAAE,CAAC,KAAKtB,UAAL,CAAgBe,CAAhB,CAAD,EAAqB,CAArB,CADH;AAELQ,QAAAA,KAAK,EAAE,KAAKvB,UAAL,CAAgBmB,SAAhB,EAFF;AAGLlB,QAAAA,CAAC,EAADA;AAHK,OAAP;AAKD;;;WAED,sCAA6B;AAAA,UAALA,CAAK,SAALA,CAAK;AAAA,UACnBc,CADmB,GACb,KAAKlB,OADQ,CACnBkB,CADmB;AAG3B,aAAO;AACLO,QAAAA,MAAM,EAAE,CAAC,CAAD,EAAI,KAAKtB,UAAL,CAAgBC,CAAhB,CAAJ,CADH;AAELuB,QAAAA,MAAM,EAAE,KAAKxB,UAAL,CAAgBmB,SAAhB,EAFH;AAGLJ,QAAAA,CAAC,EAADA;AAHK,OAAP;AAKD;;;WAED,kBAAS;AACP,UAAMU,OAAO,GAAG,KAAKA,OAArB;AACA,WAAKzB,UAAL,GAAkB,KAAK0B,aAAL,EAAlB;AACA,0BAAO,gCAAC,OAAD;AAAS,QAAA,MAAM,EAAC,GAAhB;AAAoB,QAAA,gBAAgB,EAAC,QAArC;AAA8C,QAAA,UAAU,EAAE,KAAK1B;AAA/D,QAAP;AACD;;;EAtDwB2B,e;;iCAArB/B,Y,iBACiB,U;iCADjBA,Y,WAGWgC,K;AAsDjB,IAAMjB,QAAQ,GAAG,+BAAcf,YAAd,EAA4B;AAC3CgB,EAAAA,GAAG,EAAHA,eAD2C;AAE3CI,EAAAA,aAAa,EAAbA;AAF2C,CAA5B,CAAjB;eAKeL,Q","sourcesContent":["import React from 'react';\nimport { Component } from '@semcore/core';\nimport getOriginChildren from '@semcore/utils/lib/getOriginChildren';\nimport createElement from './createElement';\nimport Bar from './Bar';\nimport HorizontalBar from './HorizontalBar';\n\nimport style from './style/bar.shadow.css';\n\nclass GroupBarRoot extends Component {\n static displayName = 'GroupBar';\n\n static style = style;\n\n getScaleGroup() {\n const { Children, scale, scaleGroup, x } = this.asProps;\n // TODO: классный костыль =)\n const xyScale = x ? scale[0] : scale[1];\n\n if (scaleGroup) return scaleGroup;\n\n const domain = React.Children.toArray(getOriginChildren(Children)).reduce((acc, child) => {\n if (React.isValidElement(child) && child.type === GroupBar.Bar) {\n acc.push(child.props.y);\n }\n if (React.isValidElement(child) && child.type === GroupBar.HorizontalBar) {\n acc.push(child.props.x);\n }\n return acc;\n }, []);\n\n return xyScale\n .copy()\n .range([0, xyScale.bandwidth()])\n .domain(domain)\n .paddingInner(xyScale.paddingOuter())\n .paddingOuter(0);\n }\n\n getBarProps({ y }) {\n const { x } = this.asProps;\n\n return {\n offset: [this.scaleGroup(y), 0],\n width: this.scaleGroup.bandwidth(),\n x,\n };\n }\n\n getHorizontalBarProps({ x }) {\n const { y } = this.asProps;\n\n return {\n offset: [0, this.scaleGroup(x)],\n height: this.scaleGroup.bandwidth(),\n y,\n };\n }\n\n render() {\n const Element = this.Element;\n this.scaleGroup = this.getScaleGroup();\n return <Element render=\"g\" childrenPosition=\"inside\" scaleGroup={this.scaleGroup} />;\n }\n}\n\nconst GroupBar = createElement(GroupBarRoot, {\n Bar,\n HorizontalBar,\n});\n\nexport default GroupBar;\n"],"file":"GroupBar.js"}
|