@nivo/axes
Advanced tools
@nivo/axes - npm Package Compare versions
Comparing version 0.56.2 to 0.57.0
@@ -10,11 +10,6 @@ 'use strict'; | ||
| var PropTypes = _interopDefault(require('prop-types')); | ||
| var reactMotion = require('react-motion'); | ||
| var core = require('@nivo/core'); | ||
| var compose = _interopDefault(require('recompose/compose')); | ||
| var withPropsOnChange = _interopDefault(require('recompose/withPropsOnChange')); | ||
| var pure = _interopDefault(require('recompose/pure')); | ||
| var setDisplayName = _interopDefault(require('recompose/setDisplayName')); | ||
| var reactMotion = require('react-motion'); | ||
| var isNumber = _interopDefault(require('lodash/isNumber')); | ||
| var isArray = _interopDefault(require('lodash/isArray')); | ||
| var isFunction = _interopDefault(require('lodash/isFunction')); | ||
| var d3Time = require('d3-time'); | ||
| var d3TimeFormat = require('d3-time-format'); | ||
@@ -36,4 +31,44 @@ var d3Format = require('d3-format'); | ||
| }; | ||
| var getScaleTicks = function getScaleTicks(scale, tickCount) { | ||
| if (scale.ticks) return scale.ticks(tickCount); | ||
| var timeByType = { | ||
| millisecond: [d3Time.timeMillisecond, d3Time.utcMillisecond], | ||
| second: [d3Time.timeSecond, d3Time.utcSecond], | ||
| minute: [d3Time.timeMinute, d3Time.utcMinute], | ||
| hour: [d3Time.timeHour, d3Time.utcHour], | ||
| day: [d3Time.timeDay, d3Time.utcDay], | ||
| week: [d3Time.timeWeek, d3Time.utcWeek], | ||
| sunday: [d3Time.timeSunday, d3Time.utcSunday], | ||
| monday: [d3Time.timeMonday, d3Time.utcMonday], | ||
| tuesday: [d3Time.timeTuesday, d3Time.utcTuesday], | ||
| wednesday: [d3Time.timeWednesday, d3Time.utcWednesday], | ||
| thursday: [d3Time.timeThursday, d3Time.utcThursday], | ||
| friday: [d3Time.timeFriday, d3Time.utcFriday], | ||
| saturday: [d3Time.timeSaturday, d3Time.utcSaturday], | ||
| month: [d3Time.timeMonth, d3Time.utcMonth], | ||
| year: [d3Time.timeYear, d3Time.utcYear] | ||
| }; | ||
| var timeTypes = Object.keys(timeByType); | ||
| var timeIntervalRegexp = new RegExp("^every\\s*(\\d+)?\\s*(".concat(timeTypes.join('|'), ")s?$"), 'i'); | ||
| var getScaleTicks = function getScaleTicks(scale, spec) { | ||
| if (Array.isArray(spec)) { | ||
| return spec; | ||
| } | ||
| if (scale.ticks) { | ||
| if (spec === undefined) { | ||
| return scale.ticks(); | ||
| } | ||
| if (isNumber(spec)) { | ||
| return scale.ticks(spec); | ||
| } | ||
| if (typeof spec === 'string') { | ||
| var matches = spec.match(timeIntervalRegexp); | ||
| if (matches) { | ||
| var timeType = timeByType[matches[2]][1]; | ||
| if (matches[1] === undefined) { | ||
| return scale.ticks(timeType); | ||
| } | ||
| return scale.ticks(timeType.every(Number(matches[1]))); | ||
| } | ||
| throw new Error("Invalid tickValues: ".concat(spec)); | ||
| } | ||
| } | ||
| return scale.domain(); | ||
@@ -45,3 +80,3 @@ }; | ||
| ticksPosition = _ref.ticksPosition, | ||
| _tickValues = _ref.tickValues, | ||
| tickValues = _ref.tickValues, | ||
| tickSize = _ref.tickSize, | ||
@@ -52,5 +87,3 @@ tickPadding = _ref.tickPadding, | ||
| engine = _ref$engine === void 0 ? 'svg' : _ref$engine; | ||
| var tickValues = isArray(_tickValues) ? _tickValues : undefined; | ||
| var tickCount = isNumber(_tickValues) ? _tickValues : undefined; | ||
| var values = tickValues || getScaleTicks(scale, tickCount); | ||
| var values = getScaleTicks(scale, tickValues); | ||
| var textProps = core.textPropsByEngine[engine]; | ||
@@ -120,3 +153,3 @@ var position = scale.bandwidth ? centerScale(scale) : scale; | ||
| var getFormatter = function getFormatter(format, scale) { | ||
| if (!format || isFunction(format)) return format; | ||
| if (!format || typeof format === 'function') return format; | ||
| if (scale.type === 'time') { | ||
@@ -136,3 +169,3 @@ var f = d3TimeFormat.timeFormat(format); | ||
| _values = _ref2.values; | ||
| var lineValues = isArray(_values) ? _values : undefined; | ||
| var lineValues = Array.isArray(_values) ? _values : undefined; | ||
| var lineCount = isNumber(_values) ? _values : undefined; | ||
@@ -166,73 +199,64 @@ var values = lineValues || getScaleTicks(scale, lineCount); | ||
| function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } | ||
| var axisPropTypes = { | ||
| ticksPosition: PropTypes.oneOf(['before', 'after']), | ||
| tickValues: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)])), PropTypes.string]), | ||
| tickSize: PropTypes.number, | ||
| tickPadding: PropTypes.number, | ||
| tickRotation: PropTypes.number, | ||
| format: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), | ||
| renderTick: PropTypes.func, | ||
| legend: PropTypes.node, | ||
| legendPosition: PropTypes.oneOf(['start', 'middle', 'end']), | ||
| legendOffset: PropTypes.number | ||
| }; | ||
| var axisPropType = PropTypes.shape(axisPropTypes); | ||
| function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } | ||
| 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); return Constructor; } | ||
| function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } 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 _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); } | ||
| 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 } }); if (superClass) _setPrototypeOf(subClass, superClass); } | ||
| function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); } | ||
| function _defineProperty$1(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| var AxisTick = | ||
| function (_PureComponent) { | ||
| _inherits(AxisTick, _PureComponent); | ||
| function AxisTick() { | ||
| _classCallCheck(this, AxisTick); | ||
| return _possibleConstructorReturn(this, _getPrototypeOf(AxisTick).apply(this, arguments)); | ||
| var AxisTick = function AxisTick(_ref) { | ||
| var _value = _ref.value, | ||
| x = _ref.x, | ||
| y = _ref.y, | ||
| opacity = _ref.opacity, | ||
| rotate = _ref.rotate, | ||
| format = _ref.format, | ||
| lineX = _ref.lineX, | ||
| lineY = _ref.lineY, | ||
| _onClick = _ref.onClick, | ||
| textX = _ref.textX, | ||
| textY = _ref.textY, | ||
| textBaseline = _ref.textBaseline, | ||
| textAnchor = _ref.textAnchor; | ||
| var theme = core.useTheme(); | ||
| var value = _value; | ||
| if (format !== undefined) { | ||
| value = format(value); | ||
| } | ||
| _createClass(AxisTick, [{ | ||
| key: "render", | ||
| value: function render() { | ||
| var _this$props = this.props, | ||
| _value = _this$props.value, | ||
| x = _this$props.x, | ||
| y = _this$props.y, | ||
| opacity = _this$props.opacity, | ||
| rotate = _this$props.rotate, | ||
| format = _this$props.format, | ||
| lineX = _this$props.lineX, | ||
| lineY = _this$props.lineY, | ||
| _onClick = _this$props.onClick, | ||
| textX = _this$props.textX, | ||
| textY = _this$props.textY, | ||
| textBaseline = _this$props.textBaseline, | ||
| textAnchor = _this$props.textAnchor, | ||
| theme = _this$props.theme; | ||
| var value = _value; | ||
| if (format !== undefined) { | ||
| value = format(value); | ||
| } | ||
| var gStyle = { | ||
| opacity: opacity | ||
| }; | ||
| if (_onClick) { | ||
| gStyle['cursor'] = 'pointer'; | ||
| } | ||
| return React__default.createElement("g", _extends({ | ||
| transform: "translate(".concat(x, ",").concat(y, ")") | ||
| }, _onClick ? { | ||
| onClick: function onClick(e) { | ||
| return _onClick(e, value); | ||
| } | ||
| } : {}, { | ||
| style: gStyle | ||
| }), React__default.createElement("line", { | ||
| x1: 0, | ||
| x2: lineX, | ||
| y1: 0, | ||
| y2: lineY, | ||
| style: theme.axis.ticks.line | ||
| }), React__default.createElement("text", { | ||
| alignmentBaseline: textBaseline, | ||
| textAnchor: textAnchor, | ||
| transform: "translate(".concat(textX, ",").concat(textY, ") rotate(").concat(rotate, ")"), | ||
| style: theme.axis.ticks.text | ||
| }, value)); | ||
| var gStyle = { | ||
| opacity: opacity | ||
| }; | ||
| if (_onClick) { | ||
| gStyle['cursor'] = 'pointer'; | ||
| } | ||
| return React__default.createElement("g", _extends({ | ||
| transform: "translate(".concat(x, ",").concat(y, ")") | ||
| }, _onClick ? { | ||
| onClick: function onClick(e) { | ||
| return _onClick(e, value); | ||
| } | ||
| }]); | ||
| return AxisTick; | ||
| }(React.PureComponent); | ||
| _defineProperty$1(AxisTick, "propTypes", { | ||
| } : {}, { | ||
| style: gStyle | ||
| }), React__default.createElement("line", { | ||
| x1: 0, | ||
| x2: lineX, | ||
| y1: 0, | ||
| y2: lineY, | ||
| style: theme.axis.ticks.line | ||
| }), React__default.createElement("text", { | ||
| dominantBaseline: textBaseline, | ||
| textAnchor: textAnchor, | ||
| transform: "translate(".concat(textX, ",").concat(textY, ") rotate(").concat(rotate, ")"), | ||
| style: theme.axis.ticks.text | ||
| }, value)); | ||
| }; | ||
| AxisTick.propTypes = { | ||
| value: PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)]).isRequired, | ||
@@ -250,15 +274,13 @@ format: PropTypes.func, | ||
| rotate: PropTypes.number.isRequired, | ||
| onClick: PropTypes.func, | ||
| theme: PropTypes.shape({ | ||
| axis: core.axisThemePropType.isRequired | ||
| }).isRequired | ||
| }); | ||
| _defineProperty$1(AxisTick, "defaultProps", { | ||
| onClick: PropTypes.func | ||
| }; | ||
| AxisTick.defaultProps = { | ||
| opacity: 1, | ||
| rotate: 0 | ||
| }); | ||
| }; | ||
| var AxisTick$1 = React.memo(AxisTick); | ||
| function _extends$1() { _extends$1 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1.apply(this, arguments); } | ||
| function _objectSpread$1(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$2(target, key, source[key]); }); } return target; } | ||
| function _defineProperty$2(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| function _objectSpread$1(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$1(target, key, source[key]); }); } return target; } | ||
| function _defineProperty$1(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| var willEnter = function willEnter() { | ||
@@ -287,3 +309,3 @@ return { | ||
| var defaultTickRenderer = function defaultTickRenderer(props) { | ||
| return React__default.createElement(AxisTick, props); | ||
| return React__default.createElement(AxisTick$1, props); | ||
| }; | ||
@@ -306,7 +328,10 @@ var Axis = function Axis(_ref2) { | ||
| legendOffset = _ref2.legendOffset, | ||
| theme = _ref2.theme, | ||
| animate = _ref2.animate, | ||
| motionStiffness = _ref2.motionStiffness, | ||
| motionDamping = _ref2.motionDamping, | ||
| onClick = _ref2.onClick; | ||
| var theme = core.useTheme(); | ||
| var _useMotionConfig = core.useMotionConfig(), | ||
| animate = _useMotionConfig.animate, | ||
| springConfig = _useMotionConfig.springConfig; | ||
| var formatValue = React.useMemo(function () { | ||
| return getFormatter(format, scale); | ||
| }, [format, scale]); | ||
| var _computeCartesianTick = computeCartesianTicks({ | ||
@@ -358,3 +383,3 @@ axis: axis, | ||
| style: _objectSpread$1({ | ||
| alignmentBaseline: 'middle' | ||
| dominantBaseline: 'central' | ||
| }, theme.axis.legend.text) | ||
@@ -369,7 +394,6 @@ }, legend); | ||
| tickIndex: tickIndex, | ||
| format: format, | ||
| format: formatValue, | ||
| rotate: tickRotation, | ||
| textBaseline: textBaseline, | ||
| textAnchor: textAlign, | ||
| theme: theme | ||
| textAnchor: textAlign | ||
| }, tick, onClick ? { | ||
@@ -386,6 +410,2 @@ onClick: onClick | ||
| } | ||
| var springConfig = { | ||
| stiffness: motionStiffness, | ||
| damping: motionDamping | ||
| }; | ||
| return React__default.createElement(reactMotion.Motion, { | ||
@@ -420,6 +440,5 @@ style: { | ||
| tickIndex: tickIndex, | ||
| format: format, | ||
| format: formatValue, | ||
| textBaseline: textBaseline, | ||
| textAnchor: textAlign, | ||
| theme: theme | ||
| textAnchor: textAlign | ||
| }, tick, style, onClick ? { | ||
@@ -443,3 +462,3 @@ onClick: onClick | ||
| }; | ||
| Axis.propTypes = _objectSpread$1({ | ||
| Axis.propTypes = { | ||
| axis: PropTypes.oneOf(['x', 'y']).isRequired, | ||
@@ -451,7 +470,7 @@ scale: PropTypes.func.isRequired, | ||
| ticksPosition: PropTypes.oneOf(['before', 'after']).isRequired, | ||
| tickValues: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)]))]), | ||
| tickValues: axisPropTypes.tickValues, | ||
| tickSize: PropTypes.number.isRequired, | ||
| tickPadding: PropTypes.number.isRequired, | ||
| tickRotation: PropTypes.number.isRequired, | ||
| tickFormat: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), | ||
| format: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), | ||
| renderTick: PropTypes.func.isRequired, | ||
@@ -461,6 +480,4 @@ legend: PropTypes.node, | ||
| legendOffset: PropTypes.number.isRequired, | ||
| theme: PropTypes.shape({ | ||
| axis: core.axisThemePropType.isRequired | ||
| }).isRequired | ||
| }, core.motionPropTypes); | ||
| onClick: PropTypes.func | ||
| }; | ||
| Axis.defaultProps = { | ||
@@ -476,92 +493,39 @@ x: 0, | ||
| }; | ||
| var enhance = compose(core.withMotion(), withPropsOnChange(['format', 'scale'], function (_ref4) { | ||
| var format = _ref4.format, | ||
| scale = _ref4.scale; | ||
| return { | ||
| format: getFormatter(format, scale) | ||
| }; | ||
| }), pure); | ||
| var Axis$1 = setDisplayName('Axis')(enhance(Axis)); | ||
| var Axis$1 = React.memo(Axis); | ||
| var axisPropTypes = { | ||
| ticksPosition: PropTypes.oneOf(['before', 'after']), | ||
| tickValues: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)]))]), | ||
| tickSize: PropTypes.number, | ||
| tickPadding: PropTypes.number, | ||
| tickRotation: PropTypes.number, | ||
| format: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), | ||
| renderTick: PropTypes.func, | ||
| legend: PropTypes.node, | ||
| legendPosition: PropTypes.oneOf(['start', 'middle', 'end']), | ||
| legendOffset: PropTypes.number | ||
| }; | ||
| var axisPropType = PropTypes.shape(axisPropTypes); | ||
| function _objectSpread$2(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$3(target, key, source[key]); }); } return target; } | ||
| function _typeof$1(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$1 = function _typeof(obj) { return typeof obj; }; } else { _typeof$1 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$1(obj); } | ||
| function _extends$2() { _extends$2 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$2.apply(this, arguments); } | ||
| function _classCallCheck$1(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } | ||
| function _defineProperties$1(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$1(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$1(Constructor.prototype, protoProps); if (staticProps) _defineProperties$1(Constructor, staticProps); return Constructor; } | ||
| function _possibleConstructorReturn$1(self, call) { if (call && (_typeof$1(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized$1(self); } | ||
| function _assertThisInitialized$1(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } | ||
| function _getPrototypeOf$1(o) { _getPrototypeOf$1 = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf$1(o); } | ||
| function _inherits$1(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 } }); if (superClass) _setPrototypeOf$1(subClass, superClass); } | ||
| function _setPrototypeOf$1(o, p) { _setPrototypeOf$1 = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf$1(o, p); } | ||
| function _defineProperty$3(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| var positions = ['top', 'right', 'bottom', 'left']; | ||
| var Axes = | ||
| function (_PureComponent) { | ||
| _inherits$1(Axes, _PureComponent); | ||
| function Axes() { | ||
| _classCallCheck$1(this, Axes); | ||
| return _possibleConstructorReturn$1(this, _getPrototypeOf$1(Axes).apply(this, arguments)); | ||
| } | ||
| _createClass$1(Axes, [{ | ||
| key: "render", | ||
| value: function render() { | ||
| var _this$props = this.props, | ||
| xScale = _this$props.xScale, | ||
| yScale = _this$props.yScale, | ||
| width = _this$props.width, | ||
| height = _this$props.height, | ||
| top = _this$props.top, | ||
| right = _this$props.right, | ||
| bottom = _this$props.bottom, | ||
| left = _this$props.left, | ||
| theme = _this$props.theme, | ||
| animate = _this$props.animate, | ||
| motionStiffness = _this$props.motionStiffness, | ||
| motionDamping = _this$props.motionDamping; | ||
| var axes = { | ||
| top: top, | ||
| right: right, | ||
| bottom: bottom, | ||
| left: left | ||
| }; | ||
| return React__default.createElement(React.Fragment, null, positions.map(function (position) { | ||
| var axis = axes[position]; | ||
| if (!axis) return null; | ||
| var isXAxis = position === 'top' || position === 'bottom'; | ||
| var ticksPosition = position === 'top' || position === 'left' ? 'before' : 'after'; | ||
| return React__default.createElement(Axis$1, _extends$2({ | ||
| key: position | ||
| }, axis, { | ||
| axis: isXAxis ? 'x' : 'y', | ||
| x: position === 'right' ? width : 0, | ||
| y: position === 'bottom' ? height : 0, | ||
| scale: isXAxis ? xScale : yScale, | ||
| length: isXAxis ? width : height, | ||
| ticksPosition: ticksPosition, | ||
| theme: theme, | ||
| animate: animate, | ||
| motionDamping: motionDamping, | ||
| motionStiffness: motionStiffness | ||
| })); | ||
| })); | ||
| } | ||
| }]); | ||
| return Axes; | ||
| }(React.PureComponent); | ||
| _defineProperty$3(Axes, "propTypes", _objectSpread$2({ | ||
| var Axes = function Axes(_ref) { | ||
| var xScale = _ref.xScale, | ||
| yScale = _ref.yScale, | ||
| width = _ref.width, | ||
| height = _ref.height, | ||
| top = _ref.top, | ||
| right = _ref.right, | ||
| bottom = _ref.bottom, | ||
| left = _ref.left; | ||
| var axes = { | ||
| top: top, | ||
| right: right, | ||
| bottom: bottom, | ||
| left: left | ||
| }; | ||
| return positions.map(function (position) { | ||
| var axis = axes[position]; | ||
| if (!axis) return null; | ||
| var isXAxis = position === 'top' || position === 'bottom'; | ||
| var ticksPosition = position === 'top' || position === 'left' ? 'before' : 'after'; | ||
| return React__default.createElement(Axis$1, _extends$2({ | ||
| key: position | ||
| }, axis, { | ||
| axis: isXAxis ? 'x' : 'y', | ||
| x: position === 'right' ? width : 0, | ||
| y: position === 'bottom' ? height : 0, | ||
| scale: isXAxis ? xScale : yScale, | ||
| length: isXAxis ? width : height, | ||
| ticksPosition: ticksPosition | ||
| })); | ||
| }); | ||
| }; | ||
| Axes.propTypes = { | ||
| xScale: PropTypes.func.isRequired, | ||
@@ -574,7 +538,5 @@ yScale: PropTypes.func.isRequired, | ||
| bottom: axisPropType, | ||
| left: axisPropType, | ||
| theme: PropTypes.shape({ | ||
| axis: core.axisThemePropType.isRequired | ||
| }).isRequired | ||
| }, core.motionPropTypes)); | ||
| left: axisPropType | ||
| }; | ||
| var Axes$1 = React.memo(Axes); | ||
@@ -596,30 +558,15 @@ var GridLine = function GridLine(props) { | ||
| }; | ||
| var GridLine$1 = React.memo(GridLine); | ||
| function _typeof$2(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$2 = function _typeof(obj) { return typeof obj; }; } else { _typeof$2 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$2(obj); } | ||
| function _extends$3() { _extends$3 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$3.apply(this, arguments); } | ||
| function _classCallCheck$2(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } | ||
| function _defineProperties$2(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$2(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$2(Constructor.prototype, protoProps); if (staticProps) _defineProperties$2(Constructor, staticProps); return Constructor; } | ||
| function _possibleConstructorReturn$2(self, call) { if (call && (_typeof$2(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized$2(self); } | ||
| function _getPrototypeOf$2(o) { _getPrototypeOf$2 = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf$2(o); } | ||
| function _assertThisInitialized$2(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } | ||
| function _inherits$2(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 } }); if (superClass) _setPrototypeOf$2(subClass, superClass); } | ||
| function _setPrototypeOf$2(o, p) { _setPrototypeOf$2 = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf$2(o, p); } | ||
| function _defineProperty$4(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| var GridLines = | ||
| function (_Component) { | ||
| _inherits$2(GridLines, _Component); | ||
| function GridLines(props) { | ||
| var _this; | ||
| _classCallCheck$2(this, GridLines); | ||
| _this = _possibleConstructorReturn$2(this, _getPrototypeOf$2(GridLines).call(this, props)); | ||
| _this.willEnter = _this.willEnter.bind(_assertThisInitialized$2(_this)); | ||
| _this.willLeave = _this.willLeave.bind(_assertThisInitialized$2(_this)); | ||
| return _this; | ||
| } | ||
| _createClass$2(GridLines, [{ | ||
| key: "willEnter", | ||
| value: function willEnter(_ref) { | ||
| var style = _ref.style; | ||
| var type = this.props.type; | ||
| var GridLines = function GridLines(_ref) { | ||
| var type = _ref.type, | ||
| lines = _ref.lines; | ||
| var theme = core.useTheme(); | ||
| var _useMotionConfig = core.useMotionConfig(), | ||
| animate = _useMotionConfig.animate, | ||
| springConfig = _useMotionConfig.springConfig; | ||
| var lineWillEnter = React.useMemo(function () { | ||
| return function (_ref2) { | ||
| var style = _ref2.style; | ||
| return { | ||
@@ -632,14 +579,7 @@ opacity: 0, | ||
| }; | ||
| } | ||
| }, { | ||
| key: "willLeave", | ||
| value: function willLeave(_ref2) { | ||
| var style = _ref2.style; | ||
| var _this$props = this.props, | ||
| motionStiffness = _this$props.motionStiffness, | ||
| motionDamping = _this$props.motionDamping; | ||
| var springConfig = { | ||
| stiffness: motionStiffness, | ||
| damping: motionDamping | ||
| }; | ||
| }; | ||
| }, [type]); | ||
| var lineWillLeave = React.useMemo(function () { | ||
| return function (_ref3) { | ||
| var style = _ref3.style; | ||
| return { | ||
@@ -652,52 +592,37 @@ opacity: reactMotion.spring(0, springConfig), | ||
| }; | ||
| } | ||
| }, { | ||
| key: "render", | ||
| value: function render() { | ||
| var _this$props2 = this.props, | ||
| lines = _this$props2.lines, | ||
| animate = _this$props2.animate, | ||
| motionStiffness = _this$props2.motionStiffness, | ||
| motionDamping = _this$props2.motionDamping, | ||
| theme = _this$props2.theme; | ||
| if (!animate) { | ||
| return React__default.createElement("g", null, lines.map(function (line) { | ||
| return React__default.createElement(GridLine, _extends$3({ | ||
| key: line.key | ||
| }, line, theme.grid.line)); | ||
| })); | ||
| } | ||
| var springConfig = { | ||
| stiffness: motionStiffness, | ||
| damping: motionDamping | ||
| }; | ||
| }, [springConfig]); | ||
| if (!animate) { | ||
| return React__default.createElement("g", null, lines.map(function (line) { | ||
| return React__default.createElement(GridLine$1, _extends$3({ | ||
| key: line.key | ||
| }, line, theme.grid.line)); | ||
| })); | ||
| } | ||
| return React__default.createElement(reactMotion.TransitionMotion, { | ||
| willEnter: lineWillEnter, | ||
| willLeave: lineWillLeave, | ||
| styles: lines.map(function (line) { | ||
| return { | ||
| key: line.key, | ||
| style: { | ||
| opacity: reactMotion.spring(1, springConfig), | ||
| x1: reactMotion.spring(line.x1 || 0, springConfig), | ||
| x2: reactMotion.spring(line.x2 || 0, springConfig), | ||
| y1: reactMotion.spring(line.y1 || 0, springConfig), | ||
| y2: reactMotion.spring(line.y2 || 0, springConfig) | ||
| } | ||
| }; | ||
| return React__default.createElement(reactMotion.TransitionMotion, { | ||
| willEnter: this.willEnter, | ||
| willLeave: this.willLeave, | ||
| styles: lines.map(function (line) { | ||
| return { | ||
| key: line.key, | ||
| style: { | ||
| opacity: reactMotion.spring(1, springConfig), | ||
| x1: reactMotion.spring(line.x1 || 0, springConfig), | ||
| x2: reactMotion.spring(line.x2 || 0, springConfig), | ||
| y1: reactMotion.spring(line.y1 || 0, springConfig), | ||
| y2: reactMotion.spring(line.y2 || 0, springConfig) | ||
| } | ||
| }; | ||
| }) | ||
| }, function (interpolatedStyles) { | ||
| return React__default.createElement("g", null, interpolatedStyles.map(function (interpolatedStyle) { | ||
| var key = interpolatedStyle.key, | ||
| style = interpolatedStyle.style; | ||
| return React__default.createElement(GridLine, _extends$3({ | ||
| key: key | ||
| }, theme.grid.line, style)); | ||
| })); | ||
| }); | ||
| } | ||
| }]); | ||
| return GridLines; | ||
| }(React.Component); | ||
| _defineProperty$4(GridLines, "propTypes", { | ||
| }) | ||
| }, function (interpolatedStyles) { | ||
| return React__default.createElement("g", null, interpolatedStyles.map(function (interpolatedStyle) { | ||
| var key = interpolatedStyle.key, | ||
| style = interpolatedStyle.style; | ||
| return React__default.createElement(GridLine$1, _extends$3({ | ||
| key: key | ||
| }, theme.grid.line, style)); | ||
| })); | ||
| }); | ||
| }; | ||
| GridLines.propTypes = { | ||
| type: PropTypes.oneOf(['x', 'y']).isRequired, | ||
@@ -710,11 +635,6 @@ lines: PropTypes.arrayOf(PropTypes.shape({ | ||
| y2: PropTypes.number | ||
| })).isRequired, | ||
| theme: PropTypes.object.isRequired, | ||
| animate: PropTypes.bool.isRequired, | ||
| motionStiffness: PropTypes.number.isRequired, | ||
| motionDamping: PropTypes.number.isRequired | ||
| }); | ||
| })).isRequired | ||
| }; | ||
| var GridLines$1 = React.memo(GridLines); | ||
| function _objectSpread$3(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$5(target, key, source[key]); }); } return target; } | ||
| function _defineProperty$5(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| var Grid = function Grid(_ref) { | ||
@@ -726,14 +646,13 @@ var width = _ref.width, | ||
| xValues = _ref.xValues, | ||
| yValues = _ref.yValues, | ||
| theme = _ref.theme, | ||
| animate = _ref.animate, | ||
| motionStiffness = _ref.motionStiffness, | ||
| motionDamping = _ref.motionDamping; | ||
| var xLines = xScale ? computeGridLines({ | ||
| width: width, | ||
| height: height, | ||
| scale: xScale, | ||
| axis: 'x', | ||
| values: xValues | ||
| }) : false; | ||
| yValues = _ref.yValues; | ||
| var xLines = React.useMemo(function () { | ||
| if (!xScale) return false; | ||
| return computeGridLines({ | ||
| width: width, | ||
| height: height, | ||
| scale: xScale, | ||
| axis: 'x', | ||
| values: xValues | ||
| }); | ||
| }, [xScale, xValues]); | ||
| var yLines = yScale ? computeGridLines({ | ||
@@ -746,19 +665,11 @@ width: width, | ||
| }) : false; | ||
| return React__default.createElement("g", null, xLines && React__default.createElement(GridLines, { | ||
| return React__default.createElement(React__default.Fragment, null, xLines && React__default.createElement(GridLines$1, { | ||
| type: "x", | ||
| lines: xLines, | ||
| theme: theme, | ||
| animate: animate, | ||
| motionStiffness: motionStiffness, | ||
| motionDamping: motionDamping | ||
| }), yLines && React__default.createElement(GridLines, { | ||
| lines: xLines | ||
| }), yLines && React__default.createElement(GridLines$1, { | ||
| type: "y", | ||
| lines: yLines, | ||
| theme: theme, | ||
| animate: animate, | ||
| motionStiffness: motionStiffness, | ||
| motionDamping: motionDamping | ||
| lines: yLines | ||
| })); | ||
| }; | ||
| Grid.propTypes = _objectSpread$3({ | ||
| Grid.propTypes = { | ||
| width: PropTypes.number.isRequired, | ||
@@ -769,7 +680,5 @@ height: PropTypes.number.isRequired, | ||
| xValues: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)]))]), | ||
| yValues: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)]))]), | ||
| theme: PropTypes.object.isRequired | ||
| }, core.motionPropTypes); | ||
| Grid.defaultProps = {}; | ||
| var Grid$1 = pure(Grid); | ||
| yValues: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)]))]) | ||
| }; | ||
| var Grid$1 = React.memo(Grid); | ||
@@ -780,4 +689,4 @@ var degreesToRadians = function degreesToRadians(degrees) { | ||
| function _objectSpread$4(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$6(target, key, source[key]); }); } return target; } | ||
| function _defineProperty$6(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| function _objectSpread$2(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$2(target, key, source[key]); }); } return target; } | ||
| function _defineProperty$2(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| var renderAxisToCanvas = function renderAxisToCanvas(ctx, _ref) { | ||
@@ -914,3 +823,3 @@ var axis = _ref.axis, | ||
| var format = getFormatter(axis.format, scale); | ||
| renderAxisToCanvas(ctx, _objectSpread$4({}, axis, { | ||
| renderAxisToCanvas(ctx, _objectSpread$2({}, axis, { | ||
| axis: isXAxis ? 'x' : 'y', | ||
@@ -948,3 +857,3 @@ x: position === 'right' ? width : 0, | ||
| exports.Axes = Axes; | ||
| exports.Axes = Axes$1; | ||
| exports.Axis = Axis$1; | ||
@@ -951,0 +860,0 @@ exports.Grid = Grid$1; |
@@ -1,12 +0,7 @@ | ||
| import React, { PureComponent, Fragment, Component } from 'react'; | ||
| import React, { memo, useMemo, Fragment } from 'react'; | ||
| import PropTypes from 'prop-types'; | ||
| import { textPropsByEngine, axisThemePropType, motionPropTypes, withMotion } from '@nivo/core'; | ||
| import compose from 'recompose/compose'; | ||
| import withPropsOnChange from 'recompose/withPropsOnChange'; | ||
| import pure from 'recompose/pure'; | ||
| import setDisplayName from 'recompose/setDisplayName'; | ||
| import { Motion, spring, TransitionMotion } from 'react-motion'; | ||
| import { textPropsByEngine, useTheme, useMotionConfig } from '@nivo/core'; | ||
| import isNumber from 'lodash/isNumber'; | ||
| import isArray from 'lodash/isArray'; | ||
| import isFunction from 'lodash/isFunction'; | ||
| import { timeMillisecond, utcMillisecond, timeSecond, utcSecond, timeMinute, utcMinute, timeHour, utcHour, timeDay, utcDay, timeWeek, utcWeek, timeSunday, utcSunday, timeMonday, utcMonday, timeTuesday, utcTuesday, timeWednesday, utcWednesday, timeThursday, utcThursday, timeFriday, utcFriday, timeSaturday, utcSaturday, timeMonth, utcMonth, timeYear, utcYear } from 'd3-time'; | ||
| import { timeFormat } from 'd3-time-format'; | ||
@@ -28,4 +23,44 @@ import { format } from 'd3-format'; | ||
| }; | ||
| var getScaleTicks = function getScaleTicks(scale, tickCount) { | ||
| if (scale.ticks) return scale.ticks(tickCount); | ||
| var timeByType = { | ||
| millisecond: [timeMillisecond, utcMillisecond], | ||
| second: [timeSecond, utcSecond], | ||
| minute: [timeMinute, utcMinute], | ||
| hour: [timeHour, utcHour], | ||
| day: [timeDay, utcDay], | ||
| week: [timeWeek, utcWeek], | ||
| sunday: [timeSunday, utcSunday], | ||
| monday: [timeMonday, utcMonday], | ||
| tuesday: [timeTuesday, utcTuesday], | ||
| wednesday: [timeWednesday, utcWednesday], | ||
| thursday: [timeThursday, utcThursday], | ||
| friday: [timeFriday, utcFriday], | ||
| saturday: [timeSaturday, utcSaturday], | ||
| month: [timeMonth, utcMonth], | ||
| year: [timeYear, utcYear] | ||
| }; | ||
| var timeTypes = Object.keys(timeByType); | ||
| var timeIntervalRegexp = new RegExp("^every\\s*(\\d+)?\\s*(".concat(timeTypes.join('|'), ")s?$"), 'i'); | ||
| var getScaleTicks = function getScaleTicks(scale, spec) { | ||
| if (Array.isArray(spec)) { | ||
| return spec; | ||
| } | ||
| if (scale.ticks) { | ||
| if (spec === undefined) { | ||
| return scale.ticks(); | ||
| } | ||
| if (isNumber(spec)) { | ||
| return scale.ticks(spec); | ||
| } | ||
| if (typeof spec === 'string') { | ||
| var matches = spec.match(timeIntervalRegexp); | ||
| if (matches) { | ||
| var timeType = timeByType[matches[2]][1]; | ||
| if (matches[1] === undefined) { | ||
| return scale.ticks(timeType); | ||
| } | ||
| return scale.ticks(timeType.every(Number(matches[1]))); | ||
| } | ||
| throw new Error("Invalid tickValues: ".concat(spec)); | ||
| } | ||
| } | ||
| return scale.domain(); | ||
@@ -37,3 +72,3 @@ }; | ||
| ticksPosition = _ref.ticksPosition, | ||
| _tickValues = _ref.tickValues, | ||
| tickValues = _ref.tickValues, | ||
| tickSize = _ref.tickSize, | ||
@@ -44,5 +79,3 @@ tickPadding = _ref.tickPadding, | ||
| engine = _ref$engine === void 0 ? 'svg' : _ref$engine; | ||
| var tickValues = isArray(_tickValues) ? _tickValues : undefined; | ||
| var tickCount = isNumber(_tickValues) ? _tickValues : undefined; | ||
| var values = tickValues || getScaleTicks(scale, tickCount); | ||
| var values = getScaleTicks(scale, tickValues); | ||
| var textProps = textPropsByEngine[engine]; | ||
@@ -112,3 +145,3 @@ var position = scale.bandwidth ? centerScale(scale) : scale; | ||
| var getFormatter = function getFormatter(format$1, scale) { | ||
| if (!format$1 || isFunction(format$1)) return format$1; | ||
| if (!format$1 || typeof format$1 === 'function') return format$1; | ||
| if (scale.type === 'time') { | ||
@@ -128,3 +161,3 @@ var f = timeFormat(format$1); | ||
| _values = _ref2.values; | ||
| var lineValues = isArray(_values) ? _values : undefined; | ||
| var lineValues = Array.isArray(_values) ? _values : undefined; | ||
| var lineCount = isNumber(_values) ? _values : undefined; | ||
@@ -158,73 +191,64 @@ var values = lineValues || getScaleTicks(scale, lineCount); | ||
| function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } | ||
| var axisPropTypes = { | ||
| ticksPosition: PropTypes.oneOf(['before', 'after']), | ||
| tickValues: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)])), PropTypes.string]), | ||
| tickSize: PropTypes.number, | ||
| tickPadding: PropTypes.number, | ||
| tickRotation: PropTypes.number, | ||
| format: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), | ||
| renderTick: PropTypes.func, | ||
| legend: PropTypes.node, | ||
| legendPosition: PropTypes.oneOf(['start', 'middle', 'end']), | ||
| legendOffset: PropTypes.number | ||
| }; | ||
| var axisPropType = PropTypes.shape(axisPropTypes); | ||
| function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } | ||
| 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); return Constructor; } | ||
| function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } 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 _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); } | ||
| 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 } }); if (superClass) _setPrototypeOf(subClass, superClass); } | ||
| function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); } | ||
| function _defineProperty$1(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| var AxisTick = | ||
| function (_PureComponent) { | ||
| _inherits(AxisTick, _PureComponent); | ||
| function AxisTick() { | ||
| _classCallCheck(this, AxisTick); | ||
| return _possibleConstructorReturn(this, _getPrototypeOf(AxisTick).apply(this, arguments)); | ||
| var AxisTick = function AxisTick(_ref) { | ||
| var _value = _ref.value, | ||
| x = _ref.x, | ||
| y = _ref.y, | ||
| opacity = _ref.opacity, | ||
| rotate = _ref.rotate, | ||
| format = _ref.format, | ||
| lineX = _ref.lineX, | ||
| lineY = _ref.lineY, | ||
| _onClick = _ref.onClick, | ||
| textX = _ref.textX, | ||
| textY = _ref.textY, | ||
| textBaseline = _ref.textBaseline, | ||
| textAnchor = _ref.textAnchor; | ||
| var theme = useTheme(); | ||
| var value = _value; | ||
| if (format !== undefined) { | ||
| value = format(value); | ||
| } | ||
| _createClass(AxisTick, [{ | ||
| key: "render", | ||
| value: function render() { | ||
| var _this$props = this.props, | ||
| _value = _this$props.value, | ||
| x = _this$props.x, | ||
| y = _this$props.y, | ||
| opacity = _this$props.opacity, | ||
| rotate = _this$props.rotate, | ||
| format = _this$props.format, | ||
| lineX = _this$props.lineX, | ||
| lineY = _this$props.lineY, | ||
| _onClick = _this$props.onClick, | ||
| textX = _this$props.textX, | ||
| textY = _this$props.textY, | ||
| textBaseline = _this$props.textBaseline, | ||
| textAnchor = _this$props.textAnchor, | ||
| theme = _this$props.theme; | ||
| var value = _value; | ||
| if (format !== undefined) { | ||
| value = format(value); | ||
| } | ||
| var gStyle = { | ||
| opacity: opacity | ||
| }; | ||
| if (_onClick) { | ||
| gStyle['cursor'] = 'pointer'; | ||
| } | ||
| return React.createElement("g", _extends({ | ||
| transform: "translate(".concat(x, ",").concat(y, ")") | ||
| }, _onClick ? { | ||
| onClick: function onClick(e) { | ||
| return _onClick(e, value); | ||
| } | ||
| } : {}, { | ||
| style: gStyle | ||
| }), React.createElement("line", { | ||
| x1: 0, | ||
| x2: lineX, | ||
| y1: 0, | ||
| y2: lineY, | ||
| style: theme.axis.ticks.line | ||
| }), React.createElement("text", { | ||
| alignmentBaseline: textBaseline, | ||
| textAnchor: textAnchor, | ||
| transform: "translate(".concat(textX, ",").concat(textY, ") rotate(").concat(rotate, ")"), | ||
| style: theme.axis.ticks.text | ||
| }, value)); | ||
| var gStyle = { | ||
| opacity: opacity | ||
| }; | ||
| if (_onClick) { | ||
| gStyle['cursor'] = 'pointer'; | ||
| } | ||
| return React.createElement("g", _extends({ | ||
| transform: "translate(".concat(x, ",").concat(y, ")") | ||
| }, _onClick ? { | ||
| onClick: function onClick(e) { | ||
| return _onClick(e, value); | ||
| } | ||
| }]); | ||
| return AxisTick; | ||
| }(PureComponent); | ||
| _defineProperty$1(AxisTick, "propTypes", { | ||
| } : {}, { | ||
| style: gStyle | ||
| }), React.createElement("line", { | ||
| x1: 0, | ||
| x2: lineX, | ||
| y1: 0, | ||
| y2: lineY, | ||
| style: theme.axis.ticks.line | ||
| }), React.createElement("text", { | ||
| dominantBaseline: textBaseline, | ||
| textAnchor: textAnchor, | ||
| transform: "translate(".concat(textX, ",").concat(textY, ") rotate(").concat(rotate, ")"), | ||
| style: theme.axis.ticks.text | ||
| }, value)); | ||
| }; | ||
| AxisTick.propTypes = { | ||
| value: PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)]).isRequired, | ||
@@ -242,15 +266,13 @@ format: PropTypes.func, | ||
| rotate: PropTypes.number.isRequired, | ||
| onClick: PropTypes.func, | ||
| theme: PropTypes.shape({ | ||
| axis: axisThemePropType.isRequired | ||
| }).isRequired | ||
| }); | ||
| _defineProperty$1(AxisTick, "defaultProps", { | ||
| onClick: PropTypes.func | ||
| }; | ||
| AxisTick.defaultProps = { | ||
| opacity: 1, | ||
| rotate: 0 | ||
| }); | ||
| }; | ||
| var AxisTick$1 = memo(AxisTick); | ||
| function _extends$1() { _extends$1 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1.apply(this, arguments); } | ||
| function _objectSpread$1(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$2(target, key, source[key]); }); } return target; } | ||
| function _defineProperty$2(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| function _objectSpread$1(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$1(target, key, source[key]); }); } return target; } | ||
| function _defineProperty$1(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| var willEnter = function willEnter() { | ||
@@ -279,3 +301,3 @@ return { | ||
| var defaultTickRenderer = function defaultTickRenderer(props) { | ||
| return React.createElement(AxisTick, props); | ||
| return React.createElement(AxisTick$1, props); | ||
| }; | ||
@@ -298,7 +320,10 @@ var Axis = function Axis(_ref2) { | ||
| legendOffset = _ref2.legendOffset, | ||
| theme = _ref2.theme, | ||
| animate = _ref2.animate, | ||
| motionStiffness = _ref2.motionStiffness, | ||
| motionDamping = _ref2.motionDamping, | ||
| onClick = _ref2.onClick; | ||
| var theme = useTheme(); | ||
| var _useMotionConfig = useMotionConfig(), | ||
| animate = _useMotionConfig.animate, | ||
| springConfig = _useMotionConfig.springConfig; | ||
| var formatValue = useMemo(function () { | ||
| return getFormatter(format, scale); | ||
| }, [format, scale]); | ||
| var _computeCartesianTick = computeCartesianTicks({ | ||
@@ -350,3 +375,3 @@ axis: axis, | ||
| style: _objectSpread$1({ | ||
| alignmentBaseline: 'middle' | ||
| dominantBaseline: 'central' | ||
| }, theme.axis.legend.text) | ||
@@ -361,7 +386,6 @@ }, legend); | ||
| tickIndex: tickIndex, | ||
| format: format, | ||
| format: formatValue, | ||
| rotate: tickRotation, | ||
| textBaseline: textBaseline, | ||
| textAnchor: textAlign, | ||
| theme: theme | ||
| textAnchor: textAlign | ||
| }, tick, onClick ? { | ||
@@ -378,6 +402,2 @@ onClick: onClick | ||
| } | ||
| var springConfig = { | ||
| stiffness: motionStiffness, | ||
| damping: motionDamping | ||
| }; | ||
| return React.createElement(Motion, { | ||
@@ -412,6 +432,5 @@ style: { | ||
| tickIndex: tickIndex, | ||
| format: format, | ||
| format: formatValue, | ||
| textBaseline: textBaseline, | ||
| textAnchor: textAlign, | ||
| theme: theme | ||
| textAnchor: textAlign | ||
| }, tick, style, onClick ? { | ||
@@ -435,3 +454,3 @@ onClick: onClick | ||
| }; | ||
| Axis.propTypes = _objectSpread$1({ | ||
| Axis.propTypes = { | ||
| axis: PropTypes.oneOf(['x', 'y']).isRequired, | ||
@@ -443,7 +462,7 @@ scale: PropTypes.func.isRequired, | ||
| ticksPosition: PropTypes.oneOf(['before', 'after']).isRequired, | ||
| tickValues: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)]))]), | ||
| tickValues: axisPropTypes.tickValues, | ||
| tickSize: PropTypes.number.isRequired, | ||
| tickPadding: PropTypes.number.isRequired, | ||
| tickRotation: PropTypes.number.isRequired, | ||
| tickFormat: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), | ||
| format: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), | ||
| renderTick: PropTypes.func.isRequired, | ||
@@ -453,6 +472,4 @@ legend: PropTypes.node, | ||
| legendOffset: PropTypes.number.isRequired, | ||
| theme: PropTypes.shape({ | ||
| axis: axisThemePropType.isRequired | ||
| }).isRequired | ||
| }, motionPropTypes); | ||
| onClick: PropTypes.func | ||
| }; | ||
| Axis.defaultProps = { | ||
@@ -468,92 +485,39 @@ x: 0, | ||
| }; | ||
| var enhance = compose(withMotion(), withPropsOnChange(['format', 'scale'], function (_ref4) { | ||
| var format = _ref4.format, | ||
| scale = _ref4.scale; | ||
| return { | ||
| format: getFormatter(format, scale) | ||
| }; | ||
| }), pure); | ||
| var Axis$1 = setDisplayName('Axis')(enhance(Axis)); | ||
| var Axis$1 = memo(Axis); | ||
| var axisPropTypes = { | ||
| ticksPosition: PropTypes.oneOf(['before', 'after']), | ||
| tickValues: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)]))]), | ||
| tickSize: PropTypes.number, | ||
| tickPadding: PropTypes.number, | ||
| tickRotation: PropTypes.number, | ||
| format: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), | ||
| renderTick: PropTypes.func, | ||
| legend: PropTypes.node, | ||
| legendPosition: PropTypes.oneOf(['start', 'middle', 'end']), | ||
| legendOffset: PropTypes.number | ||
| }; | ||
| var axisPropType = PropTypes.shape(axisPropTypes); | ||
| function _objectSpread$2(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$3(target, key, source[key]); }); } return target; } | ||
| function _typeof$1(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$1 = function _typeof(obj) { return typeof obj; }; } else { _typeof$1 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$1(obj); } | ||
| function _extends$2() { _extends$2 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$2.apply(this, arguments); } | ||
| function _classCallCheck$1(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } | ||
| function _defineProperties$1(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$1(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$1(Constructor.prototype, protoProps); if (staticProps) _defineProperties$1(Constructor, staticProps); return Constructor; } | ||
| function _possibleConstructorReturn$1(self, call) { if (call && (_typeof$1(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized$1(self); } | ||
| function _assertThisInitialized$1(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } | ||
| function _getPrototypeOf$1(o) { _getPrototypeOf$1 = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf$1(o); } | ||
| function _inherits$1(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 } }); if (superClass) _setPrototypeOf$1(subClass, superClass); } | ||
| function _setPrototypeOf$1(o, p) { _setPrototypeOf$1 = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf$1(o, p); } | ||
| function _defineProperty$3(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| var positions = ['top', 'right', 'bottom', 'left']; | ||
| var Axes = | ||
| function (_PureComponent) { | ||
| _inherits$1(Axes, _PureComponent); | ||
| function Axes() { | ||
| _classCallCheck$1(this, Axes); | ||
| return _possibleConstructorReturn$1(this, _getPrototypeOf$1(Axes).apply(this, arguments)); | ||
| } | ||
| _createClass$1(Axes, [{ | ||
| key: "render", | ||
| value: function render() { | ||
| var _this$props = this.props, | ||
| xScale = _this$props.xScale, | ||
| yScale = _this$props.yScale, | ||
| width = _this$props.width, | ||
| height = _this$props.height, | ||
| top = _this$props.top, | ||
| right = _this$props.right, | ||
| bottom = _this$props.bottom, | ||
| left = _this$props.left, | ||
| theme = _this$props.theme, | ||
| animate = _this$props.animate, | ||
| motionStiffness = _this$props.motionStiffness, | ||
| motionDamping = _this$props.motionDamping; | ||
| var axes = { | ||
| top: top, | ||
| right: right, | ||
| bottom: bottom, | ||
| left: left | ||
| }; | ||
| return React.createElement(Fragment, null, positions.map(function (position) { | ||
| var axis = axes[position]; | ||
| if (!axis) return null; | ||
| var isXAxis = position === 'top' || position === 'bottom'; | ||
| var ticksPosition = position === 'top' || position === 'left' ? 'before' : 'after'; | ||
| return React.createElement(Axis$1, _extends$2({ | ||
| key: position | ||
| }, axis, { | ||
| axis: isXAxis ? 'x' : 'y', | ||
| x: position === 'right' ? width : 0, | ||
| y: position === 'bottom' ? height : 0, | ||
| scale: isXAxis ? xScale : yScale, | ||
| length: isXAxis ? width : height, | ||
| ticksPosition: ticksPosition, | ||
| theme: theme, | ||
| animate: animate, | ||
| motionDamping: motionDamping, | ||
| motionStiffness: motionStiffness | ||
| })); | ||
| })); | ||
| } | ||
| }]); | ||
| return Axes; | ||
| }(PureComponent); | ||
| _defineProperty$3(Axes, "propTypes", _objectSpread$2({ | ||
| var Axes = function Axes(_ref) { | ||
| var xScale = _ref.xScale, | ||
| yScale = _ref.yScale, | ||
| width = _ref.width, | ||
| height = _ref.height, | ||
| top = _ref.top, | ||
| right = _ref.right, | ||
| bottom = _ref.bottom, | ||
| left = _ref.left; | ||
| var axes = { | ||
| top: top, | ||
| right: right, | ||
| bottom: bottom, | ||
| left: left | ||
| }; | ||
| return positions.map(function (position) { | ||
| var axis = axes[position]; | ||
| if (!axis) return null; | ||
| var isXAxis = position === 'top' || position === 'bottom'; | ||
| var ticksPosition = position === 'top' || position === 'left' ? 'before' : 'after'; | ||
| return React.createElement(Axis$1, _extends$2({ | ||
| key: position | ||
| }, axis, { | ||
| axis: isXAxis ? 'x' : 'y', | ||
| x: position === 'right' ? width : 0, | ||
| y: position === 'bottom' ? height : 0, | ||
| scale: isXAxis ? xScale : yScale, | ||
| length: isXAxis ? width : height, | ||
| ticksPosition: ticksPosition | ||
| })); | ||
| }); | ||
| }; | ||
| Axes.propTypes = { | ||
| xScale: PropTypes.func.isRequired, | ||
@@ -566,7 +530,5 @@ yScale: PropTypes.func.isRequired, | ||
| bottom: axisPropType, | ||
| left: axisPropType, | ||
| theme: PropTypes.shape({ | ||
| axis: axisThemePropType.isRequired | ||
| }).isRequired | ||
| }, motionPropTypes)); | ||
| left: axisPropType | ||
| }; | ||
| var Axes$1 = memo(Axes); | ||
@@ -588,30 +550,15 @@ var GridLine = function GridLine(props) { | ||
| }; | ||
| var GridLine$1 = memo(GridLine); | ||
| function _typeof$2(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$2 = function _typeof(obj) { return typeof obj; }; } else { _typeof$2 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$2(obj); } | ||
| function _extends$3() { _extends$3 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$3.apply(this, arguments); } | ||
| function _classCallCheck$2(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } | ||
| function _defineProperties$2(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$2(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$2(Constructor.prototype, protoProps); if (staticProps) _defineProperties$2(Constructor, staticProps); return Constructor; } | ||
| function _possibleConstructorReturn$2(self, call) { if (call && (_typeof$2(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized$2(self); } | ||
| function _getPrototypeOf$2(o) { _getPrototypeOf$2 = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf$2(o); } | ||
| function _assertThisInitialized$2(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } | ||
| function _inherits$2(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 } }); if (superClass) _setPrototypeOf$2(subClass, superClass); } | ||
| function _setPrototypeOf$2(o, p) { _setPrototypeOf$2 = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf$2(o, p); } | ||
| function _defineProperty$4(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| var GridLines = | ||
| function (_Component) { | ||
| _inherits$2(GridLines, _Component); | ||
| function GridLines(props) { | ||
| var _this; | ||
| _classCallCheck$2(this, GridLines); | ||
| _this = _possibleConstructorReturn$2(this, _getPrototypeOf$2(GridLines).call(this, props)); | ||
| _this.willEnter = _this.willEnter.bind(_assertThisInitialized$2(_this)); | ||
| _this.willLeave = _this.willLeave.bind(_assertThisInitialized$2(_this)); | ||
| return _this; | ||
| } | ||
| _createClass$2(GridLines, [{ | ||
| key: "willEnter", | ||
| value: function willEnter(_ref) { | ||
| var style = _ref.style; | ||
| var type = this.props.type; | ||
| var GridLines = function GridLines(_ref) { | ||
| var type = _ref.type, | ||
| lines = _ref.lines; | ||
| var theme = useTheme(); | ||
| var _useMotionConfig = useMotionConfig(), | ||
| animate = _useMotionConfig.animate, | ||
| springConfig = _useMotionConfig.springConfig; | ||
| var lineWillEnter = useMemo(function () { | ||
| return function (_ref2) { | ||
| var style = _ref2.style; | ||
| return { | ||
@@ -624,14 +571,7 @@ opacity: 0, | ||
| }; | ||
| } | ||
| }, { | ||
| key: "willLeave", | ||
| value: function willLeave(_ref2) { | ||
| var style = _ref2.style; | ||
| var _this$props = this.props, | ||
| motionStiffness = _this$props.motionStiffness, | ||
| motionDamping = _this$props.motionDamping; | ||
| var springConfig = { | ||
| stiffness: motionStiffness, | ||
| damping: motionDamping | ||
| }; | ||
| }; | ||
| }, [type]); | ||
| var lineWillLeave = useMemo(function () { | ||
| return function (_ref3) { | ||
| var style = _ref3.style; | ||
| return { | ||
@@ -644,52 +584,37 @@ opacity: spring(0, springConfig), | ||
| }; | ||
| } | ||
| }, { | ||
| key: "render", | ||
| value: function render() { | ||
| var _this$props2 = this.props, | ||
| lines = _this$props2.lines, | ||
| animate = _this$props2.animate, | ||
| motionStiffness = _this$props2.motionStiffness, | ||
| motionDamping = _this$props2.motionDamping, | ||
| theme = _this$props2.theme; | ||
| if (!animate) { | ||
| return React.createElement("g", null, lines.map(function (line) { | ||
| return React.createElement(GridLine, _extends$3({ | ||
| key: line.key | ||
| }, line, theme.grid.line)); | ||
| })); | ||
| } | ||
| var springConfig = { | ||
| stiffness: motionStiffness, | ||
| damping: motionDamping | ||
| }; | ||
| }, [springConfig]); | ||
| if (!animate) { | ||
| return React.createElement("g", null, lines.map(function (line) { | ||
| return React.createElement(GridLine$1, _extends$3({ | ||
| key: line.key | ||
| }, line, theme.grid.line)); | ||
| })); | ||
| } | ||
| return React.createElement(TransitionMotion, { | ||
| willEnter: lineWillEnter, | ||
| willLeave: lineWillLeave, | ||
| styles: lines.map(function (line) { | ||
| return { | ||
| key: line.key, | ||
| style: { | ||
| opacity: spring(1, springConfig), | ||
| x1: spring(line.x1 || 0, springConfig), | ||
| x2: spring(line.x2 || 0, springConfig), | ||
| y1: spring(line.y1 || 0, springConfig), | ||
| y2: spring(line.y2 || 0, springConfig) | ||
| } | ||
| }; | ||
| return React.createElement(TransitionMotion, { | ||
| willEnter: this.willEnter, | ||
| willLeave: this.willLeave, | ||
| styles: lines.map(function (line) { | ||
| return { | ||
| key: line.key, | ||
| style: { | ||
| opacity: spring(1, springConfig), | ||
| x1: spring(line.x1 || 0, springConfig), | ||
| x2: spring(line.x2 || 0, springConfig), | ||
| y1: spring(line.y1 || 0, springConfig), | ||
| y2: spring(line.y2 || 0, springConfig) | ||
| } | ||
| }; | ||
| }) | ||
| }, function (interpolatedStyles) { | ||
| return React.createElement("g", null, interpolatedStyles.map(function (interpolatedStyle) { | ||
| var key = interpolatedStyle.key, | ||
| style = interpolatedStyle.style; | ||
| return React.createElement(GridLine, _extends$3({ | ||
| key: key | ||
| }, theme.grid.line, style)); | ||
| })); | ||
| }); | ||
| } | ||
| }]); | ||
| return GridLines; | ||
| }(Component); | ||
| _defineProperty$4(GridLines, "propTypes", { | ||
| }) | ||
| }, function (interpolatedStyles) { | ||
| return React.createElement("g", null, interpolatedStyles.map(function (interpolatedStyle) { | ||
| var key = interpolatedStyle.key, | ||
| style = interpolatedStyle.style; | ||
| return React.createElement(GridLine$1, _extends$3({ | ||
| key: key | ||
| }, theme.grid.line, style)); | ||
| })); | ||
| }); | ||
| }; | ||
| GridLines.propTypes = { | ||
| type: PropTypes.oneOf(['x', 'y']).isRequired, | ||
@@ -702,11 +627,6 @@ lines: PropTypes.arrayOf(PropTypes.shape({ | ||
| y2: PropTypes.number | ||
| })).isRequired, | ||
| theme: PropTypes.object.isRequired, | ||
| animate: PropTypes.bool.isRequired, | ||
| motionStiffness: PropTypes.number.isRequired, | ||
| motionDamping: PropTypes.number.isRequired | ||
| }); | ||
| })).isRequired | ||
| }; | ||
| var GridLines$1 = memo(GridLines); | ||
| function _objectSpread$3(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$5(target, key, source[key]); }); } return target; } | ||
| function _defineProperty$5(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| var Grid = function Grid(_ref) { | ||
@@ -718,14 +638,13 @@ var width = _ref.width, | ||
| xValues = _ref.xValues, | ||
| yValues = _ref.yValues, | ||
| theme = _ref.theme, | ||
| animate = _ref.animate, | ||
| motionStiffness = _ref.motionStiffness, | ||
| motionDamping = _ref.motionDamping; | ||
| var xLines = xScale ? computeGridLines({ | ||
| width: width, | ||
| height: height, | ||
| scale: xScale, | ||
| axis: 'x', | ||
| values: xValues | ||
| }) : false; | ||
| yValues = _ref.yValues; | ||
| var xLines = useMemo(function () { | ||
| if (!xScale) return false; | ||
| return computeGridLines({ | ||
| width: width, | ||
| height: height, | ||
| scale: xScale, | ||
| axis: 'x', | ||
| values: xValues | ||
| }); | ||
| }, [xScale, xValues]); | ||
| var yLines = yScale ? computeGridLines({ | ||
@@ -738,19 +657,11 @@ width: width, | ||
| }) : false; | ||
| return React.createElement("g", null, xLines && React.createElement(GridLines, { | ||
| return React.createElement(React.Fragment, null, xLines && React.createElement(GridLines$1, { | ||
| type: "x", | ||
| lines: xLines, | ||
| theme: theme, | ||
| animate: animate, | ||
| motionStiffness: motionStiffness, | ||
| motionDamping: motionDamping | ||
| }), yLines && React.createElement(GridLines, { | ||
| lines: xLines | ||
| }), yLines && React.createElement(GridLines$1, { | ||
| type: "y", | ||
| lines: yLines, | ||
| theme: theme, | ||
| animate: animate, | ||
| motionStiffness: motionStiffness, | ||
| motionDamping: motionDamping | ||
| lines: yLines | ||
| })); | ||
| }; | ||
| Grid.propTypes = _objectSpread$3({ | ||
| Grid.propTypes = { | ||
| width: PropTypes.number.isRequired, | ||
@@ -761,7 +672,5 @@ height: PropTypes.number.isRequired, | ||
| xValues: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)]))]), | ||
| yValues: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)]))]), | ||
| theme: PropTypes.object.isRequired | ||
| }, motionPropTypes); | ||
| Grid.defaultProps = {}; | ||
| var Grid$1 = pure(Grid); | ||
| yValues: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)]))]) | ||
| }; | ||
| var Grid$1 = memo(Grid); | ||
@@ -772,4 +681,4 @@ var degreesToRadians = function degreesToRadians(degrees) { | ||
| function _objectSpread$4(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$6(target, key, source[key]); }); } return target; } | ||
| function _defineProperty$6(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| function _objectSpread$2(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$2(target, key, source[key]); }); } return target; } | ||
| function _defineProperty$2(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| var renderAxisToCanvas = function renderAxisToCanvas(ctx, _ref) { | ||
@@ -906,3 +815,3 @@ var axis = _ref.axis, | ||
| var format = getFormatter(axis.format, scale); | ||
| renderAxisToCanvas(ctx, _objectSpread$4({}, axis, { | ||
| renderAxisToCanvas(ctx, _objectSpread$2({}, axis, { | ||
| axis: isXAxis ? 'x' : 'y', | ||
@@ -940,2 +849,2 @@ x: position === 'right' ? width : 0, | ||
| export { Axes, Axis$1 as Axis, Grid$1 as Grid, axisPropType, axisPropTypes, renderAxesToCanvas, renderAxisToCanvas, renderGridLinesToCanvas }; | ||
| export { Axes$1 as Axes, Axis$1 as Axis, Grid$1 as Grid, axisPropType, axisPropTypes, renderAxesToCanvas, renderAxisToCanvas, renderGridLinesToCanvas }; |
| (function (global, factory) { | ||
| typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('prop-types'), require('@nivo/core'), require('recompose/compose'), require('recompose/withPropsOnChange'), require('recompose/pure'), require('recompose/setDisplayName'), require('react-motion'), require('lodash/isNumber'), require('lodash/isArray'), require('lodash/isFunction'), require('d3-time-format'), require('d3-format')) : | ||
| typeof define === 'function' && define.amd ? define(['exports', 'react', 'prop-types', '@nivo/core', 'recompose/compose', 'recompose/withPropsOnChange', 'recompose/pure', 'recompose/setDisplayName', 'react-motion', 'lodash/isNumber', 'lodash/isArray', 'lodash/isFunction', 'd3-time-format', 'd3-format'], factory) : | ||
| (global = global || self, factory(global.nivo = global.nivo || {}, global.React, global.PropTypes, global.nivo, global.RecomposeCompose, global.RecomposeWithPropsOnChange, global.RecomposePure, global.RecomposeSetDisplayName, global.ReactMotion, global['lodash/isNumber'], global['lodash/isArray'], global['lodash/isFunction'], global.d3, global.d3)); | ||
| }(this, function (exports, React, PropTypes, core, compose, withPropsOnChange, pure, setDisplayName, reactMotion, isNumber, isArray, isFunction, d3TimeFormat, d3Format) { 'use strict'; | ||
| typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('prop-types'), require('react-motion'), require('@nivo/core'), require('lodash/isNumber'), require('d3-time'), require('d3-time-format'), require('d3-format')) : | ||
| typeof define === 'function' && define.amd ? define(['exports', 'react', 'prop-types', 'react-motion', '@nivo/core', 'lodash/isNumber', 'd3-time', 'd3-time-format', 'd3-format'], factory) : | ||
| (global = global || self, factory(global.nivo = global.nivo || {}, global.React, global.PropTypes, global.ReactMotion, global.nivo, global['lodash/isNumber'], global.d3, global.d3, global.d3)); | ||
| }(this, function (exports, React, PropTypes, reactMotion, core, isNumber, d3Time, d3TimeFormat, d3Format) { 'use strict'; | ||
| var React__default = 'default' in React ? React['default'] : React; | ||
| PropTypes = PropTypes && PropTypes.hasOwnProperty('default') ? PropTypes['default'] : PropTypes; | ||
| compose = compose && compose.hasOwnProperty('default') ? compose['default'] : compose; | ||
| withPropsOnChange = withPropsOnChange && withPropsOnChange.hasOwnProperty('default') ? withPropsOnChange['default'] : withPropsOnChange; | ||
| pure = pure && pure.hasOwnProperty('default') ? pure['default'] : pure; | ||
| setDisplayName = setDisplayName && setDisplayName.hasOwnProperty('default') ? setDisplayName['default'] : setDisplayName; | ||
| isNumber = isNumber && isNumber.hasOwnProperty('default') ? isNumber['default'] : isNumber; | ||
| isArray = isArray && isArray.hasOwnProperty('default') ? isArray['default'] : isArray; | ||
| isFunction = isFunction && isFunction.hasOwnProperty('default') ? isFunction['default'] : isFunction; | ||
@@ -30,4 +24,44 @@ 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; } | ||
| }; | ||
| var getScaleTicks = function getScaleTicks(scale, tickCount) { | ||
| if (scale.ticks) return scale.ticks(tickCount); | ||
| var timeByType = { | ||
| millisecond: [d3Time.timeMillisecond, d3Time.utcMillisecond], | ||
| second: [d3Time.timeSecond, d3Time.utcSecond], | ||
| minute: [d3Time.timeMinute, d3Time.utcMinute], | ||
| hour: [d3Time.timeHour, d3Time.utcHour], | ||
| day: [d3Time.timeDay, d3Time.utcDay], | ||
| week: [d3Time.timeWeek, d3Time.utcWeek], | ||
| sunday: [d3Time.timeSunday, d3Time.utcSunday], | ||
| monday: [d3Time.timeMonday, d3Time.utcMonday], | ||
| tuesday: [d3Time.timeTuesday, d3Time.utcTuesday], | ||
| wednesday: [d3Time.timeWednesday, d3Time.utcWednesday], | ||
| thursday: [d3Time.timeThursday, d3Time.utcThursday], | ||
| friday: [d3Time.timeFriday, d3Time.utcFriday], | ||
| saturday: [d3Time.timeSaturday, d3Time.utcSaturday], | ||
| month: [d3Time.timeMonth, d3Time.utcMonth], | ||
| year: [d3Time.timeYear, d3Time.utcYear] | ||
| }; | ||
| var timeTypes = Object.keys(timeByType); | ||
| var timeIntervalRegexp = new RegExp("^every\\s*(\\d+)?\\s*(".concat(timeTypes.join('|'), ")s?$"), 'i'); | ||
| var getScaleTicks = function getScaleTicks(scale, spec) { | ||
| if (Array.isArray(spec)) { | ||
| return spec; | ||
| } | ||
| if (scale.ticks) { | ||
| if (spec === undefined) { | ||
| return scale.ticks(); | ||
| } | ||
| if (isNumber(spec)) { | ||
| return scale.ticks(spec); | ||
| } | ||
| if (typeof spec === 'string') { | ||
| var matches = spec.match(timeIntervalRegexp); | ||
| if (matches) { | ||
| var timeType = timeByType[matches[2]][1]; | ||
| if (matches[1] === undefined) { | ||
| return scale.ticks(timeType); | ||
| } | ||
| return scale.ticks(timeType.every(Number(matches[1]))); | ||
| } | ||
| throw new Error("Invalid tickValues: ".concat(spec)); | ||
| } | ||
| } | ||
| return scale.domain(); | ||
@@ -39,3 +73,3 @@ }; | ||
| ticksPosition = _ref.ticksPosition, | ||
| _tickValues = _ref.tickValues, | ||
| tickValues = _ref.tickValues, | ||
| tickSize = _ref.tickSize, | ||
@@ -46,5 +80,3 @@ tickPadding = _ref.tickPadding, | ||
| engine = _ref$engine === void 0 ? 'svg' : _ref$engine; | ||
| var tickValues = isArray(_tickValues) ? _tickValues : undefined; | ||
| var tickCount = isNumber(_tickValues) ? _tickValues : undefined; | ||
| var values = tickValues || getScaleTicks(scale, tickCount); | ||
| var values = getScaleTicks(scale, tickValues); | ||
| var textProps = core.textPropsByEngine[engine]; | ||
@@ -114,3 +146,3 @@ var position = scale.bandwidth ? centerScale(scale) : scale; | ||
| var getFormatter = function getFormatter(format, scale) { | ||
| if (!format || isFunction(format)) return format; | ||
| if (!format || typeof format === 'function') return format; | ||
| if (scale.type === 'time') { | ||
@@ -130,3 +162,3 @@ var f = d3TimeFormat.timeFormat(format); | ||
| _values = _ref2.values; | ||
| var lineValues = isArray(_values) ? _values : undefined; | ||
| var lineValues = Array.isArray(_values) ? _values : undefined; | ||
| var lineCount = isNumber(_values) ? _values : undefined; | ||
@@ -160,73 +192,64 @@ var values = lineValues || getScaleTicks(scale, lineCount); | ||
| function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } | ||
| var axisPropTypes = { | ||
| ticksPosition: PropTypes.oneOf(['before', 'after']), | ||
| tickValues: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)])), PropTypes.string]), | ||
| tickSize: PropTypes.number, | ||
| tickPadding: PropTypes.number, | ||
| tickRotation: PropTypes.number, | ||
| format: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), | ||
| renderTick: PropTypes.func, | ||
| legend: PropTypes.node, | ||
| legendPosition: PropTypes.oneOf(['start', 'middle', 'end']), | ||
| legendOffset: PropTypes.number | ||
| }; | ||
| var axisPropType = PropTypes.shape(axisPropTypes); | ||
| function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } | ||
| 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); return Constructor; } | ||
| function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } 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 _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); } | ||
| 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 } }); if (superClass) _setPrototypeOf(subClass, superClass); } | ||
| function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); } | ||
| function _defineProperty$1(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| var AxisTick = | ||
| function (_PureComponent) { | ||
| _inherits(AxisTick, _PureComponent); | ||
| function AxisTick() { | ||
| _classCallCheck(this, AxisTick); | ||
| return _possibleConstructorReturn(this, _getPrototypeOf(AxisTick).apply(this, arguments)); | ||
| var AxisTick = function AxisTick(_ref) { | ||
| var _value = _ref.value, | ||
| x = _ref.x, | ||
| y = _ref.y, | ||
| opacity = _ref.opacity, | ||
| rotate = _ref.rotate, | ||
| format = _ref.format, | ||
| lineX = _ref.lineX, | ||
| lineY = _ref.lineY, | ||
| _onClick = _ref.onClick, | ||
| textX = _ref.textX, | ||
| textY = _ref.textY, | ||
| textBaseline = _ref.textBaseline, | ||
| textAnchor = _ref.textAnchor; | ||
| var theme = core.useTheme(); | ||
| var value = _value; | ||
| if (format !== undefined) { | ||
| value = format(value); | ||
| } | ||
| _createClass(AxisTick, [{ | ||
| key: "render", | ||
| value: function render() { | ||
| var _this$props = this.props, | ||
| _value = _this$props.value, | ||
| x = _this$props.x, | ||
| y = _this$props.y, | ||
| opacity = _this$props.opacity, | ||
| rotate = _this$props.rotate, | ||
| format = _this$props.format, | ||
| lineX = _this$props.lineX, | ||
| lineY = _this$props.lineY, | ||
| _onClick = _this$props.onClick, | ||
| textX = _this$props.textX, | ||
| textY = _this$props.textY, | ||
| textBaseline = _this$props.textBaseline, | ||
| textAnchor = _this$props.textAnchor, | ||
| theme = _this$props.theme; | ||
| var value = _value; | ||
| if (format !== undefined) { | ||
| value = format(value); | ||
| } | ||
| var gStyle = { | ||
| opacity: opacity | ||
| }; | ||
| if (_onClick) { | ||
| gStyle['cursor'] = 'pointer'; | ||
| } | ||
| return React__default.createElement("g", _extends({ | ||
| transform: "translate(".concat(x, ",").concat(y, ")") | ||
| }, _onClick ? { | ||
| onClick: function onClick(e) { | ||
| return _onClick(e, value); | ||
| } | ||
| } : {}, { | ||
| style: gStyle | ||
| }), React__default.createElement("line", { | ||
| x1: 0, | ||
| x2: lineX, | ||
| y1: 0, | ||
| y2: lineY, | ||
| style: theme.axis.ticks.line | ||
| }), React__default.createElement("text", { | ||
| alignmentBaseline: textBaseline, | ||
| textAnchor: textAnchor, | ||
| transform: "translate(".concat(textX, ",").concat(textY, ") rotate(").concat(rotate, ")"), | ||
| style: theme.axis.ticks.text | ||
| }, value)); | ||
| var gStyle = { | ||
| opacity: opacity | ||
| }; | ||
| if (_onClick) { | ||
| gStyle['cursor'] = 'pointer'; | ||
| } | ||
| return React__default.createElement("g", _extends({ | ||
| transform: "translate(".concat(x, ",").concat(y, ")") | ||
| }, _onClick ? { | ||
| onClick: function onClick(e) { | ||
| return _onClick(e, value); | ||
| } | ||
| }]); | ||
| return AxisTick; | ||
| }(React.PureComponent); | ||
| _defineProperty$1(AxisTick, "propTypes", { | ||
| } : {}, { | ||
| style: gStyle | ||
| }), React__default.createElement("line", { | ||
| x1: 0, | ||
| x2: lineX, | ||
| y1: 0, | ||
| y2: lineY, | ||
| style: theme.axis.ticks.line | ||
| }), React__default.createElement("text", { | ||
| dominantBaseline: textBaseline, | ||
| textAnchor: textAnchor, | ||
| transform: "translate(".concat(textX, ",").concat(textY, ") rotate(").concat(rotate, ")"), | ||
| style: theme.axis.ticks.text | ||
| }, value)); | ||
| }; | ||
| AxisTick.propTypes = { | ||
| value: PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)]).isRequired, | ||
@@ -244,15 +267,13 @@ format: PropTypes.func, | ||
| rotate: PropTypes.number.isRequired, | ||
| onClick: PropTypes.func, | ||
| theme: PropTypes.shape({ | ||
| axis: core.axisThemePropType.isRequired | ||
| }).isRequired | ||
| }); | ||
| _defineProperty$1(AxisTick, "defaultProps", { | ||
| onClick: PropTypes.func | ||
| }; | ||
| AxisTick.defaultProps = { | ||
| opacity: 1, | ||
| rotate: 0 | ||
| }); | ||
| }; | ||
| var AxisTick$1 = React.memo(AxisTick); | ||
| function _extends$1() { _extends$1 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1.apply(this, arguments); } | ||
| function _objectSpread$1(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$2(target, key, source[key]); }); } return target; } | ||
| function _defineProperty$2(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| function _objectSpread$1(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$1(target, key, source[key]); }); } return target; } | ||
| function _defineProperty$1(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| var willEnter = function willEnter() { | ||
@@ -281,3 +302,3 @@ return { | ||
| var defaultTickRenderer = function defaultTickRenderer(props) { | ||
| return React__default.createElement(AxisTick, props); | ||
| return React__default.createElement(AxisTick$1, props); | ||
| }; | ||
@@ -300,7 +321,10 @@ var Axis = function Axis(_ref2) { | ||
| legendOffset = _ref2.legendOffset, | ||
| theme = _ref2.theme, | ||
| animate = _ref2.animate, | ||
| motionStiffness = _ref2.motionStiffness, | ||
| motionDamping = _ref2.motionDamping, | ||
| onClick = _ref2.onClick; | ||
| var theme = core.useTheme(); | ||
| var _useMotionConfig = core.useMotionConfig(), | ||
| animate = _useMotionConfig.animate, | ||
| springConfig = _useMotionConfig.springConfig; | ||
| var formatValue = React.useMemo(function () { | ||
| return getFormatter(format, scale); | ||
| }, [format, scale]); | ||
| var _computeCartesianTick = computeCartesianTicks({ | ||
@@ -352,3 +376,3 @@ axis: axis, | ||
| style: _objectSpread$1({ | ||
| alignmentBaseline: 'middle' | ||
| dominantBaseline: 'central' | ||
| }, theme.axis.legend.text) | ||
@@ -363,7 +387,6 @@ }, legend); | ||
| tickIndex: tickIndex, | ||
| format: format, | ||
| format: formatValue, | ||
| rotate: tickRotation, | ||
| textBaseline: textBaseline, | ||
| textAnchor: textAlign, | ||
| theme: theme | ||
| textAnchor: textAlign | ||
| }, tick, onClick ? { | ||
@@ -380,6 +403,2 @@ onClick: onClick | ||
| } | ||
| var springConfig = { | ||
| stiffness: motionStiffness, | ||
| damping: motionDamping | ||
| }; | ||
| return React__default.createElement(reactMotion.Motion, { | ||
@@ -414,6 +433,5 @@ style: { | ||
| tickIndex: tickIndex, | ||
| format: format, | ||
| format: formatValue, | ||
| textBaseline: textBaseline, | ||
| textAnchor: textAlign, | ||
| theme: theme | ||
| textAnchor: textAlign | ||
| }, tick, style, onClick ? { | ||
@@ -437,3 +455,3 @@ onClick: onClick | ||
| }; | ||
| Axis.propTypes = _objectSpread$1({ | ||
| Axis.propTypes = { | ||
| axis: PropTypes.oneOf(['x', 'y']).isRequired, | ||
@@ -445,7 +463,7 @@ scale: PropTypes.func.isRequired, | ||
| ticksPosition: PropTypes.oneOf(['before', 'after']).isRequired, | ||
| tickValues: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)]))]), | ||
| tickValues: axisPropTypes.tickValues, | ||
| tickSize: PropTypes.number.isRequired, | ||
| tickPadding: PropTypes.number.isRequired, | ||
| tickRotation: PropTypes.number.isRequired, | ||
| tickFormat: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), | ||
| format: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), | ||
| renderTick: PropTypes.func.isRequired, | ||
@@ -455,6 +473,4 @@ legend: PropTypes.node, | ||
| legendOffset: PropTypes.number.isRequired, | ||
| theme: PropTypes.shape({ | ||
| axis: core.axisThemePropType.isRequired | ||
| }).isRequired | ||
| }, core.motionPropTypes); | ||
| onClick: PropTypes.func | ||
| }; | ||
| Axis.defaultProps = { | ||
@@ -470,92 +486,39 @@ x: 0, | ||
| }; | ||
| var enhance = compose(core.withMotion(), withPropsOnChange(['format', 'scale'], function (_ref4) { | ||
| var format = _ref4.format, | ||
| scale = _ref4.scale; | ||
| return { | ||
| format: getFormatter(format, scale) | ||
| }; | ||
| }), pure); | ||
| var Axis$1 = setDisplayName('Axis')(enhance(Axis)); | ||
| var Axis$1 = React.memo(Axis); | ||
| var axisPropTypes = { | ||
| ticksPosition: PropTypes.oneOf(['before', 'after']), | ||
| tickValues: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)]))]), | ||
| tickSize: PropTypes.number, | ||
| tickPadding: PropTypes.number, | ||
| tickRotation: PropTypes.number, | ||
| format: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), | ||
| renderTick: PropTypes.func, | ||
| legend: PropTypes.node, | ||
| legendPosition: PropTypes.oneOf(['start', 'middle', 'end']), | ||
| legendOffset: PropTypes.number | ||
| }; | ||
| var axisPropType = PropTypes.shape(axisPropTypes); | ||
| function _objectSpread$2(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$3(target, key, source[key]); }); } return target; } | ||
| function _typeof$1(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$1 = function _typeof(obj) { return typeof obj; }; } else { _typeof$1 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$1(obj); } | ||
| function _extends$2() { _extends$2 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$2.apply(this, arguments); } | ||
| function _classCallCheck$1(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } | ||
| function _defineProperties$1(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$1(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$1(Constructor.prototype, protoProps); if (staticProps) _defineProperties$1(Constructor, staticProps); return Constructor; } | ||
| function _possibleConstructorReturn$1(self, call) { if (call && (_typeof$1(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized$1(self); } | ||
| function _assertThisInitialized$1(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } | ||
| function _getPrototypeOf$1(o) { _getPrototypeOf$1 = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf$1(o); } | ||
| function _inherits$1(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 } }); if (superClass) _setPrototypeOf$1(subClass, superClass); } | ||
| function _setPrototypeOf$1(o, p) { _setPrototypeOf$1 = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf$1(o, p); } | ||
| function _defineProperty$3(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| var positions = ['top', 'right', 'bottom', 'left']; | ||
| var Axes = | ||
| function (_PureComponent) { | ||
| _inherits$1(Axes, _PureComponent); | ||
| function Axes() { | ||
| _classCallCheck$1(this, Axes); | ||
| return _possibleConstructorReturn$1(this, _getPrototypeOf$1(Axes).apply(this, arguments)); | ||
| } | ||
| _createClass$1(Axes, [{ | ||
| key: "render", | ||
| value: function render() { | ||
| var _this$props = this.props, | ||
| xScale = _this$props.xScale, | ||
| yScale = _this$props.yScale, | ||
| width = _this$props.width, | ||
| height = _this$props.height, | ||
| top = _this$props.top, | ||
| right = _this$props.right, | ||
| bottom = _this$props.bottom, | ||
| left = _this$props.left, | ||
| theme = _this$props.theme, | ||
| animate = _this$props.animate, | ||
| motionStiffness = _this$props.motionStiffness, | ||
| motionDamping = _this$props.motionDamping; | ||
| var axes = { | ||
| top: top, | ||
| right: right, | ||
| bottom: bottom, | ||
| left: left | ||
| }; | ||
| return React__default.createElement(React.Fragment, null, positions.map(function (position) { | ||
| var axis = axes[position]; | ||
| if (!axis) return null; | ||
| var isXAxis = position === 'top' || position === 'bottom'; | ||
| var ticksPosition = position === 'top' || position === 'left' ? 'before' : 'after'; | ||
| return React__default.createElement(Axis$1, _extends$2({ | ||
| key: position | ||
| }, axis, { | ||
| axis: isXAxis ? 'x' : 'y', | ||
| x: position === 'right' ? width : 0, | ||
| y: position === 'bottom' ? height : 0, | ||
| scale: isXAxis ? xScale : yScale, | ||
| length: isXAxis ? width : height, | ||
| ticksPosition: ticksPosition, | ||
| theme: theme, | ||
| animate: animate, | ||
| motionDamping: motionDamping, | ||
| motionStiffness: motionStiffness | ||
| })); | ||
| })); | ||
| } | ||
| }]); | ||
| return Axes; | ||
| }(React.PureComponent); | ||
| _defineProperty$3(Axes, "propTypes", _objectSpread$2({ | ||
| var Axes = function Axes(_ref) { | ||
| var xScale = _ref.xScale, | ||
| yScale = _ref.yScale, | ||
| width = _ref.width, | ||
| height = _ref.height, | ||
| top = _ref.top, | ||
| right = _ref.right, | ||
| bottom = _ref.bottom, | ||
| left = _ref.left; | ||
| var axes = { | ||
| top: top, | ||
| right: right, | ||
| bottom: bottom, | ||
| left: left | ||
| }; | ||
| return positions.map(function (position) { | ||
| var axis = axes[position]; | ||
| if (!axis) return null; | ||
| var isXAxis = position === 'top' || position === 'bottom'; | ||
| var ticksPosition = position === 'top' || position === 'left' ? 'before' : 'after'; | ||
| return React__default.createElement(Axis$1, _extends$2({ | ||
| key: position | ||
| }, axis, { | ||
| axis: isXAxis ? 'x' : 'y', | ||
| x: position === 'right' ? width : 0, | ||
| y: position === 'bottom' ? height : 0, | ||
| scale: isXAxis ? xScale : yScale, | ||
| length: isXAxis ? width : height, | ||
| ticksPosition: ticksPosition | ||
| })); | ||
| }); | ||
| }; | ||
| Axes.propTypes = { | ||
| xScale: PropTypes.func.isRequired, | ||
@@ -568,7 +531,5 @@ yScale: PropTypes.func.isRequired, | ||
| bottom: axisPropType, | ||
| left: axisPropType, | ||
| theme: PropTypes.shape({ | ||
| axis: core.axisThemePropType.isRequired | ||
| }).isRequired | ||
| }, core.motionPropTypes)); | ||
| left: axisPropType | ||
| }; | ||
| var Axes$1 = React.memo(Axes); | ||
@@ -590,30 +551,15 @@ var GridLine = function GridLine(props) { | ||
| }; | ||
| var GridLine$1 = React.memo(GridLine); | ||
| function _typeof$2(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$2 = function _typeof(obj) { return typeof obj; }; } else { _typeof$2 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$2(obj); } | ||
| function _extends$3() { _extends$3 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$3.apply(this, arguments); } | ||
| function _classCallCheck$2(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } | ||
| function _defineProperties$2(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$2(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$2(Constructor.prototype, protoProps); if (staticProps) _defineProperties$2(Constructor, staticProps); return Constructor; } | ||
| function _possibleConstructorReturn$2(self, call) { if (call && (_typeof$2(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized$2(self); } | ||
| function _getPrototypeOf$2(o) { _getPrototypeOf$2 = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf$2(o); } | ||
| function _assertThisInitialized$2(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } | ||
| function _inherits$2(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 } }); if (superClass) _setPrototypeOf$2(subClass, superClass); } | ||
| function _setPrototypeOf$2(o, p) { _setPrototypeOf$2 = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf$2(o, p); } | ||
| function _defineProperty$4(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| var GridLines = | ||
| function (_Component) { | ||
| _inherits$2(GridLines, _Component); | ||
| function GridLines(props) { | ||
| var _this; | ||
| _classCallCheck$2(this, GridLines); | ||
| _this = _possibleConstructorReturn$2(this, _getPrototypeOf$2(GridLines).call(this, props)); | ||
| _this.willEnter = _this.willEnter.bind(_assertThisInitialized$2(_this)); | ||
| _this.willLeave = _this.willLeave.bind(_assertThisInitialized$2(_this)); | ||
| return _this; | ||
| } | ||
| _createClass$2(GridLines, [{ | ||
| key: "willEnter", | ||
| value: function willEnter(_ref) { | ||
| var style = _ref.style; | ||
| var type = this.props.type; | ||
| var GridLines = function GridLines(_ref) { | ||
| var type = _ref.type, | ||
| lines = _ref.lines; | ||
| var theme = core.useTheme(); | ||
| var _useMotionConfig = core.useMotionConfig(), | ||
| animate = _useMotionConfig.animate, | ||
| springConfig = _useMotionConfig.springConfig; | ||
| var lineWillEnter = React.useMemo(function () { | ||
| return function (_ref2) { | ||
| var style = _ref2.style; | ||
| return { | ||
@@ -626,14 +572,7 @@ opacity: 0, | ||
| }; | ||
| } | ||
| }, { | ||
| key: "willLeave", | ||
| value: function willLeave(_ref2) { | ||
| var style = _ref2.style; | ||
| var _this$props = this.props, | ||
| motionStiffness = _this$props.motionStiffness, | ||
| motionDamping = _this$props.motionDamping; | ||
| var springConfig = { | ||
| stiffness: motionStiffness, | ||
| damping: motionDamping | ||
| }; | ||
| }; | ||
| }, [type]); | ||
| var lineWillLeave = React.useMemo(function () { | ||
| return function (_ref3) { | ||
| var style = _ref3.style; | ||
| return { | ||
@@ -646,52 +585,37 @@ opacity: reactMotion.spring(0, springConfig), | ||
| }; | ||
| } | ||
| }, { | ||
| key: "render", | ||
| value: function render() { | ||
| var _this$props2 = this.props, | ||
| lines = _this$props2.lines, | ||
| animate = _this$props2.animate, | ||
| motionStiffness = _this$props2.motionStiffness, | ||
| motionDamping = _this$props2.motionDamping, | ||
| theme = _this$props2.theme; | ||
| if (!animate) { | ||
| return React__default.createElement("g", null, lines.map(function (line) { | ||
| return React__default.createElement(GridLine, _extends$3({ | ||
| key: line.key | ||
| }, line, theme.grid.line)); | ||
| })); | ||
| } | ||
| var springConfig = { | ||
| stiffness: motionStiffness, | ||
| damping: motionDamping | ||
| }; | ||
| }, [springConfig]); | ||
| if (!animate) { | ||
| return React__default.createElement("g", null, lines.map(function (line) { | ||
| return React__default.createElement(GridLine$1, _extends$3({ | ||
| key: line.key | ||
| }, line, theme.grid.line)); | ||
| })); | ||
| } | ||
| return React__default.createElement(reactMotion.TransitionMotion, { | ||
| willEnter: lineWillEnter, | ||
| willLeave: lineWillLeave, | ||
| styles: lines.map(function (line) { | ||
| return { | ||
| key: line.key, | ||
| style: { | ||
| opacity: reactMotion.spring(1, springConfig), | ||
| x1: reactMotion.spring(line.x1 || 0, springConfig), | ||
| x2: reactMotion.spring(line.x2 || 0, springConfig), | ||
| y1: reactMotion.spring(line.y1 || 0, springConfig), | ||
| y2: reactMotion.spring(line.y2 || 0, springConfig) | ||
| } | ||
| }; | ||
| return React__default.createElement(reactMotion.TransitionMotion, { | ||
| willEnter: this.willEnter, | ||
| willLeave: this.willLeave, | ||
| styles: lines.map(function (line) { | ||
| return { | ||
| key: line.key, | ||
| style: { | ||
| opacity: reactMotion.spring(1, springConfig), | ||
| x1: reactMotion.spring(line.x1 || 0, springConfig), | ||
| x2: reactMotion.spring(line.x2 || 0, springConfig), | ||
| y1: reactMotion.spring(line.y1 || 0, springConfig), | ||
| y2: reactMotion.spring(line.y2 || 0, springConfig) | ||
| } | ||
| }; | ||
| }) | ||
| }, function (interpolatedStyles) { | ||
| return React__default.createElement("g", null, interpolatedStyles.map(function (interpolatedStyle) { | ||
| var key = interpolatedStyle.key, | ||
| style = interpolatedStyle.style; | ||
| return React__default.createElement(GridLine, _extends$3({ | ||
| key: key | ||
| }, theme.grid.line, style)); | ||
| })); | ||
| }); | ||
| } | ||
| }]); | ||
| return GridLines; | ||
| }(React.Component); | ||
| _defineProperty$4(GridLines, "propTypes", { | ||
| }) | ||
| }, function (interpolatedStyles) { | ||
| return React__default.createElement("g", null, interpolatedStyles.map(function (interpolatedStyle) { | ||
| var key = interpolatedStyle.key, | ||
| style = interpolatedStyle.style; | ||
| return React__default.createElement(GridLine$1, _extends$3({ | ||
| key: key | ||
| }, theme.grid.line, style)); | ||
| })); | ||
| }); | ||
| }; | ||
| GridLines.propTypes = { | ||
| type: PropTypes.oneOf(['x', 'y']).isRequired, | ||
@@ -704,11 +628,6 @@ lines: PropTypes.arrayOf(PropTypes.shape({ | ||
| y2: PropTypes.number | ||
| })).isRequired, | ||
| theme: PropTypes.object.isRequired, | ||
| animate: PropTypes.bool.isRequired, | ||
| motionStiffness: PropTypes.number.isRequired, | ||
| motionDamping: PropTypes.number.isRequired | ||
| }); | ||
| })).isRequired | ||
| }; | ||
| var GridLines$1 = React.memo(GridLines); | ||
| function _objectSpread$3(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$5(target, key, source[key]); }); } return target; } | ||
| function _defineProperty$5(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| var Grid = function Grid(_ref) { | ||
@@ -720,14 +639,13 @@ var width = _ref.width, | ||
| xValues = _ref.xValues, | ||
| yValues = _ref.yValues, | ||
| theme = _ref.theme, | ||
| animate = _ref.animate, | ||
| motionStiffness = _ref.motionStiffness, | ||
| motionDamping = _ref.motionDamping; | ||
| var xLines = xScale ? computeGridLines({ | ||
| width: width, | ||
| height: height, | ||
| scale: xScale, | ||
| axis: 'x', | ||
| values: xValues | ||
| }) : false; | ||
| yValues = _ref.yValues; | ||
| var xLines = React.useMemo(function () { | ||
| if (!xScale) return false; | ||
| return computeGridLines({ | ||
| width: width, | ||
| height: height, | ||
| scale: xScale, | ||
| axis: 'x', | ||
| values: xValues | ||
| }); | ||
| }, [xScale, xValues]); | ||
| var yLines = yScale ? computeGridLines({ | ||
@@ -740,19 +658,11 @@ width: width, | ||
| }) : false; | ||
| return React__default.createElement("g", null, xLines && React__default.createElement(GridLines, { | ||
| return React__default.createElement(React__default.Fragment, null, xLines && React__default.createElement(GridLines$1, { | ||
| type: "x", | ||
| lines: xLines, | ||
| theme: theme, | ||
| animate: animate, | ||
| motionStiffness: motionStiffness, | ||
| motionDamping: motionDamping | ||
| }), yLines && React__default.createElement(GridLines, { | ||
| lines: xLines | ||
| }), yLines && React__default.createElement(GridLines$1, { | ||
| type: "y", | ||
| lines: yLines, | ||
| theme: theme, | ||
| animate: animate, | ||
| motionStiffness: motionStiffness, | ||
| motionDamping: motionDamping | ||
| lines: yLines | ||
| })); | ||
| }; | ||
| Grid.propTypes = _objectSpread$3({ | ||
| Grid.propTypes = { | ||
| width: PropTypes.number.isRequired, | ||
@@ -763,7 +673,5 @@ height: PropTypes.number.isRequired, | ||
| xValues: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)]))]), | ||
| yValues: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)]))]), | ||
| theme: PropTypes.object.isRequired | ||
| }, core.motionPropTypes); | ||
| Grid.defaultProps = {}; | ||
| var Grid$1 = pure(Grid); | ||
| yValues: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.instanceOf(Date)]))]) | ||
| }; | ||
| var Grid$1 = React.memo(Grid); | ||
@@ -774,4 +682,4 @@ var degreesToRadians = function degreesToRadians(degrees) { | ||
| function _objectSpread$4(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$6(target, key, source[key]); }); } return target; } | ||
| function _defineProperty$6(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| function _objectSpread$2(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$2(target, key, source[key]); }); } return target; } | ||
| function _defineProperty$2(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| var renderAxisToCanvas = function renderAxisToCanvas(ctx, _ref) { | ||
@@ -908,3 +816,3 @@ var axis = _ref.axis, | ||
| var format = getFormatter(axis.format, scale); | ||
| renderAxisToCanvas(ctx, _objectSpread$4({}, axis, { | ||
| renderAxisToCanvas(ctx, _objectSpread$2({}, axis, { | ||
| axis: isXAxis ? 'x' : 'y', | ||
@@ -942,3 +850,3 @@ x: position === 'right' ? width : 0, | ||
| exports.Axes = Axes; | ||
| exports.Axes = Axes$1; | ||
| exports.Axis = Axis$1; | ||
@@ -945,0 +853,0 @@ exports.Grid = Grid$1; |
| import * as React from 'react' | ||
| declare module '@nivo/axes' { | ||
| export type TickFormatter = (value: number | string | Date) => string | number | ||
| export interface AxisProps { | ||
| tickValues?: number | number[] | string[] | Date[] | ||
| tickValues?: number | number[] | string[] | Date[] | string | ||
| tickSize?: number | ||
| tickPadding?: number | ||
| tickRotation?: number | ||
| format?: any // PropTypes.oneOfType([PropTypes.func, PropTypes.string]) | ||
| format?: string | TickFormatter | ||
| renderTick?: (data: any) => React.ReactNode | ||
@@ -11,0 +13,0 @@ legend?: React.ReactNode |
| { | ||
| "name": "@nivo/axes", | ||
| "version": "0.56.2", | ||
| "version": "0.57.0", | ||
| "license": "MIT", | ||
@@ -24,8 +24,8 @@ "author": { | ||
| "dependencies": { | ||
| "@nivo/core": "0.56.2", | ||
| "@nivo/core": "0.57.0", | ||
| "d3-format": "^1.3.2", | ||
| "d3-time": "^1.0.11", | ||
| "d3-time-format": "^2.1.3", | ||
| "lodash": "^4.17.11", | ||
| "react-motion": "^0.5.2", | ||
| "recompose": "^0.30.0" | ||
| "react-motion": "^0.5.2" | ||
| }, | ||
@@ -39,3 +39,3 @@ "peerDependencies": { | ||
| }, | ||
| "gitHead": "97dc958b0a3390a4c8d85125dc080a1cc4c6fc85" | ||
| "gitHead": "747b36908447afad4d4c4fe570bf9e189e163b15" | ||
| } |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Worsened metrics
- Total package byte prevSize
- decreased by-26.45%
94645
- Lines of code
- decreased by-11%
2491
Dependency changes
+ Addedd3-time@^1.0.11
+ Added@nivo/core@0.57.0(transitive)
+ Added@nivo/tooltip@0.57.0(transitive)
- Removedrecompose@^0.30.0
- Removed@nivo/core@0.56.2(transitive)
Updated@nivo/core@0.57.0