Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

victory-bar

Package Overview
Dependencies
Maintainers
5
Versions
177
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

victory-bar - npm Package Compare versions

Comparing version 30.5.1 to 30.6.0

es/geometry-helper-methods.js

259

es/bar.js

@@ -0,1 +1,2 @@

import _isNil from "lodash/isNil";
import _isFunction from "lodash/isFunction";

@@ -5,10 +6,2 @@ import _isPlainObject from "lodash/isPlainObject";

function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }

@@ -33,3 +26,3 @@

import { Helpers, Path, CommonProps } from "victory-core";
import * as d3Shape from "d3-shape";
import { getVerticalBarPath, getHorizontalBarPath, getVerticalPolarBarPath, getCustomBarPath } from "./path-helper-methods";

@@ -48,193 +41,9 @@ var Bar =

_createClass(Bar, [{
key: "getPosition",
value: function getPosition(props, width) {
var x = props.x,
y = props.y,
y0 = props.y0,
horizontal = props.horizontal;
var alignment = props.alignment || "middle";
var size = alignment === "middle" ? width / 2 : width;
var sign = horizontal ? -1 : 1;
return {
x0: alignment === "start" ? x : x - sign * size,
x1: alignment === "end" ? x : x + sign * size,
y0: y0,
y1: y
};
}
}, {
key: "getVerticalBarPath",
value: function getVerticalBarPath(props, width, cornerRadius) {
var _getPosition = this.getPosition(props, width),
x0 = _getPosition.x0,
x1 = _getPosition.x1,
y0 = _getPosition.y0,
y1 = _getPosition.y1;
var sign = y0 > y1 ? 1 : -1;
var direction = sign > 0 ? "0 0 1" : "0 0 0";
var topArc = "".concat(cornerRadius.top, " ").concat(cornerRadius.top, " ").concat(direction);
var bottomArc = "".concat(cornerRadius.bottom, " ").concat(cornerRadius.bottom, " ").concat(direction);
return "M ".concat(x0 + cornerRadius.bottom, ", ").concat(y0, "\n A ").concat(bottomArc, ", ").concat(x0, ", ").concat(y0 - sign * cornerRadius.bottom, "\n L ").concat(x0, ", ").concat(y1 + sign * cornerRadius.top, "\n A ").concat(topArc, ", ").concat(x0 + cornerRadius.top, ", ").concat(y1, "\n L ").concat(x1 - cornerRadius.top, ", ").concat(y1, "\n A ").concat(topArc, ", ").concat(x1, ", ").concat(y1 + sign * cornerRadius.top, "\n L ").concat(x1, ", ").concat(y0 - sign * cornerRadius.bottom, "\n A ").concat(bottomArc, ", ").concat(x1 - cornerRadius.bottom, ", ").concat(y0, "\n z");
}
}, {
key: "getHorizontalBarPath",
value: function getHorizontalBarPath(props, width, cornerRadius) {
var _getPosition2 = this.getPosition(props, width),
x0 = _getPosition2.x0,
x1 = _getPosition2.x1,
y0 = _getPosition2.y0,
y1 = _getPosition2.y1;
var sign = y1 > y0 ? 1 : -1;
var direction = sign > 0 ? "0 0 1" : "0 0 0";
var topArc = "".concat(cornerRadius.top, " ").concat(cornerRadius.top, " ").concat(direction);
var bottomArc = "".concat(cornerRadius.bottom, " ").concat(cornerRadius.bottom, " ").concat(direction);
return "M ".concat(y0, ", ").concat(x1 + sign * cornerRadius.bottom, "\n A ").concat(bottomArc, ", ").concat(y0 + cornerRadius.bottom, ", ").concat(x1, "\n L ").concat(y1 - sign * cornerRadius.top, ", ").concat(x1, "\n A ").concat(topArc, ", ").concat(y1, ", ").concat(x1 + cornerRadius.top, "\n L ").concat(y1, ", ").concat(x0 - cornerRadius.top, "\n A ").concat(topArc, ", ").concat(y1 - sign * cornerRadius.top, ", ").concat(x0, "\n L ").concat(y0 + cornerRadius.bottom, ", ").concat(x0, "\n A ").concat(bottomArc, ", ").concat(y0, ", ").concat(x0 - sign * cornerRadius.bottom, "\n z");
}
}, {
key: "getCustomBarPath",
value: function getCustomBarPath(props, width) {
var getPath = props.getPath;
var propsWithCalculatedValues = _objectSpread({}, props, this.getPosition(props, width));
return getPath(propsWithCalculatedValues);
}
}, {
key: "transformAngle",
value: function transformAngle(angle) {
return -1 * angle + Math.PI / 2;
}
}, {
key: "getAngularWidth",
value: function getAngularWidth(props, width) {
var scale = props.scale;
var range = scale.y.range();
var r = Math.max.apply(Math, _toConsumableArray(range));
var angularRange = Math.abs(scale.x.range()[1] - scale.x.range()[0]);
return width / (2 * Math.PI * r) * angularRange;
}
}, {
key: "getAngle",
value: function getAngle(props, index) {
var data = props.data,
scale = props.scale;
var x = data[index]._x1 === undefined ? "_x" : "_x1";
return scale.x(data[index][x]);
}
}, {
key: "getStartAngle",
value: function getStartAngle(props, index) {
var data = props.data,
scale = props.scale,
alignment = props.alignment;
var currentAngle = this.getAngle(props, index);
var angularRange = Math.abs(scale.x.range()[1] - scale.x.range()[0]);
var previousAngle = index === 0 ? this.getAngle(props, data.length - 1) - Math.PI * 2 : this.getAngle(props, index - 1);
if (index === 0 && angularRange < 2 * Math.PI) {
return scale.x.range()[0];
} else if (alignment === "start" || alignment === "end") {
return alignment === "start" ? previousAngle : currentAngle;
} else {
return (currentAngle + previousAngle) / 2;
}
}
}, {
key: "getEndAngle",
value: function getEndAngle(props, index) {
var data = props.data,
scale = props.scale,
alignment = props.alignment;
var currentAngle = this.getAngle(props, index);
var angularRange = Math.abs(scale.x.range()[1] - scale.x.range()[0]);
var lastAngle = scale.x.range()[1] === 2 * Math.PI ? this.getAngle(props, 0) + Math.PI * 2 : scale.x.range()[1];
var nextAngle = index === data.length - 1 ? this.getAngle(props, 0) + Math.PI * 2 : this.getAngle(props, index + 1);
if (index === data.length - 1 && angularRange < 2 * Math.PI) {
return lastAngle;
} else if (alignment === "start" || alignment === "end") {
return alignment === "start" ? currentAngle : nextAngle;
} else {
return (currentAngle + nextAngle) / 2;
}
}
}, {
key: "getCustomVerticalPolarBarPath",
value: function getCustomVerticalPolarBarPath(getPath, props) {
return getPath(props);
}
}, {
key: "getVerticalPolarBarPath",
value: function getVerticalPolarBarPath(props, cornerRadius) {
// eslint-disable-line max-statements
var datum = props.datum,
scale = props.scale,
index = props.index,
alignment = props.alignment;
var style = Helpers.evaluateStyle(props.style, datum, props.active);
var r1 = scale.y(datum._y0 || 0);
var r2 = scale.y(datum._y1 !== undefined ? datum._y1 : datum._y);
var currentAngle = scale.x(datum._x1 !== undefined ? datum._x1 : datum._x);
var start;
var end;
if (style.width) {
var width = this.getAngularWidth(props, style.width);
var size = alignment === "middle" ? width / 2 : width;
start = alignment === "start" ? currentAngle : currentAngle - size;
end = alignment === "end" ? currentAngle : currentAngle + size;
} else {
start = this.getStartAngle(props, index);
end = this.getEndAngle(props, index);
}
start = this.transformAngle(start);
end = this.transformAngle(end);
if (props.getPath) {
var options = {
startAngle: start,
endAngle: end,
r1: r1,
r2: r2,
cornerRadius: cornerRadius
};
var propsWithCalculatedValues = _objectSpread({}, props, options);
return this.getCustomVerticalPolarBarPath(props.getPath, propsWithCalculatedValues);
}
var getPath = function (edge) {
var pathFunction = d3Shape.arc().innerRadius(r1).outerRadius(r2).startAngle(start).endAngle(end).cornerRadius(cornerRadius[edge]);
var path = pathFunction();
var moves = path.match(/[A-Z]/g);
var middle = moves.indexOf("L");
var coords = path.split(/[A-Z]/).slice(1);
var subMoves = edge === "top" ? moves.slice(0, middle) : moves.slice(middle);
var subCoords = edge === "top" ? coords.slice(0, middle) : coords.slice(middle);
return subMoves.map(function (m, i) {
return {
command: m,
coords: subCoords[i].split(",")
};
});
};
var moves = getPath("top").concat(getPath("bottom"));
return moves.reduce(function (memo, move) {
memo += "".concat(move.command, " ").concat(move.coords.join());
return memo;
}, "");
}
}, {
key: "getBarPath",
value: function getBarPath(props, width, cornerRadius) {
if (props.getPath) {
return this.getCustomBarPath(props, width);
return getCustomBarPath(props, width);
}
return props.horizontal ? this.getHorizontalBarPath(props, width, cornerRadius) : this.getVerticalBarPath(props, width, cornerRadius);
return props.horizontal ? getHorizontalBarPath(props, width, cornerRadius) : getVerticalBarPath(props, width, cornerRadius);
}

@@ -245,3 +54,3 @@ }, {

// TODO Radial bars
return this.getVerticalPolarBarPath(props, cornerRadius);
return getVerticalPolarBarPath(props, cornerRadius);
}

@@ -254,2 +63,3 @@ }, {

data = props.data,
datum = props.datum,
barWidth = props.barWidth,

@@ -259,3 +69,3 @@ defaultBarWidth = props.defaultBarWidth;

if (barWidth) {
return _isFunction(barWidth) ? Helpers.evaluateProp(barWidth, active) : barWidth;
return _isFunction(barWidth) ? Helpers.evaluateProp(barWidth, datum, active) : barWidth;
} else if (style.width) {

@@ -273,2 +83,29 @@ return style.width;

}, {
key: "getCornerRadiusFromObject",
value: function getCornerRadiusFromObject(props) {
var cornerRadius = props.cornerRadius,
datum = props.datum,
active = props.active;
var realCornerRadius = {
topLeft: 0,
topRight: 0,
bottomLeft: 0,
bottomRight: 0
};
var updateCornerRadius = function (corner, fallback) {
if (!_isNil(cornerRadius[corner])) {
realCornerRadius[corner] = Helpers.evaluateProp(cornerRadius[corner], datum, active);
} else if (!_isNil(cornerRadius[fallback])) {
realCornerRadius[corner] = Helpers.evaluateProp(cornerRadius[fallback], datum, active);
}
};
updateCornerRadius("topLeft", "top");
updateCornerRadius("topRight", "top");
updateCornerRadius("bottomLeft", "bottom");
updateCornerRadius("bottomRight", "right");
return realCornerRadius;
}
}, {
key: "getCornerRadius",

@@ -279,8 +116,20 @@ value: function getCornerRadius(props) {

active = props.active;
var top = _isPlainObject(cornerRadius) ? cornerRadius.top : cornerRadius || 0;
var bottom = _isPlainObject(cornerRadius) ? cornerRadius.bottom : 0;
return {
top: Helpers.evaluateProp(top, datum, active),
bottom: Helpers.evaluateProp(bottom, datum, active)
var realCornerRadius = {
topLeft: 0,
topRight: 0,
bottomLeft: 0,
bottomRight: 0
};
if (!cornerRadius) {
return realCornerRadius;
}
if (_isPlainObject(cornerRadius)) {
return this.getCornerRadiusFromObject(props);
}
realCornerRadius.topLeft = Helpers.evaluateProp(cornerRadius, datum, active);
realCornerRadius.topRight = Helpers.evaluateProp(cornerRadius, datum, active);
return realCornerRadius;
}

@@ -338,3 +187,7 @@ }, {

top: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
bottom: PropTypes.oneOfType([PropTypes.number, PropTypes.func])
topLeft: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
topRight: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
bottom: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
bottomLeft: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
bottomRight: PropTypes.oneOfType([PropTypes.number, PropTypes.func])
})]),

