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

victory-brush-line

Package Overview
Dependencies
Maintainers
16
Versions
144
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

victory-brush-line - npm Package Compare versions

Comparing version 36.9.2 to 37.0.0

6

CHANGELOG.md
# victory-brush-line
## 37.0.0
### Major Changes
- Upgrade babel dependencies and build target to modern browsers ([#2804](https://github.com/FormidableLabs/victory/pull/2804))
## 36.9.2

@@ -4,0 +10,0 @@

1013

es/victory-brush-line.js
import _pick from "lodash/pick";
import _defaults from "lodash/defaults";
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a 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); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _possibleConstructorReturn(self, call) { if (call && (typeof call === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
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); }
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
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; }
import React from "react";
import { Selection, Helpers, Collection, LineSegment, Scale, Domain, Box } from "victory-core";
import isEqual from "react-fast-compare";
var SMALL_NUMBER = 1 / Number.MAX_SAFE_INTEGER;
var getScale = function (props) {
var _props$scale = props.scale,
scale = _props$scale === void 0 ? {} : _props$scale,
_props$dimension = props.dimension,
dimension = _props$dimension === void 0 ? "x" : _props$dimension;
const SMALL_NUMBER = 1 / Number.MAX_SAFE_INTEGER;
const getScale = props => {
const {
scale = {},
dimension = "x"
} = props;
if (scale[dimension]) {
return scale[dimension];
}
var fallbackScale = Scale.getBaseScale(props, dimension);
var range = Helpers.getRange(props, dimension);
var domain = Domain.getDomainFromProps(props, dimension) || [0, 1];
const fallbackScale = Scale.getBaseScale(props, dimension);
const range = Helpers.getRange(props, dimension);
const domain = Domain.getDomainFromProps(props, dimension) || [0, 1];
fallbackScale.range(range).domain(domain);
return fallbackScale;
};
var getDimension = function (props) {
var horizontal = props.horizontal,
_props$dimension2 = props.dimension,
dimension = _props$dimension2 === void 0 ? "x" : _props$dimension2;
const getDimension = props => {
const {
horizontal,
dimension = "x"
} = props;
if (!horizontal) {
return dimension;
}
return dimension === "x" ? "y" : "x";
};
var toRange = function (props, domain) {
var scale = getScale(props);
return [scale(Math.min.apply(Math, _toConsumableArray(domain))), scale(Math.max.apply(Math, _toConsumableArray(domain)))];
const toRange = (props, domain) => {
const scale = getScale(props);
return [scale(Math.min(...domain)), scale(Math.max(...domain))];
};
var toDomain = function (props, range) {
var scale = getScale(props);
return [scale.invert(Math.min.apply(Math, _toConsumableArray(range))), scale.invert(Math.max.apply(Math, _toConsumableArray(range)))];
const toDomain = (props, range) => {
const scale = getScale(props);
return [scale.invert(Math.min(...range)), scale.invert(Math.max(...range))];
};
var getFullRange = function (props) {
var scale = getScale(props);
const getFullRange = props => {
const scale = getScale(props);
return scale.range();
};
var getFullDomain = function (props) {
var scale = getScale(props);
const getFullDomain = props => {
const scale = getScale(props);
return scale.domain();
};
var withinBound = function (value, bound) {
const withinBound = (value, bound) => {
return value >= Collection.getMinValue(bound) && value <= Collection.getMaxValue(bound);
};
var getBrushDomain = function (brushDomain, fullDomain) {
const getBrushDomain = (brushDomain, fullDomain) => {
if (brushDomain) {
var brushMin = Collection.getMinValue(brushDomain);
var brushMax = Collection.getMaxValue(brushDomain);
var domainMin = Collection.getMinValue(fullDomain);
var domainMax = Collection.getMaxValue(fullDomain);
var defaultMin = brushMin < domainMin ? domainMin : Number(domainMax) - SMALL_NUMBER;
var defaultMax = brushMax > domainMax ? domainMax : Number(domainMin) + SMALL_NUMBER;
var min = withinBound(brushMin, fullDomain) ? brushMin : defaultMin;
var max = withinBound(brushMax, fullDomain) ? brushMax : defaultMax;
const brushMin = Collection.getMinValue(brushDomain);
const brushMax = Collection.getMaxValue(brushDomain);
const domainMin = Collection.getMinValue(fullDomain);
const domainMax = Collection.getMaxValue(fullDomain);
const defaultMin = brushMin < domainMin ? domainMin : Number(domainMax) - SMALL_NUMBER;
const defaultMax = brushMax > domainMax ? domainMax : Number(domainMin) + SMALL_NUMBER;
const min = withinBound(brushMin, fullDomain) ? brushMin : defaultMin;
const max = withinBound(brushMax, fullDomain) ? brushMax : defaultMax;
return [min, max];
}
return fullDomain;
};
var getActiveHandle = function (props, position, range) {
var width = props.handleWidth / 2;
var dimension = getDimension(props);
var getHandle = function (type) {
var base = {
min: dimension === "x" ? Math.min.apply(Math, _toConsumableArray(range)) : Math.max.apply(Math, _toConsumableArray(range)),
max: dimension === "x" ? Math.max.apply(Math, _toConsumableArray(range)) : Math.min.apply(Math, _toConsumableArray(range))
const getActiveHandle = (props, position, range) => {
const width = props.handleWidth / 2;
const dimension = getDimension(props);
const getHandle = type => {
const base = {
min: dimension === "x" ? Math.min(...range) : Math.max(...range),
max: dimension === "x" ? Math.max(...range) : Math.min(...range)
};
return [base[type] - width, base[type] + width];
};
var active = ["min", "max"].reduce(function (memo, type) {
const active = ["min", "max"].reduce((memo, type) => {
memo[type] = withinBound(position, getHandle(type)) ? type : undefined;

@@ -128,32 +80,32 @@ return memo;

};
var getMinimumDomain = function () {
const getMinimumDomain = () => {
return [0, SMALL_NUMBER];
};
var panBox = function (props, position) {
var brushDomain = props.brushDomain,
startPosition = props.startPosition;
var range = toRange(props, brushDomain);
var fullRange = getFullRange(props);
var size = Math.abs(range[1] - range[0]);
var globalMin = Math.min.apply(Math, _toConsumableArray(fullRange));
var globalMax = Math.max.apply(Math, _toConsumableArray(fullRange));
var delta = startPosition ? startPosition - position : 0;
var min = Math.min.apply(Math, _toConsumableArray(range)) - delta;
var max = Math.max.apply(Math, _toConsumableArray(range)) - delta;
var constrainedMin = min > globalMax - size ? globalMax - size : Math.max(min, globalMin);
var constrainedMax = max < globalMin + size ? globalMin + size : Math.min(max, globalMax);
const panBox = (props, position) => {
const {
brushDomain,
startPosition
} = props;
const range = toRange(props, brushDomain);
const fullRange = getFullRange(props);
const size = Math.abs(range[1] - range[0]);
const globalMin = Math.min(...fullRange);
const globalMax = Math.max(...fullRange);
const delta = startPosition ? startPosition - position : 0;
const min = Math.min(...range) - delta;
const max = Math.max(...range) - delta;
const constrainedMin = min > globalMax - size ? globalMax - size : Math.max(min, globalMin);
const constrainedMax = max < globalMin + size ? globalMin + size : Math.min(max, globalMax);
return [constrainedMin, constrainedMax];
};
var fallbackProps = {
const fallbackProps = {
brushAreaStyle: {
stroke: "none",
fill: "black",
opacity: function (_ref) {
var active = _ref.active;
opacity: _ref => {
let {
active
} = _ref;
return active ? 0.2 : 0.1;
} // eslint-disable-line no-magic-numbers
},

@@ -164,7 +116,8 @@ brushStyle: {

fill: "black",
opacity: function (_ref2) {
var active = _ref2.active;
opacity: _ref2 => {
let {
active
} = _ref2;
return active ? 0.4 : 0.3;
} // eslint-disable-line no-magic-numbers
},

@@ -177,456 +130,226 @@ handleStyle: {

};
export var VictoryBrushLine = /*#__PURE__*/function (_React$Component) {
_inherits(VictoryBrushLine, _React$Component);
var _super = _createSuper(VictoryBrushLine);
function VictoryBrushLine() {
_classCallCheck(this, VictoryBrushLine);
return _super.apply(this, arguments);
}
_createClass(VictoryBrushLine, [{
key: "getRectDimensions",
value: function getRectDimensions(props, brushWidth, domain) {
var brushDomain = props.brushDomain;
var dimension = getDimension(props);
var range = toRange(props, domain || getBrushDomain(brushDomain, getFullDomain(props)));
var coordinates = dimension === "x" ? {
y1: props.y1,
y2: props.y2,
x1: Math.min.apply(Math, _toConsumableArray(range)),
x2: Math.max.apply(Math, _toConsumableArray(range))
} : {
x1: props.x1,
x2: props.x2,
y1: Math.min.apply(Math, _toConsumableArray(range)),
y2: Math.max.apply(Math, _toConsumableArray(range))
};
var x1 = coordinates.x1,
x2 = coordinates.x2,
y1 = coordinates.y1,
y2 = coordinates.y2;
var offset = {
x: dimension === "x" ? 0 : brushWidth / 2,
y: dimension === "y" ? 0 : brushWidth / 2
};
var x = Math.min(x1, x2) - offset.x;
var y = Math.min(y1, y2) - offset.y;
var width = Math.max(x1, x2) + offset.x - x;
var height = Math.max(y1, y2) + offset.y - y;
return {
x: x,
y: y,
width: width,
height: height
};
}
}, {
key: "getHandleDimensions",
value: function getHandleDimensions(props) {
var handleWidth = props.handleWidth,
x1 = props.x1,
x2 = props.x2,
y1 = props.y1,
y2 = props.y2,
brushDomain = props.brushDomain;
var dimension = getDimension(props);
var brushWidth = props.brushWidth || props.width;
var domain = getBrushDomain(brushDomain, getFullDomain(props));
var range = toRange(props, domain);
var defaultX = Math.min(x1, x2) - brushWidth / 2;
var defaultY = Math.min(y1, y2) - brushWidth / 2;
var x = {
min: dimension === "x" ? Math.min.apply(Math, _toConsumableArray(range)) - handleWidth / 2 : defaultX,
max: dimension === "x" ? Math.max.apply(Math, _toConsumableArray(range)) - handleWidth / 2 : defaultX
};
var y = {
min: dimension === "y" ? Math.max.apply(Math, _toConsumableArray(range)) - handleWidth / 2 : defaultY,
max: dimension === "y" ? Math.min.apply(Math, _toConsumableArray(range)) - handleWidth / 2 : defaultY
};
var width = dimension === "x" ? handleWidth : brushWidth;
var height = dimension === "x" ? brushWidth : handleWidth;
return {
min: {
x: x.min,
y: y.min,
width: width,
height: height
export class VictoryBrushLine extends React.Component {
static defaultProps = {
allowDrag: true,
allowDraw: true,
allowResize: true,
brushAreaComponent: /*#__PURE__*/React.createElement(Box, null),
brushComponent: /*#__PURE__*/React.createElement(Box, null),
groupComponent: /*#__PURE__*/React.createElement("g", null),
handleComponent: /*#__PURE__*/React.createElement(Box, null),
handleWidth: 10,
lineComponent: /*#__PURE__*/React.createElement(LineSegment, null),
width: 10
};
static defaultEvents = function (props) {
return props.disable ? undefined : [{
target: props.type,
eventHandlers: {
onMouseEnter: (evt, targetProps) => {
evt.preventDefault();
const {
allowResize,
brushDomain
} = targetProps;
const dimension = getDimension(targetProps);
const parentSVG = targetProps.parentSVG || Selection.getParentSVG(evt);
const position = Selection.getSVGEventCoordinates(evt, parentSVG)[dimension];
const fullDomain = getFullDomain(targetProps);
const currentDomain = getBrushDomain(brushDomain, fullDomain);
const range = toRange(targetProps, currentDomain);
const activeHandle = allowResize && getActiveHandle(targetProps, position, range);
const activeBrushes = {
brushArea: !targetProps.brushDomain,
brush: withinBound(position, range) && !isEqual(fullDomain, currentDomain),
minHandle: activeHandle === "min" || activeHandle === "both",
maxHandle: activeHandle === "min" || activeHandle === "both"
};
return [{
mutation: () => ({
activeBrushes,
brushDomain: targetProps.brushDomain,
parentSVG
})
}];
},
max: {
x: x.max,
y: y.max,
width: width,
height: height
}
};
}
}, {
key: "getCursor",
value: function getCursor(props) {
var _props$activeBrushes = props.activeBrushes,
activeBrushes = _props$activeBrushes === void 0 ? {} : _props$activeBrushes;
var dimension = getDimension(props);
onMouseDown: (evt, targetProps) => {
evt.preventDefault();
const {
allowResize,
allowDrag,
allowDraw,
activeBrushes,
brushDomain
} = targetProps;
const dimension = getDimension(targetProps);
if (activeBrushes.minHandle || activeBrushes.maxHandle) {
return dimension === "x" ? "ew-resize" : "ns-resize";
} else if (activeBrushes.brush) {
return "move";
}
return "crosshair";
}
}, {
key: "renderHandles",
value: function renderHandles(props) {
var handleComponent = props.handleComponent,
handleStyle = props.handleStyle,
id = props.id,
brushDomain = props.brushDomain,
_props$datum = props.datum,
datum = _props$datum === void 0 ? {} : _props$datum,
_props$activeBrushes2 = props.activeBrushes,
activeBrushes = _props$activeBrushes2 === void 0 ? {} : _props$activeBrushes2;
if (!brushDomain) {
return null;
}
var handleDimensions = this.getHandleDimensions(props);
var style = Object.assign({}, fallbackProps.handleStyle, handleStyle);
var minDatum = Object.assign({
handleValue: Collection.getMinValue(brushDomain)
}, datum);
var maxDatum = Object.assign({
handleValue: Collection.getMaxValue(brushDomain)
}, datum);
var minHandleProps = Object.assign({
key: "".concat(id, "-min"),
style: Helpers.evaluateStyle(style, {
datum: minDatum,
active: activeBrushes.minHandle
})
}, handleDimensions.min);
var maxHandleProps = Object.assign({
key: "".concat(id, "-max"),
style: Helpers.evaluateStyle(style, {
datum: maxDatum,
active: activeBrushes.maxHandle
})
}, handleDimensions.max);
return [/*#__PURE__*/React.cloneElement(handleComponent, minHandleProps), /*#__PURE__*/React.cloneElement(handleComponent, maxHandleProps)];
}
}, {
key: "renderBrush",
value: function renderBrush(props) {
var brushComponent = props.brushComponent,
brushStyle = props.brushStyle,
_props$activeBrushes3 = props.activeBrushes,
activeBrushes = _props$activeBrushes3 === void 0 ? {} : _props$activeBrushes3,
_props$datum2 = props.datum,
datum = _props$datum2 === void 0 ? {} : _props$datum2,
brushDomain = props.brushDomain;
if (!brushDomain) {
return null;
}
var brushWidth = props.brushWidth || props.width;
var rectDimensions = this.getRectDimensions(props, brushWidth);
var baseStyle = Object.assign({}, fallbackProps.brushStyle, brushStyle);
var style = Helpers.evaluateStyle(baseStyle, {
datum: datum,
active: activeBrushes.brush
});
var brushProps = Object.assign({
style: style
}, rectDimensions);
return /*#__PURE__*/React.cloneElement(brushComponent, brushProps);
}
}, {
key: "renderBrushArea",
value: function renderBrushArea(props) {
var brushAreaComponent = props.brushAreaComponent,
brushAreaStyle = props.brushAreaStyle,
_props$activeBrushes4 = props.activeBrushes,
activeBrushes = _props$activeBrushes4 === void 0 ? {} : _props$activeBrushes4,
_props$datum3 = props.datum,
datum = _props$datum3 === void 0 ? {} : _props$datum3;
var brushAreaWidth = props.brushAreaWidth || props.width;
var cursor = this.getCursor(props);
var rectDimensions = this.getRectDimensions(props, brushAreaWidth, getFullDomain(props));
var baseStyle = Object.assign({
cursor: cursor
}, fallbackProps.brushAreaStyle, brushAreaStyle);
var style = Helpers.evaluateStyle(baseStyle, {
datum: datum,
active: activeBrushes.brushArea
});
var brushAreaProps = Object.assign({
style: style
}, rectDimensions);
return /*#__PURE__*/React.cloneElement(brushAreaComponent, brushAreaProps);
}
}, {
key: "renderLine",
value: function renderLine(props) {
var filteredProps = _pick(props, ["x1", "x2", "y1", "y2", "datum", "scale", "active", "style"]);
return /*#__PURE__*/React.cloneElement(props.lineComponent, filteredProps);
}
}, {
key: "render",
value: function render() {
return /*#__PURE__*/React.createElement("g", this.props.events, this.renderLine(this.props), this.renderBrushArea(this.props), this.renderBrush(this.props), this.renderHandles(this.props));
}
}]);
return VictoryBrushLine;
}(React.Component);
VictoryBrushLine.defaultProps = {
allowDrag: true,
allowDraw: true,
allowResize: true,
brushAreaComponent: /*#__PURE__*/React.createElement(Box, null),
brushComponent: /*#__PURE__*/React.createElement(Box, null),
groupComponent: /*#__PURE__*/React.createElement("g", null),
handleComponent: /*#__PURE__*/React.createElement(Box, null),
handleWidth: 10,
lineComponent: /*#__PURE__*/React.createElement(LineSegment, null),
width: 10
};
VictoryBrushLine.defaultEvents = function (props) {
return props.disable ? undefined : [{
target: props.type,
eventHandlers: {
onMouseEnter: function (evt, targetProps) {
evt.preventDefault();
var allowResize = targetProps.allowResize,
brushDomain = targetProps.brushDomain;
var dimension = getDimension(targetProps);
var parentSVG = targetProps.parentSVG || Selection.getParentSVG(evt);
var position = Selection.getSVGEventCoordinates(evt, parentSVG)[dimension];
var fullDomain = getFullDomain(targetProps);
var currentDomain = getBrushDomain(brushDomain, fullDomain);
var range = toRange(targetProps, currentDomain);
var activeHandle = allowResize && getActiveHandle(targetProps, position, range);
var activeBrushes = {
brushArea: !targetProps.brushDomain,
brush: withinBound(position, range) && !isEqual(fullDomain, currentDomain),
minHandle: activeHandle === "min" || activeHandle === "both",
maxHandle: activeHandle === "min" || activeHandle === "both"
};
return [{
mutation: function () {
return {
activeBrushes: activeBrushes,
brushDomain: targetProps.brushDomain,
parentSVG: parentSVG
};
// Don't trigger events for static brushes
if (!allowResize && !allowDrag) {
return [];
}
}];
},
onMouseDown: function (evt, targetProps) {
evt.preventDefault();
var allowResize = targetProps.allowResize,
allowDrag = targetProps.allowDrag,
allowDraw = targetProps.allowDraw,
activeBrushes = targetProps.activeBrushes,
brushDomain = targetProps.brushDomain;
var dimension = getDimension(targetProps); // Don't trigger events for static brushes
if (!allowResize && !allowDrag) {
return [];
}
var fullDomain = getFullDomain(targetProps);
var currentDomain = getBrushDomain(brushDomain, fullDomain);
var parentSVG = targetProps.parentSVG || Selection.getParentSVG(evt);
var position = Selection.getSVGEventCoordinates(evt, parentSVG)[dimension];
var range = toRange(targetProps, currentDomain);
var activeHandle = allowResize && getActiveHandle(targetProps, position, range); // If the event occurs in any of the handle regions, start a resize
if (activeHandle) {
return [{
mutation: function () {
return {
parentSVG: parentSVG,
isSelecting: true,
activeHandle: activeHandle,
brushDomain: currentDomain,
startPosition: position,
activeBrushes: activeBrushes
};
}
}];
} else if (withinBound(position, range) && !isEqual(fullDomain, currentDomain)) {
// if the event occurs within a selected region start a panning event, unless the whole
// domain is selected
return [{
mutation: function () {
return {
const fullDomain = getFullDomain(targetProps);
const currentDomain = getBrushDomain(brushDomain, fullDomain);
const parentSVG = targetProps.parentSVG || Selection.getParentSVG(evt);
const position = Selection.getSVGEventCoordinates(evt, parentSVG)[dimension];
const range = toRange(targetProps, currentDomain);
const activeHandle = allowResize && getActiveHandle(targetProps, position, range);
// If the event occurs in any of the handle regions, start a resize
if (activeHandle) {
return [{
mutation: () => {
return {
parentSVG,
isSelecting: true,
activeHandle,
brushDomain: currentDomain,
startPosition: position,
activeBrushes
};
}
}];
} else if (withinBound(position, range) && !isEqual(fullDomain, currentDomain)) {
// if the event occurs within a selected region start a panning event, unless the whole
// domain is selected
return [{
mutation: () => ({
isPanning: allowDrag,
startPosition: position,
brushDomain: currentDomain,
activeBrushes: activeBrushes,
parentSVG: parentSVG
};
}
}];
} // if the event occurs outside the region, or if the whole domain is selected,
// start a new selection
return allowDraw ? [{
mutation: function () {
return {
activeBrushes,
parentSVG
})
}];
}
// if the event occurs outside the region, or if the whole domain is selected,
// start a new selection
return allowDraw ? [{
mutation: () => ({
isSelecting: allowResize,
brushDomain: null,
startPosition: position,
activeBrushes: activeBrushes,
parentSVG: parentSVG
};
activeBrushes,
parentSVG
})
}] : [];
},
// eslint-disable-next-line max-statements, complexity
onMouseMove: (evt, targetProps) => {
const {
isPanning,
isSelecting,
allowResize,
allowDrag,
onBrushDomainChange,
brushDomain
} = targetProps;
const dimension = getDimension(targetProps);
if (isPanning || isSelecting) {
evt.preventDefault();
evt.stopPropagation();
}
}] : [];
},
// eslint-disable-next-line max-statements, complexity
onMouseMove: function (evt, targetProps) {
var isPanning = targetProps.isPanning,
isSelecting = targetProps.isSelecting,
allowResize = targetProps.allowResize,
allowDrag = targetProps.allowDrag,
onBrushDomainChange = targetProps.onBrushDomainChange,
brushDomain = targetProps.brushDomain;
var dimension = getDimension(targetProps);
if (isPanning || isSelecting) {
evt.preventDefault();
evt.stopPropagation();
}
var parentSVG = targetProps.parentSVG || Selection.getParentSVG(evt);
var position = Selection.getSVGEventCoordinates(evt, parentSVG)[dimension];
var fullDomain = getFullDomain(targetProps);
var domain = getBrushDomain(brushDomain, fullDomain);
var initialRange = toRange(targetProps, domain);
var activeHandle = getActiveHandle(targetProps, position, initialRange);
var activeBrushes = {
brushArea: !targetProps.brushDomain,
brush: withinBound(position, initialRange) && !isEqual(fullDomain, domain),
minHandle: activeHandle === "min" || activeHandle === "both",
maxHandle: activeHandle === "max" || activeHandle === "both"
};
if (!targetProps.isPanning && !targetProps.isSelecting) {
return [{
mutation: function () {
return {
activeBrushes: activeBrushes,
const parentSVG = targetProps.parentSVG || Selection.getParentSVG(evt);
const position = Selection.getSVGEventCoordinates(evt, parentSVG)[dimension];
const fullDomain = getFullDomain(targetProps);
const domain = getBrushDomain(brushDomain, fullDomain);
const initialRange = toRange(targetProps, domain);
const activeHandle = getActiveHandle(targetProps, position, initialRange);
const activeBrushes = {
brushArea: !targetProps.brushDomain,
brush: withinBound(position, initialRange) && !isEqual(fullDomain, domain),
minHandle: activeHandle === "min" || activeHandle === "both",
maxHandle: activeHandle === "max" || activeHandle === "both"
};
if (!targetProps.isPanning && !targetProps.isSelecting) {
return [{
mutation: () => ({
activeBrushes,
brushDomain: targetProps.brushDomain,
parentSVG: parentSVG
};
}
}];
}
if (allowDrag && isPanning) {
var fullRange = getFullRange(targetProps);
var range = panBox(targetProps, position);
var currentDomain = toDomain(targetProps, range);
var startPosition = Math.max.apply(Math, _toConsumableArray(range)) >= Math.max.apply(Math, _toConsumableArray(fullRange)) || Math.min.apply(Math, _toConsumableArray(range)) <= Math.min.apply(Math, _toConsumableArray(fullRange)) ? targetProps.startPosition : position;
var mutatedProps = {
startPosition: startPosition,
isPanning: true,
brushDomain: currentDomain,
activeBrushes: {
brush: true
},
parentSVG: parentSVG
};
if (Helpers.isFunction(onBrushDomainChange)) {
onBrushDomainChange(currentDomain, _defaults({}, mutatedProps, targetProps));
parentSVG
})
}];
}
return [{
mutation: function () {
return mutatedProps;
if (allowDrag && isPanning) {
const fullRange = getFullRange(targetProps);
const range = panBox(targetProps, position);
const currentDomain = toDomain(targetProps, range);
const startPosition = Math.max(...range) >= Math.max(...fullRange) || Math.min(...range) <= Math.min(...fullRange) ? targetProps.startPosition : position;
const mutatedProps = {
startPosition,
isPanning: true,
brushDomain: currentDomain,
activeBrushes: {
brush: true
},
parentSVG
};
if (Helpers.isFunction(onBrushDomainChange)) {
onBrushDomainChange(currentDomain, _defaults({}, mutatedProps, targetProps));
}
}];
} else if (allowResize && isSelecting) {
var _currentDomain = brushDomain || getMinimumDomain();
var _range = toRange(targetProps, _currentDomain);
var oppositeHandle = targetProps.activeHandle === "min" ? "max" : "min";
var handle = targetProps.activeHandle && getActiveHandle(targetProps, position, _range) === "both" ? oppositeHandle : targetProps.activeHandle;
if (!handle) {
_currentDomain = toDomain(targetProps, [targetProps.startPosition, position]);
} else {
var rangeMax = dimension === "x" ? Math.max.apply(Math, _toConsumableArray(_range)) : Math.min.apply(Math, _toConsumableArray(_range));
var rangeMin = dimension === "x" ? Math.min.apply(Math, _toConsumableArray(_range)) : Math.max.apply(Math, _toConsumableArray(_range));
var min = handle === "max" ? rangeMin : position;
var max = handle === "min" ? rangeMax : position;
_currentDomain = toDomain(targetProps, [min, max]);
return [{
mutation: () => mutatedProps
}];
} else if (allowResize && isSelecting) {
let currentDomain = brushDomain || getMinimumDomain();
const range = toRange(targetProps, currentDomain);
const oppositeHandle = targetProps.activeHandle === "min" ? "max" : "min";
const handle = targetProps.activeHandle && getActiveHandle(targetProps, position, range) === "both" ? oppositeHandle : targetProps.activeHandle;
if (!handle) {
currentDomain = toDomain(targetProps, [targetProps.startPosition, position]);
} else {
const rangeMax = dimension === "x" ? Math.max(...range) : Math.min(...range);
const rangeMin = dimension === "x" ? Math.min(...range) : Math.max(...range);
const min = handle === "max" ? rangeMin : position;
const max = handle === "min" ? rangeMax : position;
currentDomain = toDomain(targetProps, [min, max]);
}
const mutatedProps = {
brushDomain: currentDomain,
startPosition: targetProps.startPosition,
isSelecting,
activeHandle: handle,
parentSVG,
activeBrushes: {
brush: true,
minHandle: activeHandle === "min",
maxHandle: activeHandle === "max"
}
};
if (Helpers.isFunction(onBrushDomainChange)) {
onBrushDomainChange(currentDomain, _defaults({}, mutatedProps, targetProps));
}
return [{
mutation: () => mutatedProps
}];
}
var _mutatedProps = {
brushDomain: _currentDomain,
startPosition: targetProps.startPosition,
isSelecting: isSelecting,
activeHandle: handle,
parentSVG: parentSVG,
activeBrushes: {
brush: true,
minHandle: activeHandle === "min",
maxHandle: activeHandle === "max"
}
return [];
},
onMouseUp: (evt, targetProps) => {
const {
onBrushDomainChange,
brushDomain,
allowResize,
activeBrushes
} = targetProps;
// if the mouse hasn't moved since a mouseDown event, select the whole domain region
const mutatedProps = {
isPanning: false,
isSelecting: false,
activeHandle: null,
startPosition: null,
brushDomain,
activeBrushes
};
if (Helpers.isFunction(onBrushDomainChange)) {
onBrushDomainChange(_currentDomain, _defaults({}, _mutatedProps, targetProps));
if (allowResize && Helpers.isFunction(onBrushDomainChange)) {
onBrushDomainChange(brushDomain, _defaults({}, mutatedProps, targetProps));
}
return [{
mutation: function () {
return _mutatedProps;
}
mutation: () => mutatedProps
}];
}
return [];
},
onMouseUp: function (evt, targetProps) {
var onBrushDomainChange = targetProps.onBrushDomainChange,
brushDomain = targetProps.brushDomain,
allowResize = targetProps.allowResize,
activeBrushes = targetProps.activeBrushes; // if the mouse hasn't moved since a mouseDown event, select the whole domain region
var mutatedProps = {
isPanning: false,
isSelecting: false,
activeHandle: null,
startPosition: null,
brushDomain: brushDomain,
activeBrushes: activeBrushes
};
if (allowResize && Helpers.isFunction(onBrushDomainChange)) {
onBrushDomainChange(brushDomain, _defaults({}, mutatedProps, targetProps));
}
return [{
mutation: function () {
return mutatedProps;
}
}];
},
onMouseLeave: function (evt, targetProps) {
var brushDomain = targetProps.brushDomain;
return [{
mutation: function () {
return {
},
onMouseLeave: (evt, targetProps) => {
const {
brushDomain
} = targetProps;
return [{
mutation: () => ({
isPanning: false,

@@ -636,10 +359,188 @@ isSelecting: false,

startPosition: null,
brushDomain: brushDomain,
brushDomain,
activeBrushes: {}
};
}
}];
})
}];
}
}
}];
};
getRectDimensions(props, brushWidth, domain) {
const {
brushDomain
} = props;
const dimension = getDimension(props);
const range = toRange(props, domain || getBrushDomain(brushDomain, getFullDomain(props)));
const coordinates = dimension === "x" ? {
y1: props.y1,
y2: props.y2,
x1: Math.min(...range),
x2: Math.max(...range)
} : {
x1: props.x1,
x2: props.x2,
y1: Math.min(...range),
y2: Math.max(...range)
};
const {
x1,
x2,
y1,
y2
} = coordinates;
const offset = {
x: dimension === "x" ? 0 : brushWidth / 2,
y: dimension === "y" ? 0 : brushWidth / 2
};
const x = Math.min(x1, x2) - offset.x;
const y = Math.min(y1, y2) - offset.y;
const width = Math.max(x1, x2) + offset.x - x;
const height = Math.max(y1, y2) + offset.y - y;
return {
x,
y,
width,
height
};
}
getHandleDimensions(props) {
const {
handleWidth,
x1,
x2,
y1,
y2,
brushDomain
} = props;
const dimension = getDimension(props);
const brushWidth = props.brushWidth || props.width;
const domain = getBrushDomain(brushDomain, getFullDomain(props));
const range = toRange(props, domain);
const defaultX = Math.min(x1, x2) - brushWidth / 2;
const defaultY = Math.min(y1, y2) - brushWidth / 2;
const x = {
min: dimension === "x" ? Math.min(...range) - handleWidth / 2 : defaultX,
max: dimension === "x" ? Math.max(...range) - handleWidth / 2 : defaultX
};
const y = {
min: dimension === "y" ? Math.max(...range) - handleWidth / 2 : defaultY,
max: dimension === "y" ? Math.min(...range) - handleWidth / 2 : defaultY
};
const width = dimension === "x" ? handleWidth : brushWidth;
const height = dimension === "x" ? brushWidth : handleWidth;
return {
min: {
x: x.min,
y: y.min,
width,
height
},
max: {
x: x.max,
y: y.max,
width,
height
}
};
}
getCursor(props) {
const {
activeBrushes = {}
} = props;
const dimension = getDimension(props);
if (activeBrushes.minHandle || activeBrushes.maxHandle) {
return dimension === "x" ? "ew-resize" : "ns-resize";
} else if (activeBrushes.brush) {
return "move";
}
}];
};
return "crosshair";
}
renderHandles(props) {
const {
handleComponent,
handleStyle,
id,
brushDomain,
datum = {},
activeBrushes = {}
} = props;
if (!brushDomain) {
return null;
}
const handleDimensions = this.getHandleDimensions(props);
const style = Object.assign({}, fallbackProps.handleStyle, handleStyle);
const minDatum = Object.assign({
handleValue: Collection.getMinValue(brushDomain)
}, datum);
const maxDatum = Object.assign({
handleValue: Collection.getMaxValue(brushDomain)
}, datum);
const minHandleProps = Object.assign({
key: `${id}-min`,
style: Helpers.evaluateStyle(style, {
datum: minDatum,
active: activeBrushes.minHandle
})
}, handleDimensions.min);
const maxHandleProps = Object.assign({
key: `${id}-max`,
style: Helpers.evaluateStyle(style, {
datum: maxDatum,
active: activeBrushes.maxHandle
})
}, handleDimensions.max);
return [/*#__PURE__*/React.cloneElement(handleComponent, minHandleProps), /*#__PURE__*/React.cloneElement(handleComponent, maxHandleProps)];
}
renderBrush(props) {
const {
brushComponent,
brushStyle,
activeBrushes = {},
datum = {},
brushDomain
} = props;
if (!brushDomain) {
return null;
}
const brushWidth = props.brushWidth || props.width;
const rectDimensions = this.getRectDimensions(props, brushWidth);
const baseStyle = Object.assign({}, fallbackProps.brushStyle, brushStyle);
const style = Helpers.evaluateStyle(baseStyle, {
datum,
active: activeBrushes.brush
});
const brushProps = Object.assign({
style
}, rectDimensions);
return /*#__PURE__*/React.cloneElement(brushComponent, brushProps);
}
renderBrushArea(props) {
const {
brushAreaComponent,
brushAreaStyle,
activeBrushes = {},
datum = {}
} = props;
const brushAreaWidth = props.brushAreaWidth || props.width;
const cursor = this.getCursor(props);
const rectDimensions = this.getRectDimensions(props, brushAreaWidth, getFullDomain(props));
const baseStyle = Object.assign({
cursor
}, fallbackProps.brushAreaStyle, brushAreaStyle);
const style = Helpers.evaluateStyle(baseStyle, {
datum,
active: activeBrushes.brushArea
});
const brushAreaProps = Object.assign({
style
}, rectDimensions);
return /*#__PURE__*/React.cloneElement(brushAreaComponent, brushAreaProps);
}
renderLine(props) {
const filteredProps = _pick(props, ["x1", "x2", "y1", "y2", "datum", "scale", "active", "style"]);
return /*#__PURE__*/React.cloneElement(props.lineComponent, filteredProps);
}
render() {
return /*#__PURE__*/React.createElement("g", this.props.events, this.renderLine(this.props), this.renderBrushArea(this.props), this.renderBrush(this.props), this.renderHandles(this.props));
}
}

2

lib/index.js

@@ -6,5 +6,3 @@ "use strict";

});
var _victoryBrushLine = require("./victory-brush-line");
Object.keys(_victoryBrushLine).forEach(function (key) {

@@ -11,0 +9,0 @@ if (key === "default" || key === "__esModule") return;

1040

lib/victory-brush-line.js

@@ -7,137 +7,77 @@ "use strict";

exports.VictoryBrushLine = void 0;
var _pick2 = _interopRequireDefault(require("lodash/pick"));
var _defaults2 = _interopRequireDefault(require("lodash/defaults"));
var _react = _interopRequireDefault(require("react"));
var _victoryCore = require("victory-core");
var _reactFastCompare = _interopRequireDefault(require("react-fast-compare"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a 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); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _possibleConstructorReturn(self, call) { if (call && (typeof call === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
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); }
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
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; }
var SMALL_NUMBER = 1 / Number.MAX_SAFE_INTEGER;
var getScale = function (props) {
var _props$scale = props.scale,
scale = _props$scale === void 0 ? {} : _props$scale,
_props$dimension = props.dimension,
dimension = _props$dimension === void 0 ? "x" : _props$dimension;
const SMALL_NUMBER = 1 / Number.MAX_SAFE_INTEGER;
const getScale = props => {
const {
scale = {},
dimension = "x"
} = props;
if (scale[dimension]) {
return scale[dimension];
}
var fallbackScale = _victoryCore.Scale.getBaseScale(props, dimension);
var range = _victoryCore.Helpers.getRange(props, dimension);
var domain = _victoryCore.Domain.getDomainFromProps(props, dimension) || [0, 1];
const fallbackScale = _victoryCore.Scale.getBaseScale(props, dimension);
const range = _victoryCore.Helpers.getRange(props, dimension);
const domain = _victoryCore.Domain.getDomainFromProps(props, dimension) || [0, 1];
fallbackScale.range(range).domain(domain);
return fallbackScale;
};
var getDimension = function (props) {
var horizontal = props.horizontal,
_props$dimension2 = props.dimension,
dimension = _props$dimension2 === void 0 ? "x" : _props$dimension2;
const getDimension = props => {
const {
horizontal,
dimension = "x"
} = props;
if (!horizontal) {
return dimension;
}
return dimension === "x" ? "y" : "x";
};
var toRange = function (props, domain) {
var scale = getScale(props);
return [scale(Math.min.apply(Math, _toConsumableArray(domain))), scale(Math.max.apply(Math, _toConsumableArray(domain)))];
const toRange = (props, domain) => {
const scale = getScale(props);
return [scale(Math.min(...domain)), scale(Math.max(...domain))];
};
var toDomain = function (props, range) {
var scale = getScale(props);
return [scale.invert(Math.min.apply(Math, _toConsumableArray(range))), scale.invert(Math.max.apply(Math, _toConsumableArray(range)))];
const toDomain = (props, range) => {
const scale = getScale(props);
return [scale.invert(Math.min(...range)), scale.invert(Math.max(...range))];
};
var getFullRange = function (props) {
var scale = getScale(props);
const getFullRange = props => {
const scale = getScale(props);
return scale.range();
};
var getFullDomain = function (props) {
var scale = getScale(props);
const getFullDomain = props => {
const scale = getScale(props);
return scale.domain();
};
var withinBound = function (value, bound) {
const withinBound = (value, bound) => {
return value >= _victoryCore.Collection.getMinValue(bound) && value <= _victoryCore.Collection.getMaxValue(bound);
};
var getBrushDomain = function (brushDomain, fullDomain) {
const getBrushDomain = (brushDomain, fullDomain) => {
if (brushDomain) {
var brushMin = _victoryCore.Collection.getMinValue(brushDomain);
var brushMax = _victoryCore.Collection.getMaxValue(brushDomain);
var domainMin = _victoryCore.Collection.getMinValue(fullDomain);
var domainMax = _victoryCore.Collection.getMaxValue(fullDomain);
var defaultMin = brushMin < domainMin ? domainMin : Number(domainMax) - SMALL_NUMBER;
var defaultMax = brushMax > domainMax ? domainMax : Number(domainMin) + SMALL_NUMBER;
var min = withinBound(brushMin, fullDomain) ? brushMin : defaultMin;
var max = withinBound(brushMax, fullDomain) ? brushMax : defaultMax;
const brushMin = _victoryCore.Collection.getMinValue(brushDomain);
const brushMax = _victoryCore.Collection.getMaxValue(brushDomain);
const domainMin = _victoryCore.Collection.getMinValue(fullDomain);
const domainMax = _victoryCore.Collection.getMaxValue(fullDomain);
const defaultMin = brushMin < domainMin ? domainMin : Number(domainMax) - SMALL_NUMBER;
const defaultMax = brushMax > domainMax ? domainMax : Number(domainMin) + SMALL_NUMBER;
const min = withinBound(brushMin, fullDomain) ? brushMin : defaultMin;
const max = withinBound(brushMax, fullDomain) ? brushMax : defaultMax;
return [min, max];
}
return fullDomain;
};
var getActiveHandle = function (props, position, range) {
var width = props.handleWidth / 2;
var dimension = getDimension(props);
var getHandle = function (type) {
var base = {
min: dimension === "x" ? Math.min.apply(Math, _toConsumableArray(range)) : Math.max.apply(Math, _toConsumableArray(range)),
max: dimension === "x" ? Math.max.apply(Math, _toConsumableArray(range)) : Math.min.apply(Math, _toConsumableArray(range))
const getActiveHandle = (props, position, range) => {
const width = props.handleWidth / 2;
const dimension = getDimension(props);
const getHandle = type => {
const base = {
min: dimension === "x" ? Math.min(...range) : Math.max(...range),
max: dimension === "x" ? Math.max(...range) : Math.min(...range)
};
return [base[type] - width, base[type] + width];
};
var active = ["min", "max"].reduce(function (memo, type) {
const active = ["min", "max"].reduce((memo, type) => {
memo[type] = withinBound(position, getHandle(type)) ? type : undefined;

@@ -148,32 +88,32 @@ return memo;

};
var getMinimumDomain = function () {
const getMinimumDomain = () => {
return [0, SMALL_NUMBER];
};
var panBox = function (props, position) {
var brushDomain = props.brushDomain,
startPosition = props.startPosition;
var range = toRange(props, brushDomain);
var fullRange = getFullRange(props);
var size = Math.abs(range[1] - range[0]);
var globalMin = Math.min.apply(Math, _toConsumableArray(fullRange));
var globalMax = Math.max.apply(Math, _toConsumableArray(fullRange));
var delta = startPosition ? startPosition - position : 0;
var min = Math.min.apply(Math, _toConsumableArray(range)) - delta;
var max = Math.max.apply(Math, _toConsumableArray(range)) - delta;
var constrainedMin = min > globalMax - size ? globalMax - size : Math.max(min, globalMin);
var constrainedMax = max < globalMin + size ? globalMin + size : Math.min(max, globalMax);
const panBox = (props, position) => {
const {
brushDomain,
startPosition
} = props;
const range = toRange(props, brushDomain);
const fullRange = getFullRange(props);
const size = Math.abs(range[1] - range[0]);
const globalMin = Math.min(...fullRange);
const globalMax = Math.max(...fullRange);
const delta = startPosition ? startPosition - position : 0;
const min = Math.min(...range) - delta;
const max = Math.max(...range) - delta;
const constrainedMin = min > globalMax - size ? globalMax - size : Math.max(min, globalMin);
const constrainedMax = max < globalMin + size ? globalMin + size : Math.min(max, globalMax);
return [constrainedMin, constrainedMax];
};
var fallbackProps = {
const fallbackProps = {
brushAreaStyle: {
stroke: "none",
fill: "black",
opacity: function (_ref) {
var active = _ref.active;
opacity: _ref => {
let {
active
} = _ref;
return active ? 0.2 : 0.1;
} // eslint-disable-line no-magic-numbers
},

@@ -184,7 +124,8 @@ brushStyle: {

fill: "black",
opacity: function (_ref2) {
var active = _ref2.active;
opacity: _ref2 => {
let {
active
} = _ref2;
return active ? 0.4 : 0.3;
} // eslint-disable-line no-magic-numbers
},

@@ -197,470 +138,226 @@ handleStyle: {

};
var VictoryBrushLine = /*#__PURE__*/function (_React$Component) {
_inherits(VictoryBrushLine, _React$Component);
var _super = _createSuper(VictoryBrushLine);
function VictoryBrushLine() {
_classCallCheck(this, VictoryBrushLine);
return _super.apply(this, arguments);
}
_createClass(VictoryBrushLine, [{
key: "getRectDimensions",
value: function getRectDimensions(props, brushWidth, domain) {
var brushDomain = props.brushDomain;
var dimension = getDimension(props);
var range = toRange(props, domain || getBrushDomain(brushDomain, getFullDomain(props)));
var coordinates = dimension === "x" ? {
y1: props.y1,
y2: props.y2,
x1: Math.min.apply(Math, _toConsumableArray(range)),
x2: Math.max.apply(Math, _toConsumableArray(range))
} : {
x1: props.x1,
x2: props.x2,
y1: Math.min.apply(Math, _toConsumableArray(range)),
y2: Math.max.apply(Math, _toConsumableArray(range))
};
var x1 = coordinates.x1,
x2 = coordinates.x2,
y1 = coordinates.y1,
y2 = coordinates.y2;
var offset = {
x: dimension === "x" ? 0 : brushWidth / 2,
y: dimension === "y" ? 0 : brushWidth / 2
};
var x = Math.min(x1, x2) - offset.x;
var y = Math.min(y1, y2) - offset.y;
var width = Math.max(x1, x2) + offset.x - x;
var height = Math.max(y1, y2) + offset.y - y;
return {
x: x,
y: y,
width: width,
height: height
};
}
}, {
key: "getHandleDimensions",
value: function getHandleDimensions(props) {
var handleWidth = props.handleWidth,
x1 = props.x1,
x2 = props.x2,
y1 = props.y1,
y2 = props.y2,
brushDomain = props.brushDomain;
var dimension = getDimension(props);
var brushWidth = props.brushWidth || props.width;
var domain = getBrushDomain(brushDomain, getFullDomain(props));
var range = toRange(props, domain);
var defaultX = Math.min(x1, x2) - brushWidth / 2;
var defaultY = Math.min(y1, y2) - brushWidth / 2;
var x = {
min: dimension === "x" ? Math.min.apply(Math, _toConsumableArray(range)) - handleWidth / 2 : defaultX,
max: dimension === "x" ? Math.max.apply(Math, _toConsumableArray(range)) - handleWidth / 2 : defaultX
};
var y = {
min: dimension === "y" ? Math.max.apply(Math, _toConsumableArray(range)) - handleWidth / 2 : defaultY,
max: dimension === "y" ? Math.min.apply(Math, _toConsumableArray(range)) - handleWidth / 2 : defaultY
};
var width = dimension === "x" ? handleWidth : brushWidth;
var height = dimension === "x" ? brushWidth : handleWidth;
return {
min: {
x: x.min,
y: y.min,
width: width,
height: height
class VictoryBrushLine extends _react.default.Component {
static defaultProps = {
allowDrag: true,
allowDraw: true,
allowResize: true,
brushAreaComponent: /*#__PURE__*/_react.default.createElement(_victoryCore.Box, null),
brushComponent: /*#__PURE__*/_react.default.createElement(_victoryCore.Box, null),
groupComponent: /*#__PURE__*/_react.default.createElement("g", null),
handleComponent: /*#__PURE__*/_react.default.createElement(_victoryCore.Box, null),
handleWidth: 10,
lineComponent: /*#__PURE__*/_react.default.createElement(_victoryCore.LineSegment, null),
width: 10
};
static defaultEvents = function (props) {
return props.disable ? undefined : [{
target: props.type,
eventHandlers: {
onMouseEnter: (evt, targetProps) => {
evt.preventDefault();
const {
allowResize,
brushDomain
} = targetProps;
const dimension = getDimension(targetProps);
const parentSVG = targetProps.parentSVG || _victoryCore.Selection.getParentSVG(evt);
const position = _victoryCore.Selection.getSVGEventCoordinates(evt, parentSVG)[dimension];
const fullDomain = getFullDomain(targetProps);
const currentDomain = getBrushDomain(brushDomain, fullDomain);
const range = toRange(targetProps, currentDomain);
const activeHandle = allowResize && getActiveHandle(targetProps, position, range);
const activeBrushes = {
brushArea: !targetProps.brushDomain,
brush: withinBound(position, range) && !(0, _reactFastCompare.default)(fullDomain, currentDomain),
minHandle: activeHandle === "min" || activeHandle === "both",
maxHandle: activeHandle === "min" || activeHandle === "both"
};
return [{
mutation: () => ({
activeBrushes,
brushDomain: targetProps.brushDomain,
parentSVG
})
}];
},
max: {
x: x.max,
y: y.max,
width: width,
height: height
}
};
}
}, {
key: "getCursor",
value: function getCursor(props) {
var _props$activeBrushes = props.activeBrushes,
activeBrushes = _props$activeBrushes === void 0 ? {} : _props$activeBrushes;
var dimension = getDimension(props);
onMouseDown: (evt, targetProps) => {
evt.preventDefault();
const {
allowResize,
allowDrag,
allowDraw,
activeBrushes,
brushDomain
} = targetProps;
const dimension = getDimension(targetProps);
if (activeBrushes.minHandle || activeBrushes.maxHandle) {
return dimension === "x" ? "ew-resize" : "ns-resize";
} else if (activeBrushes.brush) {
return "move";
}
return "crosshair";
}
}, {
key: "renderHandles",
value: function renderHandles(props) {
var handleComponent = props.handleComponent,
handleStyle = props.handleStyle,
id = props.id,
brushDomain = props.brushDomain,
_props$datum = props.datum,
datum = _props$datum === void 0 ? {} : _props$datum,
_props$activeBrushes2 = props.activeBrushes,
activeBrushes = _props$activeBrushes2 === void 0 ? {} : _props$activeBrushes2;
if (!brushDomain) {
return null;
}
var handleDimensions = this.getHandleDimensions(props);
var style = Object.assign({}, fallbackProps.handleStyle, handleStyle);
var minDatum = Object.assign({
handleValue: _victoryCore.Collection.getMinValue(brushDomain)
}, datum);
var maxDatum = Object.assign({
handleValue: _victoryCore.Collection.getMaxValue(brushDomain)
}, datum);
var minHandleProps = Object.assign({
key: "".concat(id, "-min"),
style: _victoryCore.Helpers.evaluateStyle(style, {
datum: minDatum,
active: activeBrushes.minHandle
})
}, handleDimensions.min);
var maxHandleProps = Object.assign({
key: "".concat(id, "-max"),
style: _victoryCore.Helpers.evaluateStyle(style, {
datum: maxDatum,
active: activeBrushes.maxHandle
})
}, handleDimensions.max);
return [/*#__PURE__*/_react.default.cloneElement(handleComponent, minHandleProps), /*#__PURE__*/_react.default.cloneElement(handleComponent, maxHandleProps)];
}
}, {
key: "renderBrush",
value: function renderBrush(props) {
var brushComponent = props.brushComponent,
brushStyle = props.brushStyle,
_props$activeBrushes3 = props.activeBrushes,
activeBrushes = _props$activeBrushes3 === void 0 ? {} : _props$activeBrushes3,
_props$datum2 = props.datum,
datum = _props$datum2 === void 0 ? {} : _props$datum2,
brushDomain = props.brushDomain;
if (!brushDomain) {
return null;
}
var brushWidth = props.brushWidth || props.width;
var rectDimensions = this.getRectDimensions(props, brushWidth);
var baseStyle = Object.assign({}, fallbackProps.brushStyle, brushStyle);
var style = _victoryCore.Helpers.evaluateStyle(baseStyle, {
datum: datum,
active: activeBrushes.brush
});
var brushProps = Object.assign({
style: style
}, rectDimensions);
return /*#__PURE__*/_react.default.cloneElement(brushComponent, brushProps);
}
}, {
key: "renderBrushArea",
value: function renderBrushArea(props) {
var brushAreaComponent = props.brushAreaComponent,
brushAreaStyle = props.brushAreaStyle,
_props$activeBrushes4 = props.activeBrushes,
activeBrushes = _props$activeBrushes4 === void 0 ? {} : _props$activeBrushes4,
_props$datum3 = props.datum,
datum = _props$datum3 === void 0 ? {} : _props$datum3;
var brushAreaWidth = props.brushAreaWidth || props.width;
var cursor = this.getCursor(props);
var rectDimensions = this.getRectDimensions(props, brushAreaWidth, getFullDomain(props));
var baseStyle = Object.assign({
cursor: cursor
}, fallbackProps.brushAreaStyle, brushAreaStyle);
var style = _victoryCore.Helpers.evaluateStyle(baseStyle, {
datum: datum,
active: activeBrushes.brushArea
});
var brushAreaProps = Object.assign({
style: style
}, rectDimensions);
return /*#__PURE__*/_react.default.cloneElement(brushAreaComponent, brushAreaProps);
}
}, {
key: "renderLine",
value: function renderLine(props) {
var filteredProps = (0, _pick2.default)(props, ["x1", "x2", "y1", "y2", "datum", "scale", "active", "style"]);
return /*#__PURE__*/_react.default.cloneElement(props.lineComponent, filteredProps);
}
}, {
key: "render",
value: function render() {
return /*#__PURE__*/_react.default.createElement("g", this.props.events, this.renderLine(this.props), this.renderBrushArea(this.props), this.renderBrush(this.props), this.renderHandles(this.props));
}
}]);
return VictoryBrushLine;
}(_react.default.Component);
exports.VictoryBrushLine = VictoryBrushLine;
VictoryBrushLine.defaultProps = {
allowDrag: true,
allowDraw: true,
allowResize: true,
brushAreaComponent: /*#__PURE__*/_react.default.createElement(_victoryCore.Box, null),
brushComponent: /*#__PURE__*/_react.default.createElement(_victoryCore.Box, null),
groupComponent: /*#__PURE__*/_react.default.createElement("g", null),
handleComponent: /*#__PURE__*/_react.default.createElement(_victoryCore.Box, null),
handleWidth: 10,
lineComponent: /*#__PURE__*/_react.default.createElement(_victoryCore.LineSegment, null),
width: 10
};
VictoryBrushLine.defaultEvents = function (props) {
return props.disable ? undefined : [{
target: props.type,
eventHandlers: {
onMouseEnter: function (evt, targetProps) {
evt.preventDefault();
var allowResize = targetProps.allowResize,
brushDomain = targetProps.brushDomain;
var dimension = getDimension(targetProps);
var parentSVG = targetProps.parentSVG || _victoryCore.Selection.getParentSVG(evt);
var position = _victoryCore.Selection.getSVGEventCoordinates(evt, parentSVG)[dimension];
var fullDomain = getFullDomain(targetProps);
var currentDomain = getBrushDomain(brushDomain, fullDomain);
var range = toRange(targetProps, currentDomain);
var activeHandle = allowResize && getActiveHandle(targetProps, position, range);
var activeBrushes = {
brushArea: !targetProps.brushDomain,
brush: withinBound(position, range) && !(0, _reactFastCompare.default)(fullDomain, currentDomain),
minHandle: activeHandle === "min" || activeHandle === "both",
maxHandle: activeHandle === "min" || activeHandle === "both"
};
return [{
mutation: function () {
return {
activeBrushes: activeBrushes,
brushDomain: targetProps.brushDomain,
parentSVG: parentSVG
};
// Don't trigger events for static brushes
if (!allowResize && !allowDrag) {
return [];
}
}];
},
onMouseDown: function (evt, targetProps) {
evt.preventDefault();
var allowResize = targetProps.allowResize,
allowDrag = targetProps.allowDrag,
allowDraw = targetProps.allowDraw,
activeBrushes = targetProps.activeBrushes,
brushDomain = targetProps.brushDomain;
var dimension = getDimension(targetProps); // Don't trigger events for static brushes
if (!allowResize && !allowDrag) {
return [];
}
var fullDomain = getFullDomain(targetProps);
var currentDomain = getBrushDomain(brushDomain, fullDomain);
var parentSVG = targetProps.parentSVG || _victoryCore.Selection.getParentSVG(evt);
var position = _victoryCore.Selection.getSVGEventCoordinates(evt, parentSVG)[dimension];
var range = toRange(targetProps, currentDomain);
var activeHandle = allowResize && getActiveHandle(targetProps, position, range); // If the event occurs in any of the handle regions, start a resize
if (activeHandle) {
return [{
mutation: function () {
return {
parentSVG: parentSVG,
isSelecting: true,
activeHandle: activeHandle,
brushDomain: currentDomain,
startPosition: position,
activeBrushes: activeBrushes
};
}
}];
} else if (withinBound(position, range) && !(0, _reactFastCompare.default)(fullDomain, currentDomain)) {
// if the event occurs within a selected region start a panning event, unless the whole
// domain is selected
return [{
mutation: function () {
return {
const fullDomain = getFullDomain(targetProps);
const currentDomain = getBrushDomain(brushDomain, fullDomain);
const parentSVG = targetProps.parentSVG || _victoryCore.Selection.getParentSVG(evt);
const position = _victoryCore.Selection.getSVGEventCoordinates(evt, parentSVG)[dimension];
const range = toRange(targetProps, currentDomain);
const activeHandle = allowResize && getActiveHandle(targetProps, position, range);
// If the event occurs in any of the handle regions, start a resize
if (activeHandle) {
return [{
mutation: () => {
return {
parentSVG,
isSelecting: true,
activeHandle,
brushDomain: currentDomain,
startPosition: position,
activeBrushes
};
}
}];
} else if (withinBound(position, range) && !(0, _reactFastCompare.default)(fullDomain, currentDomain)) {
// if the event occurs within a selected region start a panning event, unless the whole
// domain is selected
return [{
mutation: () => ({
isPanning: allowDrag,
startPosition: position,
brushDomain: currentDomain,
activeBrushes: activeBrushes,
parentSVG: parentSVG
};
}
}];
} // if the event occurs outside the region, or if the whole domain is selected,
// start a new selection
return allowDraw ? [{
mutation: function () {
return {
activeBrushes,
parentSVG
})
}];
}
// if the event occurs outside the region, or if the whole domain is selected,
// start a new selection
return allowDraw ? [{
mutation: () => ({
isSelecting: allowResize,
brushDomain: null,
startPosition: position,
activeBrushes: activeBrushes,
parentSVG: parentSVG
};
activeBrushes,
parentSVG
})
}] : [];
},
// eslint-disable-next-line max-statements, complexity
onMouseMove: (evt, targetProps) => {
const {
isPanning,
isSelecting,
allowResize,
allowDrag,
onBrushDomainChange,
brushDomain
} = targetProps;
const dimension = getDimension(targetProps);
if (isPanning || isSelecting) {
evt.preventDefault();
evt.stopPropagation();
}
}] : [];
},
// eslint-disable-next-line max-statements, complexity
onMouseMove: function (evt, targetProps) {
var isPanning = targetProps.isPanning,
isSelecting = targetProps.isSelecting,
allowResize = targetProps.allowResize,
allowDrag = targetProps.allowDrag,
onBrushDomainChange = targetProps.onBrushDomainChange,
brushDomain = targetProps.brushDomain;
var dimension = getDimension(targetProps);
if (isPanning || isSelecting) {
evt.preventDefault();
evt.stopPropagation();
}
var parentSVG = targetProps.parentSVG || _victoryCore.Selection.getParentSVG(evt);
var position = _victoryCore.Selection.getSVGEventCoordinates(evt, parentSVG)[dimension];
var fullDomain = getFullDomain(targetProps);
var domain = getBrushDomain(brushDomain, fullDomain);
var initialRange = toRange(targetProps, domain);
var activeHandle = getActiveHandle(targetProps, position, initialRange);
var activeBrushes = {
brushArea: !targetProps.brushDomain,
brush: withinBound(position, initialRange) && !(0, _reactFastCompare.default)(fullDomain, domain),
minHandle: activeHandle === "min" || activeHandle === "both",
maxHandle: activeHandle === "max" || activeHandle === "both"
};
if (!targetProps.isPanning && !targetProps.isSelecting) {
return [{
mutation: function () {
return {
activeBrushes: activeBrushes,
const parentSVG = targetProps.parentSVG || _victoryCore.Selection.getParentSVG(evt);
const position = _victoryCore.Selection.getSVGEventCoordinates(evt, parentSVG)[dimension];
const fullDomain = getFullDomain(targetProps);
const domain = getBrushDomain(brushDomain, fullDomain);
const initialRange = toRange(targetProps, domain);
const activeHandle = getActiveHandle(targetProps, position, initialRange);
const activeBrushes = {
brushArea: !targetProps.brushDomain,
brush: withinBound(position, initialRange) && !(0, _reactFastCompare.default)(fullDomain, domain),
minHandle: activeHandle === "min" || activeHandle === "both",
maxHandle: activeHandle === "max" || activeHandle === "both"
};
if (!targetProps.isPanning && !targetProps.isSelecting) {
return [{
mutation: () => ({
activeBrushes,
brushDomain: targetProps.brushDomain,
parentSVG: parentSVG
};
}
}];
}
if (allowDrag && isPanning) {
var fullRange = getFullRange(targetProps);
var range = panBox(targetProps, position);
var currentDomain = toDomain(targetProps, range);
var startPosition = Math.max.apply(Math, _toConsumableArray(range)) >= Math.max.apply(Math, _toConsumableArray(fullRange)) || Math.min.apply(Math, _toConsumableArray(range)) <= Math.min.apply(Math, _toConsumableArray(fullRange)) ? targetProps.startPosition : position;
var mutatedProps = {
startPosition: startPosition,
isPanning: true,
brushDomain: currentDomain,
activeBrushes: {
brush: true
},
parentSVG: parentSVG
};
if (_victoryCore.Helpers.isFunction(onBrushDomainChange)) {
onBrushDomainChange(currentDomain, (0, _defaults2.default)({}, mutatedProps, targetProps));
parentSVG
})
}];
}
return [{
mutation: function () {
return mutatedProps;
if (allowDrag && isPanning) {
const fullRange = getFullRange(targetProps);
const range = panBox(targetProps, position);
const currentDomain = toDomain(targetProps, range);
const startPosition = Math.max(...range) >= Math.max(...fullRange) || Math.min(...range) <= Math.min(...fullRange) ? targetProps.startPosition : position;
const mutatedProps = {
startPosition,
isPanning: true,
brushDomain: currentDomain,
activeBrushes: {
brush: true
},
parentSVG
};
if (_victoryCore.Helpers.isFunction(onBrushDomainChange)) {
onBrushDomainChange(currentDomain, (0, _defaults2.default)({}, mutatedProps, targetProps));
}
}];
} else if (allowResize && isSelecting) {
var _currentDomain = brushDomain || getMinimumDomain();
var _range = toRange(targetProps, _currentDomain);
var oppositeHandle = targetProps.activeHandle === "min" ? "max" : "min";
var handle = targetProps.activeHandle && getActiveHandle(targetProps, position, _range) === "both" ? oppositeHandle : targetProps.activeHandle;
if (!handle) {
_currentDomain = toDomain(targetProps, [targetProps.startPosition, position]);
} else {
var rangeMax = dimension === "x" ? Math.max.apply(Math, _toConsumableArray(_range)) : Math.min.apply(Math, _toConsumableArray(_range));
var rangeMin = dimension === "x" ? Math.min.apply(Math, _toConsumableArray(_range)) : Math.max.apply(Math, _toConsumableArray(_range));
var min = handle === "max" ? rangeMin : position;
var max = handle === "min" ? rangeMax : position;
_currentDomain = toDomain(targetProps, [min, max]);
return [{
mutation: () => mutatedProps
}];
} else if (allowResize && isSelecting) {
let currentDomain = brushDomain || getMinimumDomain();
const range = toRange(targetProps, currentDomain);
const oppositeHandle = targetProps.activeHandle === "min" ? "max" : "min";
const handle = targetProps.activeHandle && getActiveHandle(targetProps, position, range) === "both" ? oppositeHandle : targetProps.activeHandle;
if (!handle) {
currentDomain = toDomain(targetProps, [targetProps.startPosition, position]);
} else {
const rangeMax = dimension === "x" ? Math.max(...range) : Math.min(...range);
const rangeMin = dimension === "x" ? Math.min(...range) : Math.max(...range);
const min = handle === "max" ? rangeMin : position;
const max = handle === "min" ? rangeMax : position;
currentDomain = toDomain(targetProps, [min, max]);
}
const mutatedProps = {
brushDomain: currentDomain,
startPosition: targetProps.startPosition,
isSelecting,
activeHandle: handle,
parentSVG,
activeBrushes: {
brush: true,
minHandle: activeHandle === "min",
maxHandle: activeHandle === "max"
}
};
if (_victoryCore.Helpers.isFunction(onBrushDomainChange)) {
onBrushDomainChange(currentDomain, (0, _defaults2.default)({}, mutatedProps, targetProps));
}
return [{
mutation: () => mutatedProps
}];
}
var _mutatedProps = {
brushDomain: _currentDomain,
startPosition: targetProps.startPosition,
isSelecting: isSelecting,
activeHandle: handle,
parentSVG: parentSVG,
activeBrushes: {
brush: true,
minHandle: activeHandle === "min",
maxHandle: activeHandle === "max"
}
return [];
},
onMouseUp: (evt, targetProps) => {
const {
onBrushDomainChange,
brushDomain,
allowResize,
activeBrushes
} = targetProps;
// if the mouse hasn't moved since a mouseDown event, select the whole domain region
const mutatedProps = {
isPanning: false,
isSelecting: false,
activeHandle: null,
startPosition: null,
brushDomain,
activeBrushes
};
if (_victoryCore.Helpers.isFunction(onBrushDomainChange)) {
onBrushDomainChange(_currentDomain, (0, _defaults2.default)({}, _mutatedProps, targetProps));
if (allowResize && _victoryCore.Helpers.isFunction(onBrushDomainChange)) {
onBrushDomainChange(brushDomain, (0, _defaults2.default)({}, mutatedProps, targetProps));
}
return [{
mutation: function () {
return _mutatedProps;
}
mutation: () => mutatedProps
}];
}
return [];
},
onMouseUp: function (evt, targetProps) {
var onBrushDomainChange = targetProps.onBrushDomainChange,
brushDomain = targetProps.brushDomain,
allowResize = targetProps.allowResize,
activeBrushes = targetProps.activeBrushes; // if the mouse hasn't moved since a mouseDown event, select the whole domain region
var mutatedProps = {
isPanning: false,
isSelecting: false,
activeHandle: null,
startPosition: null,
brushDomain: brushDomain,
activeBrushes: activeBrushes
};
if (allowResize && _victoryCore.Helpers.isFunction(onBrushDomainChange)) {
onBrushDomainChange(brushDomain, (0, _defaults2.default)({}, mutatedProps, targetProps));
}
return [{
mutation: function () {
return mutatedProps;
}
}];
},
onMouseLeave: function (evt, targetProps) {
var brushDomain = targetProps.brushDomain;
return [{
mutation: function () {
return {
},
onMouseLeave: (evt, targetProps) => {
const {
brushDomain
} = targetProps;
return [{
mutation: () => ({
isPanning: false,

@@ -670,10 +367,189 @@ isSelecting: false,

startPosition: null,
brushDomain: brushDomain,
brushDomain,
activeBrushes: {}
};
}
}];
})
}];
}
}
}];
};
getRectDimensions(props, brushWidth, domain) {
const {
brushDomain
} = props;
const dimension = getDimension(props);
const range = toRange(props, domain || getBrushDomain(brushDomain, getFullDomain(props)));
const coordinates = dimension === "x" ? {
y1: props.y1,
y2: props.y2,
x1: Math.min(...range),
x2: Math.max(...range)
} : {
x1: props.x1,
x2: props.x2,
y1: Math.min(...range),
y2: Math.max(...range)
};
const {
x1,
x2,
y1,
y2
} = coordinates;
const offset = {
x: dimension === "x" ? 0 : brushWidth / 2,
y: dimension === "y" ? 0 : brushWidth / 2
};
const x = Math.min(x1, x2) - offset.x;
const y = Math.min(y1, y2) - offset.y;
const width = Math.max(x1, x2) + offset.x - x;
const height = Math.max(y1, y2) + offset.y - y;
return {
x,
y,
width,
height
};
}
getHandleDimensions(props) {
const {
handleWidth,
x1,
x2,
y1,
y2,
brushDomain
} = props;
const dimension = getDimension(props);
const brushWidth = props.brushWidth || props.width;
const domain = getBrushDomain(brushDomain, getFullDomain(props));
const range = toRange(props, domain);
const defaultX = Math.min(x1, x2) - brushWidth / 2;
const defaultY = Math.min(y1, y2) - brushWidth / 2;
const x = {
min: dimension === "x" ? Math.min(...range) - handleWidth / 2 : defaultX,
max: dimension === "x" ? Math.max(...range) - handleWidth / 2 : defaultX
};
const y = {
min: dimension === "y" ? Math.max(...range) - handleWidth / 2 : defaultY,
max: dimension === "y" ? Math.min(...range) - handleWidth / 2 : defaultY
};
const width = dimension === "x" ? handleWidth : brushWidth;
const height = dimension === "x" ? brushWidth : handleWidth;
return {
min: {
x: x.min,
y: y.min,
width,
height
},
max: {
x: x.max,
y: y.max,
width,
height
}
};
}
getCursor(props) {
const {
activeBrushes = {}
} = props;
const dimension = getDimension(props);
if (activeBrushes.minHandle || activeBrushes.maxHandle) {
return dimension === "x" ? "ew-resize" : "ns-resize";
} else if (activeBrushes.brush) {
return "move";
}
}];
};
return "crosshair";
}
renderHandles(props) {
const {
handleComponent,
handleStyle,
id,
brushDomain,
datum = {},
activeBrushes = {}
} = props;
if (!brushDomain) {
return null;
}
const handleDimensions = this.getHandleDimensions(props);
const style = Object.assign({}, fallbackProps.handleStyle, handleStyle);
const minDatum = Object.assign({
handleValue: _victoryCore.Collection.getMinValue(brushDomain)
}, datum);
const maxDatum = Object.assign({
handleValue: _victoryCore.Collection.getMaxValue(brushDomain)
}, datum);
const minHandleProps = Object.assign({
key: `${id}-min`,
style: _victoryCore.Helpers.evaluateStyle(style, {
datum: minDatum,
active: activeBrushes.minHandle
})
}, handleDimensions.min);
const maxHandleProps = Object.assign({
key: `${id}-max`,
style: _victoryCore.Helpers.evaluateStyle(style, {
datum: maxDatum,
active: activeBrushes.maxHandle
})
}, handleDimensions.max);
return [/*#__PURE__*/_react.default.cloneElement(handleComponent, minHandleProps), /*#__PURE__*/_react.default.cloneElement(handleComponent, maxHandleProps)];
}
renderBrush(props) {
const {
brushComponent,
brushStyle,
activeBrushes = {},
datum = {},
brushDomain
} = props;
if (!brushDomain) {
return null;
}
const brushWidth = props.brushWidth || props.width;
const rectDimensions = this.getRectDimensions(props, brushWidth);
const baseStyle = Object.assign({}, fallbackProps.brushStyle, brushStyle);
const style = _victoryCore.Helpers.evaluateStyle(baseStyle, {
datum,
active: activeBrushes.brush
});
const brushProps = Object.assign({
style
}, rectDimensions);
return /*#__PURE__*/_react.default.cloneElement(brushComponent, brushProps);
}
renderBrushArea(props) {
const {
brushAreaComponent,
brushAreaStyle,
activeBrushes = {},
datum = {}
} = props;
const brushAreaWidth = props.brushAreaWidth || props.width;
const cursor = this.getCursor(props);
const rectDimensions = this.getRectDimensions(props, brushAreaWidth, getFullDomain(props));
const baseStyle = Object.assign({
cursor
}, fallbackProps.brushAreaStyle, brushAreaStyle);
const style = _victoryCore.Helpers.evaluateStyle(baseStyle, {
datum,
active: activeBrushes.brushArea
});
const brushAreaProps = Object.assign({
style
}, rectDimensions);
return /*#__PURE__*/_react.default.cloneElement(brushAreaComponent, brushAreaProps);
}
renderLine(props) {
const filteredProps = (0, _pick2.default)(props, ["x1", "x2", "y1", "y2", "datum", "scale", "active", "style"]);
return /*#__PURE__*/_react.default.cloneElement(props.lineComponent, filteredProps);
}
render() {
return /*#__PURE__*/_react.default.createElement("g", this.props.events, this.renderLine(this.props), this.renderBrushArea(this.props), this.renderBrush(this.props), this.renderHandles(this.props));
}
}
exports.VictoryBrushLine = VictoryBrushLine;

4

package.json
{
"name": "victory-brush-line",
"version": "36.9.2",
"version": "37.0.0",
"description": "Interactive Brush Line Component for Victory",

@@ -25,3 +25,3 @@ "keywords": [

"react-fast-compare": "^3.2.0",
"victory-core": "^36.9.2"
"victory-core": "^37.0.0"
},

@@ -28,0 +28,0 @@ "peerDependencies": {

dist/victory-brush-line.js

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

dist/victory-brush-line.min.js

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

SocketSocket SOC 2 Logo

Product

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

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc