victory-chart 36.8.1 → 36.8.3

package/es/helper-methods.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 export declare function getBackgroundWithProps(props: any, calculatedProps: any): React.DetailedReactHTMLElement<any, HTMLElement>;
-export declare function getCalculatedProps(props: any, childComponents: any): {
+export declare function getCalculatedProps(initialProps: any, childComponents: any): {
     categories: {
         x: any;
         y: any;

package/es/helper-methods.js

@@ -84,12 +84,11 @@ function getStyles(props) {
   };
 }
 
-export function getCalculatedProps(props, childComponents) {
-  var style = getStyles(props);
-  props = Helpers.modifyProps(props, fallbackProps, "chart");
-  var _props = props,
-      horizontal = _props.horizontal,
-      polar = _props.polar;
+export function getCalculatedProps(initialProps, childComponents) {
+  var style = getStyles(initialProps);
+  var props = Helpers.modifyProps(initialProps, fallbackProps, "chart");
+  var horizontal = props.horizontal,
+      polar = props.polar;
   var allStrings = Wrapper.getStringsFromChildren(props, childComponents);
   var categories = Wrapper.getCategories(props, childComponents, allStrings);
   var stringMap = createStringMap(props, childComponents, allStrings);
@@ -128,23 +127,22 @@ export function getCalculatedProps(props, childComponents) {
   };
 }
 export function getChildren(props, childComponents, calculatedProps) {
-  childComponents = childComponents || getChildComponents(props);
-  calculatedProps = calculatedProps || getCalculatedProps(props, childComponents);
-  var baseStyle = calculatedProps.style.parent;
+  var children = childComponents || getChildComponents(props);
+  var newCalculatedProps = calculatedProps || getCalculatedProps(props, children);
+  var baseStyle = newCalculatedProps.style.parent;
   var height = props.height,
       polar = props.polar,
       theme = props.theme,
       width = props.width;
-  var _calculatedProps = calculatedProps,
-      origin = _calculatedProps.origin,
-      horizontal = _calculatedProps.horizontal;
+  var origin = newCalculatedProps.origin,
+      horizontal = newCalculatedProps.horizontal;
   var parentName = props.name || "chart";
-  return childComponents.filter(React.isValidElement).map(function (child, index) {
+  return children.filter(React.isValidElement).map(function (child, index) {
     var role = child.type && child.type.role;
     var style = Array.isArray(child.props.style) ? child.props.style : _defaults({}, child.props.style, {
       parent: baseStyle
     });
-    var childProps = getChildProps(child, props, calculatedProps);
+    var childProps = getChildProps(child, props, newCalculatedProps);
     var name = child.props.name || "".concat(parentName, "-").concat(role, "-").concat(index);
 
     var newProps = _defaults({
@@ -156,7 +154,7 @@ export function getChildren(props, childComponents, calculatedProps) {
       style: style,
       name: name,
       origin: polar ? origin : undefined,
-      padding: calculatedProps.padding,
+      padding: newCalculatedProps.padding,
       key: "".concat(name, "-key-").concat(index),
       standalone: false
     }, childProps);
@@ -184,9 +182,9 @@ export var getChildComponents = function (props, defaultAxes) {
 };
 
 var getDomain = function (props, axis, childComponents) {
-  childComponents = childComponents || React.Children.toArray(props.children);
-  var domain = Wrapper.getDomain(props, axis, childComponents);
-  var axisComponent = Axis.getAxisComponent(childComponents, axis);
+  var children = childComponents || React.Children.toArray(props.children);
+  var domain = Wrapper.getDomain(props, axis, children);
+  var axisComponent = Axis.getAxisComponent(children, axis);
   var invertDomain = axisComponent && axisComponent.props && axisComponent.props.invertAxis;
   return invertDomain ? domain.concat().reverse() : domain;
 };

package/es/victory-chart.js

@@ -42,7 +42,9 @@ var defaultProps = {
 };
 
 var VictoryChartImpl = function (initialProps) {
-  initialProps = _objectSpread(_objectSpread({}, defaultProps), initialProps);
+  var propsWithDefaults = React.useMemo(function () {
+    return _objectSpread(_objectSpread({}, defaultProps), initialProps);
+  }, [initialProps]);
   var role = "chart";
 
   var _Hooks$useAnimationSt = Hooks.useAnimationState(),
@@ -50,7 +52,7 @@ var VictoryChartImpl = function (initialProps) {
       setAnimationState = _Hooks$useAnimationSt.setAnimationState,
       getProps = _Hooks$useAnimationSt.getProps;
 
-  var props = getProps(initialProps);
+  var props = getProps(propsWithDefaults);
   var modifiedProps = Helpers.modifyProps(props, fallbackProps, role);
   var desc = modifiedProps.desc,
       eventKey = modifiedProps.eventKey,
@@ -116,25 +118,25 @@ var VictoryChartImpl = function (initialProps) {
   }, [desc, domain, height, horizontal, name, origin, polar, scale, standalone, style, title, theme, width]);
   var container = React.useMemo(function () {
     if (standalone) {
-      var defaultContainerProps = _defaults({}, containerComponent.props, containerProps, UserProps.getSafeUserProps(initialProps));
+      var defaultContainerProps = _defaults({}, containerComponent.props, containerProps, UserProps.getSafeUserProps(propsWithDefaults));
 
       return /*#__PURE__*/React.cloneElement(containerComponent, defaultContainerProps);
     }
 
     return groupComponent;
-  }, [groupComponent, standalone, containerComponent, containerProps, initialProps]);
+  }, [groupComponent, standalone, containerComponent, containerProps, propsWithDefaults]);
   var events = React.useMemo(function () {
     return Wrapper.getAllEvents(props);
   }, [props]);
-  var previousProps = Hooks.usePreviousProps(initialProps);
+  var previousProps = Hooks.usePreviousProps(propsWithDefaults);
   React.useEffect(function () {
     // This is called before dismount to keep state in sync
     return function () {
-      if (initialProps.animate) {
-        setAnimationState(previousProps, initialProps);
+      if (propsWithDefaults.animate) {
+        setAnimationState(previousProps, propsWithDefaults);
       }
     };
-  }, [setAnimationState, previousProps, initialProps]);
+  }, [setAnimationState, previousProps, propsWithDefaults]);
 
   if (!_isEmpty(events)) {
     return /*#__PURE__*/React.createElement(VictorySharedEvents, {

package/lib/helper-methods.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 export declare function getBackgroundWithProps(props: any, calculatedProps: any): React.DetailedReactHTMLElement<any, HTMLElement>;
-export declare function getCalculatedProps(props: any, childComponents: any): {
+export declare function getCalculatedProps(initialProps: any, childComponents: any): {
     categories: {
         x: any;
         y: any;

package/lib/helper-methods.js

@@ -99,12 +99,13 @@ function getStyles(props) {
   };
 }
 
-function getCalculatedProps(props, childComponents) {
-  var style = getStyles(props);
-  props = _victoryCore.Helpers.modifyProps(props, fallbackProps, "chart");
-  var _props = props,
-      horizontal = _props.horizontal,
-      polar = _props.polar;
+function getCalculatedProps(initialProps, childComponents) {
+  var style = getStyles(initialProps);
+
+  var props = _victoryCore.Helpers.modifyProps(initialProps, fallbackProps, "chart");
+
+  var horizontal = props.horizontal,
+      polar = props.polar;
 
   var allStrings = _victoryCore.Wrapper.getStringsFromChildren(props, childComponents);
 
@@ -149,23 +150,22 @@ function getCalculatedProps(props, childComponents) {
 }
 
 function getChildren(props, childComponents, calculatedProps) {
-  childComponents = childComponents || getChildComponents(props);
-  calculatedProps = calculatedProps || getCalculatedProps(props, childComponents);
-  var baseStyle = calculatedProps.style.parent;
+  var children = childComponents || getChildComponents(props);
+  var newCalculatedProps = calculatedProps || getCalculatedProps(props, children);
+  var baseStyle = newCalculatedProps.style.parent;
   var height = props.height,
       polar = props.polar,
       theme = props.theme,
       width = props.width;
-  var _calculatedProps = calculatedProps,
-      origin = _calculatedProps.origin,
-      horizontal = _calculatedProps.horizontal;
+  var origin = newCalculatedProps.origin,
+      horizontal = newCalculatedProps.horizontal;
   var parentName = props.name || "chart";
-  return childComponents.filter(_react.default.isValidElement).map(function (child, index) {
+  return children.filter(_react.default.isValidElement).map(function (child, index) {
     var role = child.type && child.type.role;
     var style = Array.isArray(child.props.style) ? child.props.style : (0, _defaults2.default)({}, child.props.style, {
       parent: baseStyle
     });
-    var childProps = getChildProps(child, props, calculatedProps);
+    var childProps = getChildProps(child, props, newCalculatedProps);
     var name = child.props.name || "".concat(parentName, "-").concat(role, "-").concat(index);
     var newProps = (0, _defaults2.default)({
       horizontal: horizontal,
@@ -176,7 +176,7 @@ function getChildren(props, childComponents, calculatedProps) {
       style: style,
       name: name,
       origin: polar ? origin : undefined,
-      padding: calculatedProps.padding,
+      padding: newCalculatedProps.padding,
       key: "".concat(name, "-key-").concat(index),
       standalone: false
     }, childProps);
@@ -206,11 +206,11 @@ var getChildComponents = function (props, defaultAxes) {
 exports.getChildComponents = getChildComponents;
 
 var getDomain = function (props, axis, childComponents) {
-  childComponents = childComponents || _react.default.Children.toArray(props.children);
+  var children = childComponents || _react.default.Children.toArray(props.children);
 
-  var domain = _victoryCore.Wrapper.getDomain(props, axis, childComponents);
+  var domain = _victoryCore.Wrapper.getDomain(props, axis, children);
 
-  var axisComponent = _victoryCore.Axis.getAxisComponent(childComponents, axis);
+  var axisComponent = _victoryCore.Axis.getAxisComponent(children, axis);
 
   var invertDomain = axisComponent && axisComponent.props && axisComponent.props.invertAxis;
   return invertDomain ? domain.concat().reverse() : domain;

package/lib/victory-chart.js

@@ -61,7 +61,10 @@ var defaultProps = {
 };
 
 var VictoryChartImpl = function (initialProps) {
-  initialProps = _objectSpread(_objectSpread({}, defaultProps), initialProps);
+  var propsWithDefaults = _react.default.useMemo(function () {
+    return _objectSpread(_objectSpread({}, defaultProps), initialProps);
+  }, [initialProps]);
+
   var role = "chart";
 
   var _Hooks$useAnimationSt = _victoryCore.Hooks.useAnimationState(),
@@ -69,7 +72,7 @@ var VictoryChartImpl = function (initialProps) {
       setAnimationState = _Hooks$useAnimationSt.setAnimationState,
       getProps = _Hooks$useAnimationSt.getProps;
 
-  var props = getProps(initialProps);
+  var props = getProps(propsWithDefaults);
 
   var modifiedProps = _victoryCore.Helpers.modifyProps(props, fallbackProps, role);
 
@@ -142,27 +145,27 @@ var VictoryChartImpl = function (initialProps) {
 
   var container = _react.default.useMemo(function () {
     if (standalone) {
-      var defaultContainerProps = (0, _defaults2.default)({}, containerComponent.props, containerProps, _victoryCore.UserProps.getSafeUserProps(initialProps));
+      var defaultContainerProps = (0, _defaults2.default)({}, containerComponent.props, containerProps, _victoryCore.UserProps.getSafeUserProps(propsWithDefaults));
       return /*#__PURE__*/_react.default.cloneElement(containerComponent, defaultContainerProps);
     }
 
     return groupComponent;
-  }, [groupComponent, standalone, containerComponent, containerProps, initialProps]);
+  }, [groupComponent, standalone, containerComponent, containerProps, propsWithDefaults]);
 
   var events = _react.default.useMemo(function () {
     return _victoryCore.Wrapper.getAllEvents(props);
   }, [props]);
 
-  var previousProps = _victoryCore.Hooks.usePreviousProps(initialProps);
+  var previousProps = _victoryCore.Hooks.usePreviousProps(propsWithDefaults);
 
   _react.default.useEffect(function () {
     // This is called before dismount to keep state in sync
     return function () {
-      if (initialProps.animate) {
-        setAnimationState(previousProps, initialProps);
+      if (propsWithDefaults.animate) {
+        setAnimationState(previousProps, propsWithDefaults);
       }
     };
-  }, [setAnimationState, previousProps, initialProps]);
+  }, [setAnimationState, previousProps, propsWithDefaults]);
 
   if (!(0, _isEmpty2.default)(events)) {
     return /*#__PURE__*/_react.default.createElement(_victorySharedEvents.VictorySharedEvents, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "victory-chart",
-  "version": "36.8.1",
+  "version": "36.8.3",
   "description": "Chart Component for Victory",
   "keywords": [
     "data visualization",
@@ -23,10 +23,10 @@
     "lodash": "^4.17.19",
     "prop-types": "^15.8.1",
     "react-fast-compare": "^3.2.0",
-    "victory-axis": "^36.8.1",
-    "victory-core": "^36.8.1",
-    "victory-polar-axis": "^36.8.1",
-    "victory-shared-events": "^36.8.1"
+    "victory-axis": "^36.8.3",
+    "victory-core": "^36.8.3",
+    "victory-polar-axis": "^36.8.3",
+    "victory-shared-events": "^36.8.3"
   },
   "peerDependencies": {
     "react": ">=16.6.0"

package/src/helper-methods.tsx

@@ -82,9 +82,9 @@ function getStyles(props) {
   };
 }
 
-export function getCalculatedProps(props, childComponents) {
-  const style = getStyles(props);
-  props = Helpers.modifyProps(props, fallbackProps, "chart");
+export function getCalculatedProps(initialProps, childComponents) {
+  const style = getStyles(initialProps);
+  const props = Helpers.modifyProps(initialProps, fallbackProps, "chart");
   const { horizontal, polar } = props;
   const allStrings = Wrapper.getStringsFromChildren(props, childComponents);
   const categories = Wrapper.getCategories(props, childComponents, allStrings);
@@ -125,20 +125,20 @@ export function getCalculatedProps(props, childComponents) {
 }
 
 export function getChildren(props, childComponents, calculatedProps) {
-  childComponents = childComponents || getChildComponents(props);
-  calculatedProps =
-    calculatedProps || getCalculatedProps(props, childComponents);
-  const baseStyle = calculatedProps.style.parent;
+  const children = childComponents || getChildComponents(props);
+  const newCalculatedProps =
+    calculatedProps || getCalculatedProps(props, children);
+  const baseStyle = newCalculatedProps.style.parent;
   const { height, polar, theme, width } = props;
-  const { origin, horizontal } = calculatedProps;
+  const { origin, horizontal } = newCalculatedProps;
   const parentName = props.name || "chart";
 
-  return childComponents.filter(React.isValidElement).map((child, index) => {
+  return children.filter(React.isValidElement).map((child, index) => {
     const role = child.type && child.type.role;
     const style = Array.isArray(child.props.style)
       ? child.props.style
       : defaults({}, child.props.style, { parent: baseStyle });
-    const childProps = getChildProps(child, props, calculatedProps);
+    const childProps = getChildProps(child, props, newCalculatedProps);
     const name = child.props.name || `${parentName}-${role}-${index}`;
     const newProps = defaults(
       {
@@ -150,7 +150,7 @@ export function getChildren(props, childComponents, calculatedProps) {
         style,
         name,
         origin: polar ? origin : undefined,
-        padding: calculatedProps.padding,
+        padding: newCalculatedProps.padding,
         key: `${name}-key-${index}`,
         standalone: false,
       },
@@ -193,9 +193,9 @@ export const getChildComponents = (props, defaultAxes?) => {
 };
 
 const getDomain = (props, axis, childComponents) => {
-  childComponents = childComponents || React.Children.toArray(props.children);
-  const domain = Wrapper.getDomain(props, axis, childComponents);
-  const axisComponent = Axis.getAxisComponent(childComponents, axis);
+  const children = childComponents || React.Children.toArray(props.children);
+  const domain = Wrapper.getDomain(props, axis, children);
+  const axisComponent = Axis.getAxisComponent(children, axis);
   const invertDomain =
     axisComponent && axisComponent.props && axisComponent.props.invertAxis;
   return invertDomain ? domain.concat().reverse() : domain;

package/src/victory-chart.tsx

@@ -53,11 +53,14 @@ const defaultProps = {
 };
 
 const VictoryChartImpl: React.FC<VictoryChartProps> = (initialProps) => {
-  initialProps = { ...defaultProps, ...initialProps };
+  const propsWithDefaults = React.useMemo(
+    () => ({ ...defaultProps, ...initialProps }),
+    [initialProps],
+  );
   const role = "chart";
   const { getAnimationProps, setAnimationState, getProps } =
     Hooks.useAnimationState();
-  const props = getProps(initialProps);
+  const props = getProps(propsWithDefaults);
 
   const modifiedProps = Helpers.modifyProps(props, fallbackProps, role);
   const {
@@ -154,7 +157,7 @@ const VictoryChartImpl: React.FC<VictoryChartProps> = (initialProps) => {
         {},
         containerComponent.props,
         containerProps,
-        UserProps.getSafeUserProps(initialProps),
+        UserProps.getSafeUserProps(propsWithDefaults),
       );
       return React.cloneElement(containerComponent, defaultContainerProps);
     }
@@ -164,23 +167,23 @@ const VictoryChartImpl: React.FC<VictoryChartProps> = (initialProps) => {
     standalone,
     containerComponent,
     containerProps,
-    initialProps,
+    propsWithDefaults,
   ]);
 
   const events = React.useMemo(() => {
     return Wrapper.getAllEvents(props);
   }, [props]);
 
-  const previousProps = Hooks.usePreviousProps(initialProps);
+  const previousProps = Hooks.usePreviousProps(propsWithDefaults);
 
   React.useEffect(() => {
     // This is called before dismount to keep state in sync
     return () => {
-      if (initialProps.animate) {
-        setAnimationState(previousProps, initialProps);
+      if (propsWithDefaults.animate) {
+        setAnimationState(previousProps, propsWithDefaults);
       }
     };
-  }, [setAnimationState, previousProps, initialProps]);
+  }, [setAnimationState, previousProps, propsWithDefaults]);
 
   if (!isEmpty(events)) {
     return (