@@ -341,0 +194,0 @@ datum: PropTypes.object,

export { default as VictoryBar } from "./victory-bar";
export { default as Bar } from "./bar";
export { default as Bar } from "./bar";
export { getVerticalBarPath, getHorizontalBarPath, getVerticalPolarBarPath } from "./path-helper-methods";

@@ -149,3 +149,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }

top: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
bottom: PropTypes.oneOfType([PropTypes.number, PropTypes.func])
topLeft: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
topRight: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
bottom: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
bottomLeft: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
bottomRight: PropTypes.oneOfType([PropTypes.number, PropTypes.func])
})]),

@@ -152,0 +156,0 @@ getPath: PropTypes.func,

@@ -8,2 +8,4 @@ "use strict";

var _isNil2 = _interopRequireDefault(require("lodash/isNil"));
var _isFunction2 = _interopRequireDefault(require("lodash/isFunction"));

@@ -21,16 +23,6 @@

var d3Shape = _interopRequireWildcard(require("d3-shape"));
var _pathHelperMethods = require("./path-helper-methods");
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }

@@ -64,195 +56,9 @@

_createClass(Bar, [{
key: "getPosition",
value: function getPosition(props, width) {
var x = props.x,
y = props.y,
y0 = props.y0,
horizontal = props.horizontal;
var alignment = props.alignment || "middle";
var size = alignment === "middle" ? width / 2 : width;
var sign = horizontal ? -1 : 1;
return {
x0: alignment === "start" ? x : x - sign * size,
x1: alignment === "end" ? x : x + sign * size,
y0: y0,
y1: y
};
}
}, {
key: "getVerticalBarPath",
value: function getVerticalBarPath(props, width, cornerRadius) {
var _getPosition = this.getPosition(props, width),
x0 = _getPosition.x0,
x1 = _getPosition.x1,
y0 = _getPosition.y0,
y1 = _getPosition.y1;
var sign = y0 > y1 ? 1 : -1;
var direction = sign > 0 ? "0 0 1" : "0 0 0";
var topArc = "".concat(cornerRadius.top, " ").concat(cornerRadius.top, " ").concat(direction);
var bottomArc = "".concat(cornerRadius.bottom, " ").concat(cornerRadius.bottom, " ").concat(direction);
return "M ".concat(x0 + cornerRadius.bottom, ", ").concat(y0, "\n A ").concat(bottomArc, ", ").concat(x0, ", ").concat(y0 - sign * cornerRadius.bottom, "\n L ").concat(x0, ", ").concat(y1 + sign * cornerRadius.top, "\n A ").concat(topArc, ", ").concat(x0 + cornerRadius.top, ", ").concat(y1, "\n L ").concat(x1 - cornerRadius.top, ", ").concat(y1, "\n A ").concat(topArc, ", ").concat(x1, ", ").concat(y1 + sign * cornerRadius.top, "\n L ").concat(x1, ", ").concat(y0 - sign * cornerRadius.bottom, "\n A ").concat(bottomArc, ", ").concat(x1 - cornerRadius.bottom, ", ").concat(y0, "\n z");
}
}, {
key: "getHorizontalBarPath",
value: function getHorizontalBarPath(props, width, cornerRadius) {
var _getPosition2 = this.getPosition(props, width),
x0 = _getPosition2.x0,
x1 = _getPosition2.x1,
y0 = _getPosition2.y0,
y1 = _getPosition2.y1;
var sign = y1 > y0 ? 1 : -1;
var direction = sign > 0 ? "0 0 1" : "0 0 0";
var topArc = "".concat(cornerRadius.top, " ").concat(cornerRadius.top, " ").concat(direction);
var bottomArc = "".concat(cornerRadius.bottom, " ").concat(cornerRadius.bottom, " ").concat(direction);
return "M ".concat(y0, ", ").concat(x1 + sign * cornerRadius.bottom, "\n A ").concat(bottomArc, ", ").concat(y0 + cornerRadius.bottom, ", ").concat(x1, "\n L ").concat(y1 - sign * cornerRadius.top, ", ").concat(x1, "\n A ").concat(topArc, ", ").concat(y1, ", ").concat(x1 + cornerRadius.top, "\n L ").concat(y1, ", ").concat(x0 - cornerRadius.top, "\n A ").concat(topArc, ", ").concat(y1 - sign * cornerRadius.top, ", ").concat(x0, "\n L ").concat(y0 + cornerRadius.bottom, ", ").concat(x0, "\n A ").concat(bottomArc, ", ").concat(y0, ", ").concat(x0 - sign * cornerRadius.bottom, "\n z");
}
}, {
key: "getCustomBarPath",
value: function getCustomBarPath(props, width) {
var getPath = props.getPath;
var propsWithCalculatedValues = _objectSpread({}, props, this.getPosition(props, width));
return getPath(propsWithCalculatedValues);
}
}, {
key: "transformAngle",
value: function transformAngle(angle) {
return -1 * angle + Math.PI / 2;
}
}, {
key: "getAngularWidth",
value: function getAngularWidth(props, width) {
var scale = props.scale;
var range = scale.y.range();
var r = Math.max.apply(Math, _toConsumableArray(range));
var angularRange = Math.abs(scale.x.range()[1] - scale.x.range()[0]);
return width / (2 * Math.PI * r) * angularRange;
}
}, {
key: "getAngle",
value: function getAngle(props, index) {
var data = props.data,
scale = props.scale;
var x = data[index]._x1 === undefined ? "_x" : "_x1";
return scale.x(data[index][x]);
}
}, {
key: "getStartAngle",
value: function getStartAngle(props, index) {
var data = props.data,
scale = props.scale,
alignment = props.alignment;
var currentAngle = this.getAngle(props, index);
var angularRange = Math.abs(scale.x.range()[1] - scale.x.range()[0]);
var previousAngle = index === 0 ? this.getAngle(props, data.length - 1) - Math.PI * 2 : this.getAngle(props, index - 1);
if (index === 0 && angularRange < 2 * Math.PI) {
return scale.x.range()[0];
} else if (alignment === "start" || alignment === "end") {
return alignment === "start" ? previousAngle : currentAngle;
} else {
return (currentAngle + previousAngle) / 2;
}
}
}, {
key: "getEndAngle",
value: function getEndAngle(props, index) {
var data = props.data,
scale = props.scale,
alignment = props.alignment;
var currentAngle = this.getAngle(props, index);
var angularRange = Math.abs(scale.x.range()[1] - scale.x.range()[0]);
var lastAngle = scale.x.range()[1] === 2 * Math.PI ? this.getAngle(props, 0) + Math.PI * 2 : scale.x.range()[1];
var nextAngle = index === data.length - 1 ? this.getAngle(props, 0) + Math.PI * 2 : this.getAngle(props, index + 1);
if (index === data.length - 1 && angularRange < 2 * Math.PI) {
return lastAngle;
} else if (alignment === "start" || alignment === "end") {
return alignment === "start" ? currentAngle : nextAngle;
} else {
return (currentAngle + nextAngle) / 2;
}
}
}, {
key: "getCustomVerticalPolarBarPath",
value: function getCustomVerticalPolarBarPath(getPath, props) {
return getPath(props);
}
}, {
key: "getVerticalPolarBarPath",
value: function getVerticalPolarBarPath(props, cornerRadius) {
// eslint-disable-line max-statements
var datum = props.datum,
scale = props.scale,
index = props.index,
alignment = props.alignment;
var style = _victoryCore.Helpers.evaluateStyle(props.style, datum, props.active);
var r1 = scale.y(datum._y0 || 0);
var r2 = scale.y(datum._y1 !== undefined ? datum._y1 : datum._y);
var currentAngle = scale.x(datum._x1 !== undefined ? datum._x1 : datum._x);
var start;
var end;
if (style.width) {
var width = this.getAngularWidth(props, style.width);
var size = alignment === "middle" ? width / 2 : width;
start = alignment === "start" ? currentAngle : currentAngle - size;
end = alignment === "end" ? currentAngle : currentAngle + size;
} else {
start = this.getStartAngle(props, index);
end = this.getEndAngle(props, index);
}
start = this.transformAngle(start);
end = this.transformAngle(end);
if (props.getPath) {
var options = {
startAngle: start,
endAngle: end,
r1: r1,
r2: r2,
cornerRadius: cornerRadius
};
var propsWithCalculatedValues = _objectSpread({}, props, options);
return this.getCustomVerticalPolarBarPath(props.getPath, propsWithCalculatedValues);
}
var getPath = function (edge) {
var pathFunction = d3Shape.arc().innerRadius(r1).outerRadius(r2).startAngle(start).endAngle(end).cornerRadius(cornerRadius[edge]);
var path = pathFunction();
var moves = path.match(/[A-Z]/g);
var middle = moves.indexOf("L");
var coords = path.split(/[A-Z]/).slice(1);
var subMoves = edge === "top" ? moves.slice(0, middle) : moves.slice(middle);
var subCoords = edge === "top" ? coords.slice(0, middle) : coords.slice(middle);
return subMoves.map(function (m, i) {
return {
command: m,
coords: subCoords[i].split(",")
};
});
};
var moves = getPath("top").concat(getPath("bottom"));
return moves.reduce(function (memo, move) {
memo += "".concat(move.command, " ").concat(move.coords.join());
return memo;
}, "");
}
}, {
key: "getBarPath",
value: function getBarPath(props, width, cornerRadius) {
if (props.getPath) {
return this.getCustomBarPath(props, width);
return (0, _pathHelperMethods.getCustomBarPath)(props, width);
}
return props.horizontal ? this.getHorizontalBarPath(props, width, cornerRadius) : this.getVerticalBarPath(props, width, cornerRadius);
return props.horizontal ? (0, _pathHelperMethods.getHorizontalBarPath)(props, width, cornerRadius) : (0, _pathHelperMethods.getVerticalBarPath)(props, width, cornerRadius);
}

@@ -263,3 +69,3 @@ }, {

// TODO Radial bars
return this.getVerticalPolarBarPath(props, cornerRadius);
return (0, _pathHelperMethods.getVerticalPolarBarPath)(props, cornerRadius);
}

@@ -272,2 +78,3 @@ }, {

data = props.data,
datum = props.datum,
barWidth = props.barWidth,

@@ -277,3 +84,3 @@ defaultBarWidth = props.defaultBarWidth;

if (barWidth) {
return (0, _isFunction2.default)(barWidth) ? _victoryCore.Helpers.evaluateProp(barWidth, active) : barWidth;
return (0, _isFunction2.default)(barWidth) ? _victoryCore.Helpers.evaluateProp(barWidth, datum, active) : barWidth;
} else if (style.width) {

@@ -291,2 +98,29 @@ return style.width;

}, {
key: "getCornerRadiusFromObject",
value: function getCornerRadiusFromObject(props) {
var cornerRadius = props.cornerRadius,
datum = props.datum,
active = props.active;
var realCornerRadius = {
topLeft: 0,
topRight: 0,
bottomLeft: 0,
bottomRight: 0
};
var updateCornerRadius = function (corner, fallback) {
if (!(0, _isNil2.default)(cornerRadius[corner])) {
realCornerRadius[corner] = _victoryCore.Helpers.evaluateProp(cornerRadius[corner], datum, active);
} else if (!(0, _isNil2.default)(cornerRadius[fallback])) {
realCornerRadius[corner] = _victoryCore.Helpers.evaluateProp(cornerRadius[fallback], datum, active);
}
};
updateCornerRadius("topLeft", "top");
updateCornerRadius("topRight", "top");
updateCornerRadius("bottomLeft", "bottom");
updateCornerRadius("bottomRight", "right");
return realCornerRadius;
}
}, {
key: "getCornerRadius",

@@ -297,8 +131,20 @@ value: function getCornerRadius(props) {

active = props.active;
var top = (0, _isPlainObject2.default)(cornerRadius) ? cornerRadius.top : cornerRadius || 0;
var bottom = (0, _isPlainObject2.default)(cornerRadius) ? cornerRadius.bottom : 0;
return {
top: _victoryCore.Helpers.evaluateProp(top, datum, active),
bottom: _victoryCore.Helpers.evaluateProp(bottom, datum, active)
var realCornerRadius = {
topLeft: 0,
topRight: 0,
bottomLeft: 0,
bottomRight: 0
};
if (!cornerRadius) {
return realCornerRadius;
}
if ((0, _isPlainObject2.default)(cornerRadius)) {
return this.getCornerRadiusFromObject(props);
}
realCornerRadius.topLeft = _victoryCore.Helpers.evaluateProp(cornerRadius, datum, active);
realCornerRadius.topRight = _victoryCore.Helpers.evaluateProp(cornerRadius, datum, active);
return realCornerRadius;
}

@@ -359,3 +205,7 @@ }, {

top: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.func]),
bottom: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.func])
topLeft: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.func]),
topRight: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.func]),
bottom: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.func]),
bottomLeft: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.func]),
bottomRight: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.func])
})]),

