import _extends from 'babel-runtime/helpers/extends'; import _typeof from 'babel-runtime/helpers/typeof'; import _defineProperty from 'babel-runtime/helpers/defineProperty'; import React from 'react'; import classNames from 'classnames'; var Marks = function Marks(_ref) { var className = _ref.className, vertical = _ref.vertical, marks = _ref.marks, included = _ref.included, upperBound = _ref.upperBound, lowerBound = _ref.lowerBound, max = _ref.max, min = _ref.min; var marksKeys = Object.keys(marks); var marksCount = marksKeys.length; var unit = marksCount > 1 ? 100 / (marksCount - 1) : 100; var markWidth = unit * 0.9; var range = max - min; var elements = marksKeys.map(parseFloat).sort(function (a, b) { return a - b; }).map(function (point) { var _classNames; var isActive = !included && point === upperBound || included && point <= upperBound && point >= lowerBound; var markClassName = classNames((_classNames = {}, _defineProperty(_classNames, className + '-text', true), _defineProperty(_classNames, className + '-text-active', isActive), _classNames)); var bottomStyle = { marginBottom: '-50%', bottom: (point - min) / range * 100 + '%' }; var leftStyle = { width: markWidth + '%', marginLeft: -markWidth / 2 + '%', left: (point - min) / range * 100 + '%' }; var style = vertical ? bottomStyle : leftStyle; var markPoint = marks[point]; var markPointIsObject = (typeof markPoint === 'undefined' ? 'undefined' : _typeof(markPoint)) === 'object' && !React.isValidElement(markPoint); var markLabel = markPointIsObject ? markPoint.label : markPoint; var markStyle = markPointIsObject ? _extends({}, style, markPoint.style) : style; return React.createElement( 'span', { className: markClassName, style: markStyle, key: point }, markLabel ); }); return React.createElement( 'div', { className: className }, elements ); }; export default Marks;