victory-pie - npm Package Compare versions

Comparing version 14.0.2 to 15.0.0

CHANGELOG.md

 # VictoryPie Changelog
 
+## 15.0.0 (2018-04-21)
+
+**Breaking Changes**
+
+-[176](https://github.com/FormidableLabs/victory-pie/pull/176) Disable styles on data
+
+This change deprecates Victory's ability to automatically pick up style attributes from the data object. This change will improve performance, but will be a breaking change for many users. Fortunately the upgrade path is simple:
+
+If your data object looks like
+```
+data={[
+  { x: 1, y: 1, fill: "red", opacity: 0.2 },
+  ...
+]}
+```
+Add the following functional styles:
+```
+style={{ data:  { fill: (d) => d.fill, opacity: (d) => d.opacity } }}
+```
+and everything will work as before.
+
+Other changes:
+-[177](https://github.com/FormidableLabs/victory-pie/pull/177) Audit lodash methods
+
 ## 14.0.2 (2018-03-27)
@@ -4,0 +28,0 @@

es/components/helper-methods.js

@@ -1,4 +0,2 @@
-import _omit from "lodash/omit";
 import _isFunction from "lodash/isFunction";
-import _defaults from "lodash/defaults";
 import _assign from "lodash/assign"; /*eslint no-magic-numbers: ["error", { "ignore": [-1, 0, 1, 2, 45, 135, 180, 225, 315] }]*/
@@ -60,3 +58,3 @@
 
-var getSliceStyle = function (datum, index, calculatedValues) {
+var getSliceStyle = function (index, calculatedValues) {
   var style = calculatedValues.style,
@@ -66,4 +64,3 @@ colors = calculatedValues.colors;
   var fill = getColor(style, colors, index);
-  var dataStyles = _omit(datum, ["_x", "_y", "x", "y", "label"]);
-  return _defaults({}, dataStyles, { fill: fill }, style.data);
+  return _assign({ fill: fill }, style.data);
 };
@@ -155,12 +152,15 @@
       origin = calculatedValues.origin;
+  var _props = props,
+      labels = _props.labels,
+      events = _props.events,
+      sharedEvents = _props.sharedEvents,
+      height = _props.height,
+      width = _props.width,
+      standalone = _props.standalone;
 
-  var childProps = {
-    parent: {
-      standalone: props.standalone, slices: slices, pathFunction: pathFunction,
-      width: props.width, height: props.height, style: style.parent
-    }
+  var initialChildProps = {
+    parent: { standalone: standalone, height: height, width: width, slices: slices, pathFunction: pathFunction, style: style.parent }
   };
 
-  for (var index = 0, len = slices.length; index < len; index++) {
-    var slice = slices[index];
+  return slices.reduce(function (childProps, slice, index) {
     var datum = data[index];
@@ -170,11 +170,13 @@ var eventKey = datum.eventKey || index;
       index: index, slice: slice, pathFunction: pathFunction, datum: datum, data: data, origin: origin,
-      style: getSliceStyle(datum, index, calculatedValues)
+      style: getSliceStyle(index, calculatedValues)
     };
-
     childProps[eventKey] = {
-      data: dataProps,
-      labels: getLabelProps(props, dataProps, calculatedValues)
+      data: dataProps
     };
-  }
-  return childProps;
+    var text = getLabelText(props, datum, index);
+    if (text !== undefined && text !== null || labels && (events || sharedEvents)) {
+      childProps[eventKey].labels = getLabelProps(props, dataProps, calculatedValues);
+    }
+    return childProps;
+  }, initialChildProps);
 };

es/components/victory-pie.js

@@ -1,3 +0,1 @@
-import _partialRight from "lodash/partialRight";
-
 var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
@@ -14,3 +12,2 @@
 import PropTypes from "prop-types";
-
 import { addEvents, Helpers, Data, PropTypes as CustomPropTypes, Slice, VictoryContainer, VictoryLabel, VictoryTheme } from "victory-core";
@@ -146,3 +143,7 @@ import { getBaseProps } from "./helper-methods";
 };
-VictoryPie.getBaseProps = _partialRight(getBaseProps, fallbackProps);
+
+VictoryPie.getBaseProps = function (props) {
+  return getBaseProps(props, fallbackProps);
+};
+
 VictoryPie.getData = Data.getData.bind(Data);
@@ -149,0 +150,0 @@ VictoryPie.expectedComponents = ["dataComponent", "labelComponent", "groupComponent", "containerComponent"];

lib/components/helper-methods.js

@@ -6,6 +6,2 @@ Object.defineProperty(exports, "__esModule", {
 
-var _omit2 = require("lodash/omit");
-
-var _omit3 = _interopRequireDefault(_omit2);
-
 var _isFunction2 = require("lodash/isFunction");
@@ -15,6 +11,2 @@
 
-var _defaults2 = require("lodash/defaults");
-
-var _defaults3 = _interopRequireDefault(_defaults2);
-
 var _assign2 = require("lodash/assign");
@@ -85,3 +77,3 @@
 
-var getSliceStyle = function (datum, index, calculatedValues) {
+var getSliceStyle = function (index, calculatedValues) {
   var style = calculatedValues.style,
@@ -91,4 +83,3 @@ colors = calculatedValues.colors;
   var fill = getColor(style, colors, index);
-  var dataStyles = (0, _omit3.default)(datum, ["_x", "_y", "x", "y", "label"]);
-  return (0, _defaults3.default)({}, dataStyles, { fill: fill }, style.data);
+  return (0, _assign3.default)({ fill: fill }, style.data);
 };
@@ -180,12 +171,15 @@
       origin = calculatedValues.origin;
+  var _props = props,
+      labels = _props.labels,
+      events = _props.events,
+      sharedEvents = _props.sharedEvents,
+      height = _props.height,
+      width = _props.width,
+      standalone = _props.standalone;
 
-  var childProps = {
-    parent: {
-      standalone: props.standalone, slices: slices, pathFunction: pathFunction,
-      width: props.width, height: props.height, style: style.parent
-    }
+  var initialChildProps = {
+    parent: { standalone: standalone, height: height, width: width, slices: slices, pathFunction: pathFunction, style: style.parent }
   };
 
-  for (var index = 0, len = slices.length; index < len; index++) {
-    var slice = slices[index];
+  return slices.reduce(function (childProps, slice, index) {
     var datum = data[index];
@@ -195,11 +189,13 @@ var eventKey = datum.eventKey || index;
       index: index, slice: slice, pathFunction: pathFunction, datum: datum, data: data, origin: origin,
-      style: getSliceStyle(datum, index, calculatedValues)
+      style: getSliceStyle(index, calculatedValues)
     };
-
     childProps[eventKey] = {
-      data: dataProps,
-      labels: getLabelProps(props, dataProps, calculatedValues)
+      data: dataProps
     };
-  }
-  return childProps;
+    var text = getLabelText(props, datum, index);
+    if (text !== undefined && text !== null || labels && (events || sharedEvents)) {
+      childProps[eventKey].labels = getLabelProps(props, dataProps, calculatedValues);
+    }
+    return childProps;
+  }, initialChildProps);
 };

lib/components/victory-pie.js

@@ -5,6 +5,2 @@ Object.defineProperty(exports, "__esModule", {
 
-var _partialRight2 = require("lodash/partialRight");
-
-var _partialRight3 = _interopRequireDefault(_partialRight2);
-
 var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
@@ -160,5 +156,9 @@
 };
-VictoryPie.getBaseProps = (0, _partialRight3.default)(_helperMethods.getBaseProps, fallbackProps);
+
+VictoryPie.getBaseProps = function (props) {
+  return (0, _helperMethods.getBaseProps)(props, fallbackProps);
+};
+
 VictoryPie.getData = _victoryCore.Data.getData.bind(_victoryCore.Data);
 VictoryPie.expectedComponents = ["dataComponent", "labelComponent", "groupComponent", "containerComponent"];
 exports.default = (0, _victoryCore.addEvents)(VictoryPie);

package.json

 {
   "name": "victory-pie",
-  "version": "14.0.2",
+  "version": "15.0.0",
   "description": "D3 pie & donut chart component for React",
@@ -28,5 +28,8 @@ "main": "lib/index.js",
     "version": "builder run npm:version",
-    "storybook": "start-storybook -p 3001",
+    "storybook": "start-storybook -p 6006",
     "lank-watch": "lank exec -u -- builder run build-watch",
-    "lank-run": "lank exec -m victory-pie -uq -- builder run dev --expand-archetype"
+    "lank-run": "lank exec -m victory-pie -uq -- builder run dev --expand-archetype",
+    "lank-test": "lank exec -m victory-pie -uq -- builder run check --expand-archetype",
+    "chromatic": "chromatic test --storybook-addon",
+    "chromatic-test": "chromatic test --storybook-addon --exit-zero-on-changes"
   },
@@ -36,6 +39,10 @@ "dependencies": {
     "lodash": "^4.17.5",
-    "victory-core": "^21.1.0"
+    "victory-core": "^22.0.0"
   },
   "devDependencies": {
-    "@kadira/storybook": "^1.25.0",
+    "@storybook/addon-actions": "^3.2.13",
+    "@storybook/react": "^3.2.13",
+    "babel-plugin-lodash": "^3.1.2",
+    "babel-preset-react": "^6.5.0",
+    "babel-preset-react-native": "^1.9.0",
     "builder-victory-component-dev": "^5.1.2",
@@ -48,6 +55,7 @@ "chai": "^3.5.0",
     "react": "^16.0.0",
+    "react-chromatic": "^0.8.2",
     "react-dom": "^16.0.0",
     "sinon": "^1.17.5",
     "sinon-chai": "^2.8.0",
-    "builder": "^3.2.1",
+    "builder": "^4.0.0",
     "builder-victory-component": "^5.1.2"
@@ -54,0 +62,0 @@ },

README.md

@@ -30,2 +30,7 @@ [![Travis Status][trav_img]][trav_site]
 ```
+
+## Chromatic
+
+Victory uses Chromatic for visual testing. A summary of visual changes is compiled with each PR. Please check for visual changes before merging.
+
 ### Multi-repo development
@@ -32,0 +37,0 @@

src/components/helper-methods.js

 /*eslint no-magic-numbers: ["error", { "ignore": [-1, 0, 1, 2, 45, 135, 180, 225, 315] }]*/
-import { assign, defaults, isFunction, omit } from "lodash";
+import { assign, isFunction } from "lodash";
 import * as d3Shape from "d3-shape";
@@ -62,7 +62,6 @@
 
-const getSliceStyle = (datum, index, calculatedValues) => {
+const getSliceStyle = (index, calculatedValues) => {
   const { style, colors } = calculatedValues;
   const fill = getColor(style, colors, index);
-  const dataStyles = omit(datum, ["_x", "_y", "x", "y", "label"]);
-  return defaults({}, dataStyles, { fill }, style.data);
+  return assign({ fill }, style.data);
 };
@@ -148,11 +147,8 @@
   const { slices, style, pathFunction, data, origin } = calculatedValues;
-  const childProps = {
-    parent: {
-      standalone: props.standalone, slices, pathFunction,
-      width: props.width, height: props.height, style: style.parent
-    }
+  const { labels, events, sharedEvents, height, width, standalone } = props;
+  const initialChildProps = {
+    parent: { standalone, height, width, slices, pathFunction, style: style.parent }
   };
 
-  for (let index = 0, len = slices.length; index < len; index++) {
-    const slice = slices[index];
+  return slices.reduce((childProps, slice, index) => {
     const datum = data[index];
@@ -162,11 +158,13 @@ const eventKey = datum.eventKey || index;
       index, slice, pathFunction, datum, data, origin,
-      style: getSliceStyle(datum, index, calculatedValues)
+      style: getSliceStyle(index, calculatedValues)
     };
-
     childProps[eventKey] = {
-      data: dataProps,
-      labels: getLabelProps(props, dataProps, calculatedValues)
+      data: dataProps
     };
-  }
-  return childProps;
+    const text = getLabelText(props, datum, index);
+    if (text !== undefined && text !== null || (labels && (events || sharedEvents))) {
+      childProps[eventKey].labels = getLabelProps(props, dataProps, calculatedValues);
+    }
+    return childProps;
+  }, initialChildProps);
 };

src/components/victory-pie.js

 /*eslint no-magic-numbers: ["error", { "ignore": [-1, 0, 1, 2] }]*/
 import React from "react";
 import PropTypes from "prop-types";
-import { partialRight } from "lodash";
 import {
@@ -163,3 +162,3 @@ addEvents, Helpers, Data, PropTypes as CustomPropTypes, Slice,
 
-  static getBaseProps = partialRight(getBaseProps, fallbackProps);
+  static getBaseProps = (props) => getBaseProps(props, fallbackProps);
   static getData = Data.getData.bind(Data);
@@ -166,0 +165,0 @@ static expectedComponents = [

New alerts

Uses eval

Supply chain risk

Package uses dynamic code execution (e.g., eval()), which is a dangerous practice. This can prevent the code from running in certain environments and increases the risk that the code may contain exploits or malicious behavior.

Found 1 instance in 1 package

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 2 instances in 1 package

Improved metrics

Number of lines in readme file

81

increased by6.58%

Worsened metrics

Total package byte prevSize

1353810

decreased by-4.57%

Dev dependency count

18

increased by38.46%

Lines of code

23242

decreased by-6.76%

Number of low supply chain risk alerts

10

increased by150%

Number of medium supply chain risk alerts

6

increased by100%

Dependency changes

• + Addedvictory-core@22.1.6(transitive)

• - Removedvictory-core@21.1.13(transitive)

• Updatedvictory-core@^22.0.0