@@ -362,0 +212,0 @@ datum: _propTypes.default.object,

@@ -18,2 +18,20 @@ "use strict";

});
Object.defineProperty(exports, "getVerticalBarPath", {
enumerable: true,
get: function () {
return _pathHelperMethods.getVerticalBarPath;
}
});
Object.defineProperty(exports, "getHorizontalBarPath", {
enumerable: true,
get: function () {
return _pathHelperMethods.getHorizontalBarPath;
}
});
Object.defineProperty(exports, "getVerticalPolarBarPath", {
enumerable: true,
get: function () {
return _pathHelperMethods.getVerticalPolarBarPath;
}
});

@@ -24,2 +42,4 @@ var _victoryBar = _interopRequireDefault(require("./victory-bar"));

var _pathHelperMethods = require("./path-helper-methods");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

@@ -164,3 +164,7 @@ "use strict";

top: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.func]),
bottom: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.func])
topLeft: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.func]),
topRight: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.func]),
bottom: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.func]),
bottomLeft: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.func]),
bottomRight: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.func])
})]),

@@ -167,0 +171,0 @@ getPath: _propTypes.default.func,

{
"name": "victory-bar",
"version": "30.5.1",
"version": "30.6.0",
"description": "Bar Component for Victory",

@@ -28,5 +28,5 @@ "keywords": [

"scripts": {
"version": "nps build-libs && nps build-dists"
"temp-version": "webpack --bail --config ../../config/webpack/webpack.config.js --colors"
},
"sideEffects": false
}
import React from "react";
import PropTypes from "prop-types";
import { Helpers, Path, CommonProps } from "victory-core";
import { assign, isPlainObject, isFunction } from "lodash";
import * as d3Shape from "d3-shape";
import { assign, isPlainObject, isFunction, isNil } from "lodash";
import {
getVerticalBarPath,
getHorizontalBarPath,
getVerticalPolarBarPath,
getCustomBarPath
} from "./path-helper-methods";
export default class Bar extends React.Component {

@@ -22,3 +28,7 @@

top: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
bottom: PropTypes.oneOfType([PropTypes.number, PropTypes.func])
topLeft: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
topRight: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
bottom: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
bottomLeft: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
bottomRight: PropTypes.oneOfType([PropTypes.number, PropTypes.func])
})

