victory-chart 36.9.2 → 37.0.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.
@@ -1,79 +1,77 @@
1
1
  import _defaults from "lodash/defaults";
2
-
3
2
  /* eslint-disable no-use-before-define */
3
+
4
4
  import React from "react";
5
5
  import { Helpers, Scale, Axis, Wrapper } from "victory-core";
6
- var fallbackProps = {
6
+ const fallbackProps = {
7
7
  width: 450,
8
8
  height: 300,
9
9
  padding: 50
10
10
  };
11
-
12
11
  function getAxisProps(child, props, calculatedProps) {
13
- var domain = calculatedProps.domain,
14
- scale = calculatedProps.scale,
15
- stringMap = calculatedProps.stringMap,
16
- categories = calculatedProps.categories,
17
- horizontal = calculatedProps.horizontal;
12
+ const {
13
+ domain,
14
+ scale,
15
+ stringMap,
16
+ categories,
17
+ horizontal
18
+ } = calculatedProps;
18
19
  return {
19
- stringMap: stringMap,
20
- horizontal: horizontal,
21
- categories: categories,
20
+ stringMap,
21
+ horizontal,
22
+ categories,
22
23
  startAngle: props.startAngle,
23
24
  endAngle: props.endAngle,
24
25
  innerRadius: props.innerRadius,
25
- domain: domain,
26
- scale: scale
26
+ domain,
27
+ scale
27
28
  };
28
29
  }
29
-
30
30
  export function getBackgroundWithProps(props, calculatedProps) {
31
- var backgroundElement = props.backgroundComponent;
32
- var height = props.polar ? calculatedProps.range.y[1] : calculatedProps.range.y[0] - calculatedProps.range.y[1];
33
- var width = calculatedProps.range.x[1] - calculatedProps.range.x[0];
34
- var xScale = props.horizontal ? calculatedProps.scale.y.range()[0] : calculatedProps.scale.x.range()[0];
35
- var yScale = props.horizontal ? calculatedProps.scale.x.range()[1] : calculatedProps.scale.y.range()[1];
36
- var xCoordinate = props.polar ? calculatedProps.origin.x : xScale;
37
- var yCoordinate = props.polar ? calculatedProps.origin.y : yScale;
38
- var parentName = props.name || "chart";
39
- var backgroundProps = {
40
- height: height,
31
+ const backgroundElement = props.backgroundComponent;
32
+ const height = props.polar ? calculatedProps.range.y[1] : calculatedProps.range.y[0] - calculatedProps.range.y[1];
33
+ const width = calculatedProps.range.x[1] - calculatedProps.range.x[0];
34
+ const xScale = props.horizontal ? calculatedProps.scale.y.range()[0] : calculatedProps.scale.x.range()[0];
35
+ const yScale = props.horizontal ? calculatedProps.scale.x.range()[1] : calculatedProps.scale.y.range()[1];
36
+ const xCoordinate = props.polar ? calculatedProps.origin.x : xScale;
37
+ const yCoordinate = props.polar ? calculatedProps.origin.y : yScale;
38
+ const parentName = props.name || "chart";
39
+ const backgroundProps = {
40
+ height,
41
41
  polar: props.polar,
42
42
  scale: calculatedProps.scale,
43
43
  style: props.style.background,
44
44
  x: xCoordinate,
45
45
  y: yCoordinate,
46
- key: "".concat(parentName, "-background"),
47
- width: width
46
+ key: `${parentName}-background`,
47
+ width
48
48
  };
49
49
  return /*#__PURE__*/React.cloneElement(backgroundElement, _defaults({}, backgroundElement.props, backgroundProps));
50
50
  }
51
-
52
51
  function getChildProps(child, props, calculatedProps) {
53
- var axisChild = Axis.findAxisComponents([child]);
54
-
52
+ const axisChild = Axis.findAxisComponents([child]);
55
53
  if (axisChild.length > 0) {
56
54
  return getAxisProps(axisChild[0], props, calculatedProps);
57
55
  }
58
-
59
- var categories = calculatedProps.categories,
60
- domain = calculatedProps.domain,
61
- range = calculatedProps.range,
62
- scale = calculatedProps.scale,
63
- stringMap = calculatedProps.stringMap,
64
- horizontal = calculatedProps.horizontal;
56
+ const {
57
+ categories,
58
+ domain,
59
+ range,
60
+ scale,
61
+ stringMap,
62
+ horizontal
63
+ } = calculatedProps;
65
64
  return {
66
- categories: categories,
67
- domain: domain,
68
- range: range,
69
- scale: scale,
70
- stringMap: stringMap,
71
- horizontal: horizontal
65
+ categories,
66
+ domain,
67
+ range,
68
+ scale,
69
+ stringMap,
70
+ horizontal
72
71
  };
73
72
  }
74
-
75
73
  function getStyles(props) {
76
- var styleProps = props.style && props.style.parent;
74
+ const styleProps = props.style && props.style.parent;
77
75
  return {
78
76
  parent: _defaults({}, styleProps, {
79
77
  height: "100%",
@@ -82,123 +80,121 @@ function getStyles(props) {
82
80
  })
83
81
  };
84
82
  }
85
-
86
83
  export function getCalculatedProps(initialProps, childComponents) {
87
- var style = getStyles(initialProps);
88
- var props = Helpers.modifyProps(initialProps, fallbackProps, "chart");
89
- var horizontal = props.horizontal,
90
- polar = props.polar;
91
- var allStrings = Wrapper.getStringsFromChildren(props, childComponents);
92
- var categories = Wrapper.getCategories(props, childComponents, allStrings);
93
- var stringMap = createStringMap(props, childComponents, allStrings);
94
- var domain = {
84
+ const style = getStyles(initialProps);
85
+ const props = Helpers.modifyProps(initialProps, fallbackProps, "chart");
86
+ const {
87
+ horizontal,
88
+ polar
89
+ } = props;
90
+ const allStrings = Wrapper.getStringsFromChildren(props, childComponents);
91
+ const categories = Wrapper.getCategories(props, childComponents, allStrings);
92
+ const stringMap = createStringMap(props, childComponents, allStrings);
93
+ const domain = {
95
94
  x: getDomain(Object.assign({}, props, {
96
- categories: categories
95
+ categories
97
96
  }), "x", childComponents),
98
97
  y: getDomain(Object.assign({}, props, {
99
- categories: categories
98
+ categories
100
99
  }), "y", childComponents)
101
100
  };
102
- var range = {
101
+ const range = {
103
102
  x: Helpers.getRange(props, "x"),
104
103
  y: Helpers.getRange(props, "y")
105
104
  };
106
- var baseScale = {
105
+ const baseScale = {
107
106
  x: Scale.getScaleFromProps(props, "x") || Wrapper.getScale(props, "x"),
108
107
  y: Scale.getScaleFromProps(props, "y") || Wrapper.getScale(props, "y")
109
108
  };
110
- var scale = {
109
+ const scale = {
111
110
  x: baseScale.x.domain(domain.x).range(horizontal ? range.y : range.x),
112
111
  y: baseScale.y.domain(domain.y).range(horizontal ? range.x : range.y)
113
112
  };
114
- var origin = polar ? Helpers.getPolarOrigin(props) : Axis.getOrigin(domain);
115
- var padding = Helpers.getPadding(props);
113
+ const origin = polar ? Helpers.getPolarOrigin(props) : Axis.getOrigin(domain);
114
+ const padding = Helpers.getPadding(props);
116
115
  return {
117
- categories: categories,
118
- domain: domain,
119
- range: range,
120
- horizontal: horizontal,
121
- scale: scale,
122
- stringMap: stringMap,
123
- style: style,
124
- origin: origin,
125
- padding: padding
116
+ categories,
117
+ domain,
118
+ range,
119
+ horizontal,
120
+ scale,
121
+ stringMap,
122
+ style,
123
+ origin,
124
+ padding
126
125
  };
127
126
  }
128
127
  export function getChildren(props, childComponents, calculatedProps) {
129
- var children = childComponents || getChildComponents(props);
130
- var newCalculatedProps = calculatedProps || getCalculatedProps(props, children);
131
- var baseStyle = newCalculatedProps.style.parent;
132
- var height = props.height,
133
- polar = props.polar,
134
- theme = props.theme,
135
- width = props.width;
136
- var origin = newCalculatedProps.origin,
137
- horizontal = newCalculatedProps.horizontal;
138
- var parentName = props.name || "chart";
139
- return children.filter(React.isValidElement).map(function (child, index) {
140
- var role = child.type && child.type.role;
141
- var style = Array.isArray(child.props.style) ? child.props.style : _defaults({}, child.props.style, {
128
+ const children = childComponents || getChildComponents(props);
129
+ const newCalculatedProps = calculatedProps || getCalculatedProps(props, children);
130
+ const baseStyle = newCalculatedProps.style.parent;
131
+ const {
132
+ height,
133
+ polar,
134
+ theme,
135
+ width
136
+ } = props;
137
+ const {
138
+ origin,
139
+ horizontal
140
+ } = newCalculatedProps;
141
+ const parentName = props.name || "chart";
142
+ return children.filter(React.isValidElement).map((child, index) => {
143
+ const role = child.type && child.type.role;
144
+ const style = Array.isArray(child.props.style) ? child.props.style : _defaults({}, child.props.style, {
142
145
  parent: baseStyle
143
146
  });
144
- var childProps = getChildProps(child, props, newCalculatedProps);
145
- var name = child.props.name || "".concat(parentName, "-").concat(role, "-").concat(index);
146
-
147
- var newProps = _defaults({
148
- horizontal: horizontal,
149
- height: height,
150
- polar: polar,
151
- theme: theme,
152
- width: width,
153
- style: style,
154
- name: name,
147
+ const childProps = getChildProps(child, props, newCalculatedProps);
148
+ const name = child.props.name || `${parentName}-${role}-${index}`;
149
+ const newProps = _defaults({
150
+ horizontal,
151
+ height,
152
+ polar,
153
+ theme,
154
+ width,
155
+ style,
156
+ name,
155
157
  origin: polar ? origin : undefined,
156
158
  padding: newCalculatedProps.padding,
157
- key: "".concat(name, "-key-").concat(index),
159
+ key: `${name}-key-${index}`,
158
160
  standalone: false
159
161
  }, childProps);
160
-
161
162
  return /*#__PURE__*/React.cloneElement(child, newProps);
162
163
  });
163
164
  }
164
- export var getChildComponents = function (props, defaultAxes) {
165
- var childComponents = React.Children.toArray(props.children);
166
-
165
+ export const getChildComponents = (props, defaultAxes) => {
166
+ let childComponents = React.Children.toArray(props.children);
167
167
  if (childComponents.length === 0) {
168
168
  childComponents.push(defaultAxes.independent, defaultAxes.dependent);
169
169
  } else {
170
- var axisComponents = {
170
+ const axisComponents = {
171
171
  dependent: Axis.getAxisComponentsWithParent(childComponents, "dependent"),
172
172
  independent: Axis.getAxisComponentsWithParent(childComponents, "independent")
173
173
  };
174
-
175
174
  if (axisComponents.dependent.length === 0 && axisComponents.independent.length === 0) {
176
175
  childComponents = props.prependDefaultAxes ? [defaultAxes.independent, defaultAxes.dependent].concat(childComponents) : childComponents.concat([defaultAxes.independent, defaultAxes.dependent]);
177
176
  }
178
177
  }
179
-
180
178
  return childComponents;
181
179
  };
182
-
183
- var getDomain = function (props, axis, childComponents) {
184
- var children = childComponents || React.Children.toArray(props.children);
185
- var domain = Wrapper.getDomain(props, axis, children);
186
- var axisComponent = Axis.getAxisComponent(children, axis);
187
- var invertDomain = axisComponent && axisComponent.props && axisComponent.props.invertAxis;
180
+ const getDomain = (props, axis, childComponents) => {
181
+ const children = childComponents || React.Children.toArray(props.children);
182
+ const domain = Wrapper.getDomain(props, axis, children);
183
+ const axisComponent = Axis.getAxisComponent(children, axis);
184
+ const invertDomain = axisComponent && axisComponent.props && axisComponent.props.invertAxis;
188
185
  return invertDomain ? domain.concat().reverse() : domain;
189
186
  };
190
-
191
- var createStringMap = function (props, childComponents, allStrings) {
192
- var x = !allStrings.x || allStrings.x.length === 0 ? null : allStrings.x.reduce(function (memo, string, index) {
187
+ const createStringMap = (props, childComponents, allStrings) => {
188
+ const x = !allStrings.x || allStrings.x.length === 0 ? null : allStrings.x.reduce((memo, string, index) => {
193
189
  memo[string] = index + 1;
194
190
  return memo;
195
191
  }, {});
196
- var y = !allStrings.y || allStrings.y.length === 0 ? null : allStrings.y.reduce(function (memo, string, index) {
192
+ const y = !allStrings.y || allStrings.y.length === 0 ? null : allStrings.y.reduce((memo, string, index) => {
197
193
  memo[string] = index + 1;
198
194
  return memo;
199
195
  }, {});
200
196
  return {
201
- x: x,
202
- y: y
197
+ x,
198
+ y
203
199
  };
204
200
  };
@@ -1,12 +1,5 @@
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
-
10
3
  import React from "react";
11
4
  import { Background, Helpers, Hooks, UserProps, VictoryContainer, VictoryTheme, Wrapper } from "victory-core";
12
5
  import { VictorySharedEvents } from "victory-shared-events";
@@ -14,12 +7,12 @@ import { VictoryAxis } from "victory-axis";
14
7
  import { VictoryPolarAxis } from "victory-polar-axis";
15
8
  import { getBackgroundWithProps, getChildComponents, getCalculatedProps, getChildren } from "./helper-methods";
16
9
  import isEqual from "react-fast-compare";
17
- var fallbackProps = {
10
+ const fallbackProps = {
18
11
  width: 450,
19
12
  height: 300,
20
13
  padding: 50
21
14
  };
22
- var defaultProps = {
15
+ const defaultProps = {
23
16
  backgroundComponent: /*#__PURE__*/React.createElement(Background, null),
24
17
  containerComponent: /*#__PURE__*/React.createElement(VictoryContainer, null),
25
18
  defaultAxes: {
@@ -38,103 +31,96 @@ var defaultProps = {
38
31
  standalone: true,
39
32
  theme: VictoryTheme.grayscale
40
33
  };
41
-
42
- var VictoryChartImpl = function (initialProps) {
43
- var propsWithDefaults = React.useMemo(function () {
44
- return _objectSpread(_objectSpread({}, defaultProps), initialProps);
45
- }, [initialProps]);
46
- var role = "chart";
47
-
48
- var _Hooks$useAnimationSt = Hooks.useAnimationState(),
49
- getAnimationProps = _Hooks$useAnimationSt.getAnimationProps,
50
- setAnimationState = _Hooks$useAnimationSt.setAnimationState,
51
- getProps = _Hooks$useAnimationSt.getProps;
52
-
53
- var props = getProps(propsWithDefaults);
54
- var modifiedProps = Helpers.modifyProps(props, fallbackProps, role);
55
- var desc = modifiedProps.desc,
56
- eventKey = modifiedProps.eventKey,
57
- containerComponent = modifiedProps.containerComponent,
58
- standalone = modifiedProps.standalone,
59
- groupComponent = modifiedProps.groupComponent,
60
- externalEventMutations = modifiedProps.externalEventMutations,
61
- width = modifiedProps.width,
62
- height = modifiedProps.height,
63
- theme = modifiedProps.theme,
64
- polar = modifiedProps.polar,
65
- name = modifiedProps.name,
66
- title = modifiedProps.title;
67
- var axes = props.polar ? modifiedProps.defaultPolarAxes : modifiedProps.defaultAxes;
68
- var childComponents = React.useMemo(function () {
69
- return getChildComponents(modifiedProps, axes);
70
- }, [modifiedProps, axes]);
71
- var calculatedProps = React.useMemo(function () {
72
- return getCalculatedProps(modifiedProps, childComponents);
73
- }, [modifiedProps, childComponents]);
74
- var domain = calculatedProps.domain,
75
- scale = calculatedProps.scale,
76
- style = calculatedProps.style,
77
- origin = calculatedProps.origin,
78
- horizontal = calculatedProps.horizontal;
79
- var newChildren = React.useMemo(function () {
80
- var children = getChildren(props, childComponents, calculatedProps);
81
- var mappedChildren = children.map(function (child, index) {
82
- var childProps = Object.assign({
34
+ const VictoryChartImpl = initialProps => {
35
+ const propsWithDefaults = React.useMemo(() => ({
36
+ ...defaultProps,
37
+ ...initialProps
38
+ }), [initialProps]);
39
+ const role = "chart";
40
+ const {
41
+ getAnimationProps,
42
+ setAnimationState,
43
+ getProps
44
+ } = Hooks.useAnimationState();
45
+ const props = getProps(propsWithDefaults);
46
+ const modifiedProps = Helpers.modifyProps(props, fallbackProps, role);
47
+ const {
48
+ desc,
49
+ eventKey,
50
+ containerComponent,
51
+ standalone,
52
+ groupComponent,
53
+ externalEventMutations,
54
+ width,
55
+ height,
56
+ theme,
57
+ polar,
58
+ name,
59
+ title
60
+ } = modifiedProps;
61
+ const axes = props.polar ? modifiedProps.defaultPolarAxes : modifiedProps.defaultAxes;
62
+ const childComponents = React.useMemo(() => getChildComponents(modifiedProps, axes), [modifiedProps, axes]);
63
+ const calculatedProps = React.useMemo(() => getCalculatedProps(modifiedProps, childComponents), [modifiedProps, childComponents]);
64
+ const {
65
+ domain,
66
+ scale,
67
+ style,
68
+ origin,
69
+ horizontal
70
+ } = calculatedProps;
71
+ const newChildren = React.useMemo(() => {
72
+ const children = getChildren(props, childComponents, calculatedProps);
73
+ const mappedChildren = children.map((child, index) => {
74
+ const childProps = Object.assign({
83
75
  animate: getAnimationProps(props, child, index)
84
76
  }, child.props);
85
77
  return /*#__PURE__*/React.cloneElement(child, childProps);
86
78
  });
87
-
88
79
  if (props.style && props.style.background) {
89
- var backgroundComponent = getBackgroundWithProps(props, calculatedProps);
80
+ const backgroundComponent = getBackgroundWithProps(props, calculatedProps);
90
81
  mappedChildren.unshift(backgroundComponent);
91
82
  }
92
-
93
83
  return mappedChildren;
94
84
  }, [getAnimationProps, childComponents, props, calculatedProps]);
95
- var containerProps = React.useMemo(function () {
85
+ const containerProps = React.useMemo(() => {
96
86
  if (standalone) {
97
87
  return {
98
- desc: desc,
99
- domain: domain,
100
- width: width,
101
- height: height,
102
- horizontal: horizontal,
103
- name: name,
88
+ desc,
89
+ domain,
90
+ width,
91
+ height,
92
+ horizontal,
93
+ name,
104
94
  origin: polar ? origin : undefined,
105
- polar: polar,
106
- theme: theme,
107
- title: title,
108
- scale: scale,
109
- standalone: standalone,
95
+ polar,
96
+ theme,
97
+ title,
98
+ scale,
99
+ standalone,
110
100
  style: style.parent
111
101
  };
112
102
  }
113
-
114
103
  return {};
115
104
  }, [desc, domain, height, horizontal, name, origin, polar, scale, standalone, style, title, theme, width]);
116
- var container = React.useMemo(function () {
105
+ const container = React.useMemo(() => {
117
106
  if (standalone) {
118
- var defaultContainerProps = _defaults({}, containerComponent.props, containerProps, UserProps.getSafeUserProps(propsWithDefaults));
119
-
107
+ const defaultContainerProps = _defaults({}, containerComponent.props, containerProps, UserProps.getSafeUserProps(propsWithDefaults));
120
108
  return /*#__PURE__*/React.cloneElement(containerComponent, defaultContainerProps);
121
109
  }
122
-
123
110
  return groupComponent;
124
111
  }, [groupComponent, standalone, containerComponent, containerProps, propsWithDefaults]);
125
- var events = React.useMemo(function () {
112
+ const events = React.useMemo(() => {
126
113
  return Wrapper.getAllEvents(props);
127
114
  }, [props]);
128
- var previousProps = Hooks.usePreviousProps(propsWithDefaults);
129
- React.useEffect(function () {
115
+ const previousProps = Hooks.usePreviousProps(propsWithDefaults);
116
+ React.useEffect(() => {
130
117
  // This is called before dismount to keep state in sync
131
- return function () {
118
+ return () => {
132
119
  if (propsWithDefaults.animate) {
133
120
  setAnimationState(previousProps, propsWithDefaults);
134
121
  }
135
122
  };
136
123
  }, [setAnimationState, previousProps, propsWithDefaults]);
137
-
138
124
  if (!_isEmpty(events)) {
139
125
  return /*#__PURE__*/React.createElement(VictorySharedEvents, {
140
126
  container: container,
@@ -143,11 +129,9 @@ var VictoryChartImpl = function (initialProps) {
143
129
  externalEventMutations: externalEventMutations
144
130
  }, newChildren);
145
131
  }
146
-
147
132
  return /*#__PURE__*/React.cloneElement(container, container.props, newChildren);
148
133
  };
149
-
150
- export var VictoryChart = /*#__PURE__*/React.memo(VictoryChartImpl, isEqual);
151
- VictoryChart.displayName = "VictoryChart"; // @ts-expect-error FIXME: Does this "expectedComponents" do anything?
152
-
134
+ export const VictoryChart = /*#__PURE__*/React.memo(VictoryChartImpl, isEqual);
135
+ VictoryChart.displayName = "VictoryChart";
136
+ // @ts-expect-error FIXME: Does this "expectedComponents" do anything?
153
137
  VictoryChart.expectedComponents = ["groupComponent", "containerComponent"];