'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); var _extends2 = require('babel-runtime/helpers/extends'); var _extends3 = _interopRequireDefault(_extends2); var _defineProperty2 = require('babel-runtime/helpers/defineProperty'); var _defineProperty3 = _interopRequireDefault(_defineProperty2); var _react = require('react'); var _react2 = _interopRequireDefault(_react); var _propTypes = require('prop-types'); var _propTypes2 = _interopRequireDefault(_propTypes); var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; } var Marks = function Marks(_ref) { var className = _ref.className, vertical = _ref.vertical, reverse = _ref.reverse, marks = _ref.marks, included = _ref.included, upperBound = _ref.upperBound, lowerBound = _ref.lowerBound, max = _ref.max, min = _ref.min, onClickLabel = _ref.onClickLabel; var marksKeys = Object.keys(marks); var range = max - min; var elements = marksKeys.map(parseFloat).sort(function (a, b) { return a - b; }).map(function (point) { var _classNames; var markPoint = marks[point]; var markPointIsObject = typeof markPoint === 'object' && !_react2['default'].isValidElement(markPoint); var markLabel = markPointIsObject ? markPoint.label : markPoint; if (!markLabel && markLabel !== 0) { return null; } var isActive = !included && point === upperBound || included && point <= upperBound && point >= lowerBound; var markClassName = (0, _classnames2['default'])((_classNames = {}, (0, _defineProperty3['default'])(_classNames, className + '-text', true), (0, _defineProperty3['default'])(_classNames, className + '-text-active', isActive), _classNames)); var bottomStyle = (0, _defineProperty3['default'])({ marginBottom: '-50%' }, reverse ? 'top' : 'bottom', (point - min) / range * 100 + '%'); var leftStyle = (0, _defineProperty3['default'])({ transform: 'translateX(-50%)', msTransform: 'translateX(-50%)' }, reverse ? 'right' : 'left', reverse ? (point - min / 4) / range * 100 + '%' : (point - min) / range * 100 + '%'); var style = vertical ? bottomStyle : leftStyle; var markStyle = markPointIsObject ? (0, _extends3['default'])({}, style, markPoint.style) : style; return _react2['default'].createElement( 'span', { className: markClassName, style: markStyle, key: point, onMouseDown: function onMouseDown(e) { return onClickLabel(e, point); }, onTouchStart: function onTouchStart(e) { return onClickLabel(e, point); } }, markLabel ); }); return _react2['default'].createElement( 'div', { className: className }, elements ); }; Marks.propTypes = { className: _propTypes2['default'].string, vertical: _propTypes2['default'].bool, reverse: _propTypes2['default'].bool, marks: _propTypes2['default'].object, included: _propTypes2['default'].bool, upperBound: _propTypes2['default'].number, lowerBound: _propTypes2['default'].number, max: _propTypes2['default'].number, min: _propTypes2['default'].number, onClickLabel: _propTypes2['default'].func }; exports['default'] = Marks; module.exports = exports['default'];