@@ -41,166 +51,9 @@ ]),

getPosition(props, width) {
const { x, y, y0, horizontal } = props;
const alignment = props.alignment || "middle";
const size = alignment === "middle" ? width / 2 : width;
const sign = horizontal ? -1 : 1;
return {
x0: alignment === "start" ? x : x - (sign * size),
x1: alignment === "end" ? x : x + (sign * size),
y0,
y1: y
};
}
getVerticalBarPath(props, width, cornerRadius) {
const { x0, x1, y0, y1 } = this.getPosition(props, width);
const sign = y0 > y1 ? 1 : -1;
const direction = sign > 0 ? "0 0 1" : "0 0 0";
const topArc = `${cornerRadius.top} ${cornerRadius.top} ${direction}`;
const bottomArc = `${cornerRadius.bottom} ${cornerRadius.bottom} ${direction}`;
return `M ${x0 + cornerRadius.bottom}, ${y0}
A ${bottomArc}, ${x0}, ${y0 - sign * cornerRadius.bottom}
L ${x0}, ${y1 + sign * cornerRadius.top}
A ${topArc}, ${x0 + cornerRadius.top}, ${y1}
L ${x1 - cornerRadius.top}, ${y1}
A ${topArc}, ${x1}, ${y1 + sign * cornerRadius.top}
L ${x1}, ${y0 - sign * cornerRadius.bottom}
A ${bottomArc}, ${x1 - cornerRadius.bottom}, ${y0}
z`;
}
getHorizontalBarPath(props, width, cornerRadius) {
const { x0, x1, y0, y1 } = this.getPosition(props, width);
const sign = y1 > y0 ? 1 : -1;
const direction = sign > 0 ? "0 0 1" : "0 0 0";
const topArc = `${cornerRadius.top} ${cornerRadius.top} ${direction}`;
const bottomArc = `${cornerRadius.bottom} ${cornerRadius.bottom} ${direction}`;
return `M ${y0}, ${x1 + sign * cornerRadius.bottom}
A ${bottomArc}, ${y0 + cornerRadius.bottom}, ${x1}
L ${y1 - sign * cornerRadius.top}, ${x1}
A ${topArc}, ${y1}, ${x1 + cornerRadius.top}
L ${y1}, ${x0 - cornerRadius.top}
A ${topArc}, ${y1 - sign * cornerRadius.top}, ${x0}
L ${y0 + cornerRadius.bottom}, ${x0 }
A ${bottomArc}, ${y0}, ${x0 - sign * cornerRadius.bottom}
z`;
}
getCustomBarPath(props, width) {
const { getPath } = props;
const propsWithCalculatedValues = { ...props, ...this.getPosition(props, width) };
return getPath(propsWithCalculatedValues);
}
transformAngle(angle) {
return -1 * angle + (Math.PI / 2);
}
getAngularWidth(props, width) {
const { scale } = props;
const range = scale.y.range();
const r = Math.max(...range);
const angularRange = Math.abs(scale.x.range()[1] - scale.x.range()[0]);
return (width / (2 * Math.PI * r)) * angularRange;
}
getAngle(props, index) {
const { data, scale } = props;
const x = data[index]._x1 === undefined ? "_x" : "_x1";
return scale.x(data[index][x]);
}
getStartAngle(props, index) {
const { data, scale, alignment } = props;
const currentAngle = this.getAngle(props, index);
const angularRange = Math.abs(scale.x.range()[1] - scale.x.range()[0]);
const previousAngle = index === 0 ?
this.getAngle(props, data.length - 1) - (Math.PI * 2) :
this.getAngle(props, index - 1);
if (index === 0 && angularRange < (2 * Math.PI)) {
return scale.x.range()[0];
} else if (alignment === "start" || alignment === "end") {
return alignment === "start" ? previousAngle : currentAngle;
} else {
return (currentAngle + previousAngle) / 2;
}
}
getEndAngle(props, index) {
const { data, scale, alignment } = props;
const currentAngle = this.getAngle(props, index);
const angularRange = Math.abs(scale.x.range()[1] - scale.x.range()[0]);
const lastAngle = scale.x.range()[1] === (2 * Math.PI) ?
this.getAngle(props, 0) + (Math.PI * 2) : scale.x.range()[1];
const nextAngle = index === data.length - 1 ?
this.getAngle(props, 0) + (Math.PI * 2) : this.getAngle(props, index + 1);
if (index === data.length - 1 && angularRange < (2 * Math.PI)) {
return lastAngle;
} else if (alignment === "start" || alignment === "end") {
return alignment === "start" ? currentAngle : nextAngle;
} else {
return (currentAngle + nextAngle) / 2;
}
}
getCustomVerticalPolarBarPath(getPath, props) {
return getPath(props);
}
getVerticalPolarBarPath(props, cornerRadius) { // eslint-disable-line max-statements
const { datum, scale, index, alignment } = props;
const style = Helpers.evaluateStyle(props.style, datum, props.active);
const r1 = scale.y(datum._y0 || 0);
const r2 = scale.y(datum._y1 !== undefined ? datum._y1 : datum._y);
const currentAngle = scale.x(datum._x1 !== undefined ? datum._x1 : datum._x);
let start;
let end;
if (style.width) {
const width = this.getAngularWidth(props, style.width);
const size = alignment === "middle" ? width / 2 : width;
start = alignment === "start" ? currentAngle : currentAngle - size;
end = alignment === "end" ? currentAngle : currentAngle + size;
} else {
start = this.getStartAngle(props, index);
end = this.getEndAngle(props, index);
}
start = this.transformAngle(start);
end = this.transformAngle(end);
if (props.getPath) {
const options = { startAngle: start, endAngle: end, r1, r2, cornerRadius };
const propsWithCalculatedValues = { ...props, ...options };
return this.getCustomVerticalPolarBarPath(props.getPath, propsWithCalculatedValues);
}
const getPath = (edge) => {
const pathFunction = d3Shape.arc()
.innerRadius(r1)
.outerRadius(r2)
.startAngle(start)
.endAngle(end)
.cornerRadius(cornerRadius[edge]);
const path = pathFunction();
const moves = path.match(/[A-Z]/g);
const middle = moves.indexOf("L");
const coords = path.split(/[A-Z]/).slice(1);
const subMoves = edge === "top" ? moves.slice(0, middle) : moves.slice(middle);
const subCoords = edge === "top" ? coords.slice(0, middle) : coords.slice(middle);
return subMoves.map((m, i) => ({ command: m, coords: subCoords[i].split(",") }));
};
const moves = getPath("top").concat(getPath("bottom"));
return moves.reduce((memo, move) => {
memo += `${move.command} ${move.coords.join()}`;
return memo;
}, "");
}
getBarPath(props, width, cornerRadius) {
if (props.getPath) {
return this.getCustomBarPath(props, width);
return getCustomBarPath(props, width);
}
return props.horizontal ?
this.getHorizontalBarPath(props, width, cornerRadius) :
this.getVerticalBarPath(props, width, cornerRadius);
getHorizontalBarPath(props, width, cornerRadius) :
getVerticalBarPath(props, width, cornerRadius);
}

