victory-stack 36.9.2-next.0 → 36.9.2-next.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +7 -3
- package/dist/victory-stack.js +3507 -2961
- package/dist/victory-stack.min.js +1 -1
- package/es/helper-methods.js +162 -117
- package/es/victory-stack.js +72 -61
- package/lib/helper-methods.js +178 -117
- package/lib/index.js +2 -0
- package/lib/victory-stack.js +91 -60
- package/package.json +5 -5
- package/src/helper-methods.tsx +2 -2
package/es/helper-methods.js
CHANGED
|
@@ -1,54 +1,78 @@
|
|
|
1
1
|
import _orderBy from "lodash/orderBy";
|
|
2
|
-
|
|
3
|
-
|
|
2
|
+
|
|
3
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
4
|
+
|
|
5
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
6
|
+
|
|
7
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
8
|
+
|
|
9
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
10
|
+
|
|
11
|
+
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
12
|
+
|
|
13
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
14
|
+
|
|
15
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
16
|
+
|
|
17
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
18
|
+
|
|
19
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
20
|
+
|
|
4
21
|
import React from "react";
|
|
5
22
|
import { Helpers, Scale, Wrapper } from "victory-core";
|
|
6
23
|
import isEqual from "react-fast-compare";
|
|
7
|
-
|
|
24
|
+
var fallbackProps = {
|
|
8
25
|
width: 450,
|
|
9
26
|
height: 300,
|
|
10
27
|
padding: 50
|
|
11
|
-
};
|
|
28
|
+
}; // Assumes data in `datasets` is sorted by `Data.getData`.
|
|
12
29
|
|
|
13
|
-
// Assumes data in `datasets` is sorted by `Data.getData`.
|
|
14
30
|
function fillData(props, datasets) {
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
const xMap = datasets.reduce((prev, dataset) => {
|
|
19
|
-
dataset.forEach(datum => {
|
|
31
|
+
var fillInMissingData = props.fillInMissingData;
|
|
32
|
+
var xMap = datasets.reduce(function (prev, dataset) {
|
|
33
|
+
dataset.forEach(function (datum) {
|
|
20
34
|
prev[datum._x instanceof Date ? datum._x.getTime() : datum._x] = true;
|
|
21
35
|
});
|
|
22
36
|
return prev;
|
|
23
37
|
}, {});
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
38
|
+
var xKeys = Object.keys(xMap).map(function (k) {
|
|
39
|
+
return Number(k);
|
|
40
|
+
});
|
|
41
|
+
|
|
42
|
+
var xArr = _orderBy(xKeys);
|
|
43
|
+
|
|
44
|
+
return datasets.map(function (dataset) {
|
|
45
|
+
var indexOffset = 0;
|
|
46
|
+
var isDate = dataset[0] && dataset[0]._x instanceof Date;
|
|
47
|
+
var filledInData = xArr.map(function (x, index) {
|
|
48
|
+
var parsedX = Number(x);
|
|
49
|
+
var datum = dataset[index - indexOffset];
|
|
50
|
+
|
|
32
51
|
if (datum) {
|
|
33
|
-
|
|
52
|
+
var x1 = isDate ? datum._x.getTime() : datum._x;
|
|
53
|
+
|
|
34
54
|
if (x1 === parsedX) {
|
|
35
55
|
return datum;
|
|
36
56
|
}
|
|
57
|
+
|
|
37
58
|
indexOffset++;
|
|
38
|
-
|
|
59
|
+
|
|
60
|
+
var _y = fillInMissingData ? 0 : null;
|
|
61
|
+
|
|
39
62
|
parsedX = isDate ? new Date(parsedX) : parsedX;
|
|
40
63
|
return {
|
|
41
64
|
x: parsedX,
|
|
42
|
-
y,
|
|
65
|
+
y: _y,
|
|
43
66
|
_x: parsedX,
|
|
44
|
-
_y:
|
|
67
|
+
_y: _y
|
|
45
68
|
};
|
|
46
69
|
}
|
|
47
|
-
|
|
70
|
+
|
|
71
|
+
var y = fillInMissingData ? 0 : null;
|
|
48
72
|
parsedX = isDate ? new Date(parsedX) : parsedX;
|
|
49
73
|
return {
|
|
50
74
|
x: parsedX,
|
|
51
|
-
y,
|
|
75
|
+
y: y,
|
|
52
76
|
_x: parsedX,
|
|
53
77
|
_y: y
|
|
54
78
|
};
|
|
@@ -56,29 +80,40 @@ function fillData(props, datasets) {
|
|
|
56
80
|
return filledInData;
|
|
57
81
|
});
|
|
58
82
|
}
|
|
83
|
+
|
|
59
84
|
function getY0(datum, index, datasets) {
|
|
60
85
|
if (datum.y0) {
|
|
61
86
|
return datum.y0;
|
|
62
87
|
}
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
88
|
+
|
|
89
|
+
var y = datum._y;
|
|
90
|
+
var group = datum._group;
|
|
91
|
+
var firstDatasetBaseline = datasets[0].map(function (d) {
|
|
92
|
+
return d.y0;
|
|
93
|
+
});
|
|
94
|
+
var previousDatasets = datasets.slice(0, index);
|
|
95
|
+
var previousPoints = previousDatasets.reduce(function (prev, dataset) {
|
|
96
|
+
return prev.concat(dataset.filter(function (previousDatum) {
|
|
97
|
+
return datum._x instanceof Date ? previousDatum._x.getTime() === datum._x.getTime() : previousDatum._x === datum._x;
|
|
98
|
+
}).map(function (previousDatum) {
|
|
99
|
+
return previousDatum._y || 0;
|
|
100
|
+
}));
|
|
69
101
|
}, []);
|
|
70
|
-
|
|
71
|
-
|
|
102
|
+
var y0 = previousPoints.length && previousPoints.reduce(function (memo, value) {
|
|
103
|
+
var sameSign = y < 0 && value < 0 || y >= 0 && value >= 0;
|
|
72
104
|
return sameSign ? Number(value) + memo : memo;
|
|
73
105
|
}, firstDatasetBaseline[group] || 0);
|
|
74
|
-
return previousPoints.some(
|
|
106
|
+
return previousPoints.some(function (point) {
|
|
107
|
+
return point instanceof Date;
|
|
108
|
+
}) ? new Date(y0) : y0;
|
|
75
109
|
}
|
|
76
|
-
|
|
77
110
|
/* eslint-disable no-nested-ternary */
|
|
111
|
+
|
|
112
|
+
|
|
78
113
|
function addLayoutData(props, datasets, index) {
|
|
79
|
-
|
|
80
|
-
return datasets[index].map(datum
|
|
81
|
-
|
|
114
|
+
var xOffset = props.xOffset || 0;
|
|
115
|
+
return datasets[index].map(function (datum) {
|
|
116
|
+
var yOffset = getY0(datum, index, datasets) || 0;
|
|
82
117
|
return Object.assign({}, datum, {
|
|
83
118
|
_y0: !(datum._y instanceof Date) ? yOffset : yOffset ? new Date(yOffset) : datum._y,
|
|
84
119
|
_y1: datum._y === null ? null : datum._y instanceof Date ? new Date(Number(datum._y) + Number(yOffset)) : datum._y + yOffset,
|
|
@@ -88,152 +123,162 @@ function addLayoutData(props, datasets, index) {
|
|
|
88
123
|
}
|
|
89
124
|
/* eslint-enable no-nested-ternary */
|
|
90
125
|
|
|
126
|
+
|
|
91
127
|
function stackData(props, childComponents) {
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
128
|
+
var dataFromChildren = Wrapper.getDataFromChildren(props, childComponents);
|
|
129
|
+
var filterNullChildData = dataFromChildren.map(function (dataset) {
|
|
130
|
+
return dataset.filter(function (datum) {
|
|
131
|
+
return datum._x !== null && datum._y !== null;
|
|
132
|
+
});
|
|
133
|
+
});
|
|
134
|
+
var datasets = fillData(props, filterNullChildData);
|
|
135
|
+
return datasets.map(function (d, i) {
|
|
136
|
+
return addLayoutData(props, datasets, i);
|
|
137
|
+
});
|
|
96
138
|
}
|
|
139
|
+
|
|
97
140
|
export function getCalculatedProps(initialProps, childComponents) {
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
141
|
+
var children = childComponents || React.Children.toArray(initialProps.children);
|
|
142
|
+
var role = "stack";
|
|
143
|
+
var props = Helpers.modifyProps(initialProps, fallbackProps, role);
|
|
144
|
+
var style = Wrapper.getStyle(props.theme, props.style, role);
|
|
145
|
+
var categories = props.categories || Wrapper.getCategories(props, children);
|
|
146
|
+
var datasets = props.datasets || stackData(props, children);
|
|
147
|
+
var clonedChildren = children.map(function (c, i) {
|
|
105
148
|
return /*#__PURE__*/React.cloneElement(c, {
|
|
106
149
|
data: datasets[i]
|
|
107
150
|
});
|
|
108
151
|
});
|
|
109
|
-
|
|
152
|
+
var domain = {
|
|
110
153
|
x: Wrapper.getDomain(Object.assign({}, props, {
|
|
111
|
-
categories
|
|
154
|
+
categories: categories
|
|
112
155
|
}), "x", clonedChildren),
|
|
113
156
|
y: Wrapper.getDomain(Object.assign({}, props, {
|
|
114
|
-
categories
|
|
157
|
+
categories: categories
|
|
115
158
|
}), "y", clonedChildren)
|
|
116
159
|
};
|
|
117
|
-
|
|
160
|
+
var range = props.range || {
|
|
118
161
|
x: Helpers.getRange(props, "x"),
|
|
119
162
|
y: Helpers.getRange(props, "y")
|
|
120
163
|
};
|
|
121
|
-
|
|
164
|
+
var baseScale = {
|
|
122
165
|
x: Scale.getScaleFromProps(props, "x") || Wrapper.getScale(props, "x"),
|
|
123
166
|
y: Scale.getScaleFromProps(props, "y") || Wrapper.getScale(props, "y")
|
|
124
167
|
};
|
|
125
|
-
|
|
168
|
+
var scale = {
|
|
126
169
|
x: baseScale.x.domain(domain.x).range(props.horizontal ? range.y : range.x),
|
|
127
170
|
y: baseScale.y.domain(domain.y).range(props.horizontal ? range.x : range.y)
|
|
128
171
|
};
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
horizontal
|
|
132
|
-
} = props;
|
|
172
|
+
var colorScale = props.colorScale,
|
|
173
|
+
horizontal = props.horizontal;
|
|
133
174
|
return {
|
|
134
|
-
datasets,
|
|
135
|
-
categories,
|
|
136
|
-
range,
|
|
137
|
-
domain,
|
|
138
|
-
horizontal,
|
|
139
|
-
scale,
|
|
140
|
-
style,
|
|
141
|
-
colorScale,
|
|
142
|
-
role
|
|
175
|
+
datasets: datasets,
|
|
176
|
+
categories: categories,
|
|
177
|
+
range: range,
|
|
178
|
+
domain: domain,
|
|
179
|
+
horizontal: horizontal,
|
|
180
|
+
scale: scale,
|
|
181
|
+
style: style,
|
|
182
|
+
colorScale: colorScale,
|
|
183
|
+
role: role
|
|
143
184
|
};
|
|
144
|
-
}
|
|
145
|
-
|
|
146
|
-
// We need to remove sharedEvents in order to memoize the calculated data
|
|
185
|
+
} // We need to remove sharedEvents in order to memoize the calculated data
|
|
147
186
|
// With shared events, the props change on every event, and every value is re-calculated
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
return {
|
|
155
|
-
...child,
|
|
187
|
+
|
|
188
|
+
var withoutSharedEvents = function (props) {
|
|
189
|
+
var children = props.children;
|
|
190
|
+
var modifiedChildren = React.Children.toArray(children).map(function (_child) {
|
|
191
|
+
var child = _child;
|
|
192
|
+
return _objectSpread(_objectSpread({}, child), {}, {
|
|
156
193
|
props: Helpers.omit(child.props, ["sharedEvents"])
|
|
157
|
-
};
|
|
194
|
+
});
|
|
158
195
|
});
|
|
159
196
|
props.children = modifiedChildren;
|
|
160
197
|
return props;
|
|
161
198
|
};
|
|
199
|
+
|
|
162
200
|
export function useMemoizedProps(initialProps) {
|
|
163
|
-
|
|
164
|
-
const [props, setProps] = React.useState(modifiedProps);
|
|
201
|
+
var modifiedProps = withoutSharedEvents(initialProps);
|
|
165
202
|
|
|
166
|
-
|
|
203
|
+
var _React$useState = React.useState(modifiedProps),
|
|
204
|
+
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
205
|
+
props = _React$useState2[0],
|
|
206
|
+
setProps = _React$useState2[1]; // React.memo uses shallow equality to compare objects. This way props
|
|
167
207
|
// will only be re-calculated when they change.
|
|
168
|
-
|
|
208
|
+
|
|
209
|
+
|
|
210
|
+
React.useEffect(function () {
|
|
169
211
|
if (!isEqual(modifiedProps, props)) {
|
|
170
212
|
setProps(modifiedProps);
|
|
171
213
|
}
|
|
172
214
|
}, [props, setProps, modifiedProps]);
|
|
173
|
-
return React.useMemo(()
|
|
215
|
+
return React.useMemo(function () {
|
|
174
216
|
return getCalculatedProps(props, props.children);
|
|
175
217
|
}, [props]);
|
|
176
218
|
}
|
|
219
|
+
|
|
177
220
|
function getLabels(props, datasets, index) {
|
|
178
221
|
if (!props.labels) {
|
|
179
222
|
return undefined;
|
|
180
223
|
}
|
|
224
|
+
|
|
181
225
|
return datasets.length === index + 1 ? props.labels : undefined;
|
|
182
226
|
}
|
|
227
|
+
|
|
183
228
|
export function getChildProps(props, calculatedProps) {
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
horizontal
|
|
190
|
-
} = calculatedProps;
|
|
229
|
+
var categories = calculatedProps.categories,
|
|
230
|
+
domain = calculatedProps.domain,
|
|
231
|
+
range = calculatedProps.range,
|
|
232
|
+
scale = calculatedProps.scale,
|
|
233
|
+
horizontal = calculatedProps.horizontal;
|
|
191
234
|
return {
|
|
192
235
|
height: props.height,
|
|
193
236
|
width: props.width,
|
|
194
237
|
padding: Helpers.getPadding(props),
|
|
195
238
|
standalone: false,
|
|
196
239
|
theme: props.theme,
|
|
197
|
-
categories,
|
|
198
|
-
domain,
|
|
199
|
-
range,
|
|
200
|
-
scale,
|
|
201
|
-
horizontal
|
|
240
|
+
categories: categories,
|
|
241
|
+
domain: domain,
|
|
242
|
+
range: range,
|
|
243
|
+
scale: scale,
|
|
244
|
+
horizontal: horizontal
|
|
202
245
|
};
|
|
203
246
|
}
|
|
247
|
+
|
|
204
248
|
function getColorScale(props, child) {
|
|
205
|
-
|
|
206
|
-
|
|
249
|
+
var role = child.type && child.type.role;
|
|
250
|
+
var colorScaleOptions = child.props.colorScale || props.colorScale;
|
|
251
|
+
|
|
207
252
|
if (role !== "group" && role !== "stack") {
|
|
208
253
|
return undefined;
|
|
209
254
|
}
|
|
255
|
+
|
|
210
256
|
return props.theme ? colorScaleOptions || props.theme.props.colorScale : colorScaleOptions;
|
|
211
257
|
}
|
|
258
|
+
|
|
212
259
|
export function getChildren(initialProps, childComponents, calculatedProps) {
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
const labels = props.labels ? getLabels(props, datasets, index) : child.props.labels;
|
|
226
|
-
const name = child.props.name || `${parentName}-${role}-${index}`;
|
|
260
|
+
var props = Helpers.modifyProps(initialProps, fallbackProps, "stack");
|
|
261
|
+
var children = childComponents || React.Children.toArray(props.children);
|
|
262
|
+
var newCalculatedProps = calculatedProps || getCalculatedProps(props, children);
|
|
263
|
+
var datasets = newCalculatedProps.datasets;
|
|
264
|
+
var childProps = getChildProps(props, newCalculatedProps);
|
|
265
|
+
var parentName = props.name || "stack";
|
|
266
|
+
return children.map(function (child, index) {
|
|
267
|
+
var role = child.type && child.type.role;
|
|
268
|
+
var data = datasets[index];
|
|
269
|
+
var style = Wrapper.getChildStyle(child, index, newCalculatedProps);
|
|
270
|
+
var labels = props.labels ? getLabels(props, datasets, index) : child.props.labels;
|
|
271
|
+
var name = child.props.name || "".concat(parentName, "-").concat(role, "-").concat(index);
|
|
227
272
|
return /*#__PURE__*/React.cloneElement(child, Object.assign({
|
|
228
|
-
key:
|
|
229
|
-
labels,
|
|
230
|
-
name,
|
|
273
|
+
key: "".concat(name, "-key-").concat(index),
|
|
274
|
+
labels: labels,
|
|
275
|
+
name: name,
|
|
231
276
|
domainPadding: child.props.domainPadding || props.domainPadding,
|
|
232
277
|
theme: props.theme,
|
|
233
278
|
labelComponent: props.labelComponent || child.props.labelComponent,
|
|
234
|
-
style,
|
|
279
|
+
style: style,
|
|
235
280
|
colorScale: getColorScale(props, child),
|
|
236
|
-
data,
|
|
281
|
+
data: data,
|
|
237
282
|
polar: props.polar
|
|
238
283
|
}, childProps));
|
|
239
284
|
});
|
package/es/victory-stack.js
CHANGED
|
@@ -1,61 +1,63 @@
|
|
|
1
1
|
import _isEmpty from "lodash/isEmpty";
|
|
2
2
|
import _defaults from "lodash/defaults";
|
|
3
|
+
|
|
4
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
5
|
+
|
|
6
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
7
|
+
|
|
8
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
9
|
+
|
|
3
10
|
import React from "react";
|
|
4
11
|
import { Helpers, Hooks, UserProps, VictoryContainer, VictoryTheme, Wrapper } from "victory-core";
|
|
5
12
|
import { VictorySharedEvents } from "victory-shared-events";
|
|
6
13
|
import { getChildren, useMemoizedProps } from "./helper-methods";
|
|
7
14
|
import isEqual from "react-fast-compare";
|
|
8
|
-
|
|
15
|
+
var fallbackProps = {
|
|
9
16
|
width: 450,
|
|
10
17
|
height: 300,
|
|
11
18
|
padding: 50
|
|
12
19
|
};
|
|
13
|
-
|
|
20
|
+
var defaultProps = {
|
|
14
21
|
containerComponent: /*#__PURE__*/React.createElement(VictoryContainer, null),
|
|
15
22
|
groupComponent: /*#__PURE__*/React.createElement("g", null),
|
|
16
23
|
standalone: true,
|
|
17
24
|
theme: VictoryTheme.grayscale,
|
|
18
25
|
fillInMissingData: true
|
|
19
26
|
};
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
} = calculatedProps;
|
|
55
|
-
const newChildren = React.useMemo(() => {
|
|
56
|
-
const children = getChildren(props, childComponents, calculatedProps);
|
|
57
|
-
const orderedChildren = children.map((child, index) => {
|
|
58
|
-
const childProps = Object.assign({
|
|
27
|
+
|
|
28
|
+
var VictoryStackBase = function (initialProps) {
|
|
29
|
+
var role = VictoryStack.role;
|
|
30
|
+
var propsWithDefaults = React.useMemo(function () {
|
|
31
|
+
return _objectSpread(_objectSpread({}, defaultProps), initialProps);
|
|
32
|
+
}, [initialProps]);
|
|
33
|
+
|
|
34
|
+
var _Hooks$useAnimationSt = Hooks.useAnimationState(),
|
|
35
|
+
setAnimationState = _Hooks$useAnimationSt.setAnimationState,
|
|
36
|
+
getAnimationProps = _Hooks$useAnimationSt.getAnimationProps,
|
|
37
|
+
getProps = _Hooks$useAnimationSt.getProps;
|
|
38
|
+
|
|
39
|
+
var props = getProps(propsWithDefaults);
|
|
40
|
+
var modifiedProps = Helpers.modifyProps(props, fallbackProps, role);
|
|
41
|
+
var eventKey = modifiedProps.eventKey,
|
|
42
|
+
containerComponent = modifiedProps.containerComponent,
|
|
43
|
+
standalone = modifiedProps.standalone,
|
|
44
|
+
groupComponent = modifiedProps.groupComponent,
|
|
45
|
+
externalEventMutations = modifiedProps.externalEventMutations,
|
|
46
|
+
width = modifiedProps.width,
|
|
47
|
+
height = modifiedProps.height,
|
|
48
|
+
theme = modifiedProps.theme,
|
|
49
|
+
polar = modifiedProps.polar,
|
|
50
|
+
horizontal = modifiedProps.horizontal,
|
|
51
|
+
name = modifiedProps.name;
|
|
52
|
+
var childComponents = React.Children.toArray(modifiedProps.children);
|
|
53
|
+
var calculatedProps = useMemoizedProps(modifiedProps);
|
|
54
|
+
var domain = calculatedProps.domain,
|
|
55
|
+
scale = calculatedProps.scale,
|
|
56
|
+
style = calculatedProps.style;
|
|
57
|
+
var newChildren = React.useMemo(function () {
|
|
58
|
+
var children = getChildren(props, childComponents, calculatedProps);
|
|
59
|
+
var orderedChildren = children.map(function (child, index) {
|
|
60
|
+
var childProps = Object.assign({
|
|
59
61
|
animate: getAnimationProps(props, child, index)
|
|
60
62
|
}, child.props);
|
|
61
63
|
return /*#__PURE__*/React.cloneElement(child, childProps);
|
|
@@ -65,45 +67,52 @@ const VictoryStackBase = initialProps => {
|
|
|
65
67
|
are rendered behind lower children. This looks nicer for stacked bars with cornerRadius, and
|
|
66
68
|
areas with strokes
|
|
67
69
|
*/
|
|
70
|
+
|
|
68
71
|
return orderedChildren.reverse();
|
|
69
72
|
}, [props, childComponents, calculatedProps, getAnimationProps]);
|
|
70
|
-
|
|
73
|
+
var containerProps = React.useMemo(function () {
|
|
71
74
|
if (standalone) {
|
|
72
75
|
return {
|
|
73
|
-
domain,
|
|
74
|
-
scale,
|
|
75
|
-
width,
|
|
76
|
-
height,
|
|
77
|
-
standalone,
|
|
78
|
-
theme,
|
|
76
|
+
domain: domain,
|
|
77
|
+
scale: scale,
|
|
78
|
+
width: width,
|
|
79
|
+
height: height,
|
|
80
|
+
standalone: standalone,
|
|
81
|
+
theme: theme,
|
|
79
82
|
style: style.parent,
|
|
80
|
-
horizontal,
|
|
81
|
-
polar,
|
|
82
|
-
name
|
|
83
|
+
horizontal: horizontal,
|
|
84
|
+
polar: polar,
|
|
85
|
+
name: name
|
|
83
86
|
};
|
|
84
87
|
}
|
|
88
|
+
|
|
85
89
|
return {};
|
|
86
90
|
}, [standalone, domain, scale, width, height, theme, style, horizontal, polar, name]);
|
|
87
|
-
|
|
88
|
-
|
|
91
|
+
var userProps = React.useMemo(function () {
|
|
92
|
+
return UserProps.getSafeUserProps(propsWithDefaults);
|
|
93
|
+
}, [propsWithDefaults]);
|
|
94
|
+
var container = React.useMemo(function () {
|
|
89
95
|
if (standalone) {
|
|
90
|
-
|
|
96
|
+
var defaultContainerProps = _defaults({}, containerComponent.props, containerProps, userProps);
|
|
97
|
+
|
|
91
98
|
return /*#__PURE__*/React.cloneElement(containerComponent, defaultContainerProps);
|
|
92
99
|
}
|
|
100
|
+
|
|
93
101
|
return /*#__PURE__*/React.cloneElement(groupComponent, userProps);
|
|
94
102
|
}, [groupComponent, standalone, containerComponent, containerProps, userProps]);
|
|
95
|
-
|
|
103
|
+
var events = React.useMemo(function () {
|
|
96
104
|
return Wrapper.getAllEvents(props);
|
|
97
105
|
}, [props]);
|
|
98
|
-
|
|
99
|
-
React.useEffect(()
|
|
106
|
+
var previousProps = Hooks.usePreviousProps(propsWithDefaults);
|
|
107
|
+
React.useEffect(function () {
|
|
100
108
|
// This is called before dismount to keep state in sync
|
|
101
|
-
return ()
|
|
109
|
+
return function () {
|
|
102
110
|
if (propsWithDefaults.animate) {
|
|
103
111
|
setAnimationState(previousProps, propsWithDefaults);
|
|
104
112
|
}
|
|
105
113
|
};
|
|
106
114
|
}, [setAnimationState, previousProps, propsWithDefaults]);
|
|
115
|
+
|
|
107
116
|
if (!_isEmpty(events)) {
|
|
108
117
|
return /*#__PURE__*/React.createElement(VictorySharedEvents, {
|
|
109
118
|
container: container,
|
|
@@ -112,12 +121,14 @@ const VictoryStackBase = initialProps => {
|
|
|
112
121
|
externalEventMutations: externalEventMutations
|
|
113
122
|
}, newChildren);
|
|
114
123
|
}
|
|
124
|
+
|
|
115
125
|
return /*#__PURE__*/React.cloneElement(container, container.props, newChildren);
|
|
116
126
|
};
|
|
117
|
-
|
|
127
|
+
|
|
128
|
+
var componentConfig = {
|
|
118
129
|
role: "stack",
|
|
119
130
|
expectedComponents: ["groupComponent", "containerComponent", "labelComponent"],
|
|
120
|
-
getChildren
|
|
131
|
+
getChildren: getChildren
|
|
121
132
|
};
|
|
122
|
-
export
|
|
133
|
+
export var VictoryStack = Object.assign( /*#__PURE__*/React.memo(VictoryStackBase, isEqual), componentConfig);
|
|
123
134
|
VictoryStack.displayName = "VictoryStack";
|