@@ -210,9 +63,9 @@

// TODO Radial bars
return this.getVerticalPolarBarPath(props, cornerRadius);
return getVerticalPolarBarPath(props, cornerRadius);
}
getBarWidth(props, style) {
const { active, scale, data, barWidth, defaultBarWidth } = props;
const { active, scale, data, datum, barWidth, defaultBarWidth } = props;
if (barWidth) {
return isFunction(barWidth) ? Helpers.evaluateProp(barWidth, active) : barWidth;
return isFunction(barWidth) ? Helpers.evaluateProp(barWidth, datum, active) : barWidth;
} else if (style.width) {

@@ -229,12 +82,33 @@ return style.width;

getCornerRadius(props) {
getCornerRadiusFromObject(props) {
const { cornerRadius, datum, active } = props;
const top = isPlainObject(cornerRadius) ? cornerRadius.top : cornerRadius || 0;
const bottom = isPlainObject(cornerRadius) ? cornerRadius.bottom : 0;
return {
top: Helpers.evaluateProp(top, datum, active),
bottom: Helpers.evaluateProp(bottom, datum, active)
const realCornerRadius = { topLeft: 0, topRight: 0, bottomLeft: 0, bottomRight: 0 };
const updateCornerRadius = (corner, fallback) => {
if (!isNil(cornerRadius[corner])) {
realCornerRadius[corner] = Helpers.evaluateProp(cornerRadius[corner], datum, active);
} else if (!isNil(cornerRadius[fallback])) {
realCornerRadius[corner] = Helpers.evaluateProp(cornerRadius[fallback], datum, active);
}
};
updateCornerRadius("topLeft", "top");
updateCornerRadius("topRight", "top");
updateCornerRadius("bottomLeft", "bottom");
updateCornerRadius("bottomRight", "right");
return realCornerRadius;
}
getCornerRadius(props) {
const { cornerRadius, datum, active } = props;
const realCornerRadius = { topLeft: 0, topRight: 0, bottomLeft: 0, bottomRight: 0 };
if (!cornerRadius) {
return realCornerRadius;
}
if (isPlainObject(cornerRadius)) {
return this.getCornerRadiusFromObject(props);
}
realCornerRadius.topLeft = Helpers.evaluateProp(cornerRadius, datum, active);
realCornerRadius.topRight = Helpers.evaluateProp(cornerRadius, datum, active);
return realCornerRadius;
}
render() {

@@ -241,0 +115,0 @@ const {

export { default as VictoryBar } from "./victory-bar";
export { default as Bar } from "./bar";
export {
getVerticalBarPath,
getHorizontalBarPath,
getVerticalPolarBarPath
} from "./path-helper-methods";

@@ -60,3 +60,7 @@ import PropTypes from "prop-types";

top: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
bottom: PropTypes.oneOfType([PropTypes.number, PropTypes.func])
topLeft: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
topRight: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
bottom: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
bottomLeft: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
bottomRight: PropTypes.oneOfType([PropTypes.number, PropTypes.func])
})

@@ -63,0 +67,0 @@ ]),

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is too big to display

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc