1 | import _extends from 'babel-runtime/helpers/extends';
|
2 | import React from 'react';
|
3 | import classNames from 'classnames';
|
4 | import PropTypes from 'prop-types';
|
5 | import { getPercent } from '../utils';
|
6 |
|
7 | function _getProps(min, max, value, rtl) {
|
8 | return {
|
9 | style: {
|
10 | left: rtl ? 100 - getPercent(min, max, value) + '%' : getPercent(min, max, value) + '%',
|
11 | zIndex: 100
|
12 | },
|
13 | 'aria-valuenow': value,
|
14 | 'aria-valuetext': value,
|
15 | 'aria-valuemin': min,
|
16 | 'aria-valuemax': max
|
17 | };
|
18 | }
|
19 |
|
20 | function Slider(_ref) {
|
21 | var _classNames;
|
22 |
|
23 | var prefix = _ref.prefix,
|
24 | hasMovingClass = _ref.hasMovingClass,
|
25 | min = _ref.min,
|
26 | max = _ref.max,
|
27 | value = _ref.value,
|
28 | onKeyDown = _ref.onKeyDown,
|
29 | rtl = _ref.rtl;
|
30 |
|
31 | var classes = classNames((_classNames = {}, _classNames[prefix + 'range-slider'] = true, _classNames[prefix + 'range-slider-moving'] = hasMovingClass, _classNames));
|
32 | return React.createElement(
|
33 | 'div',
|
34 | _extends({
|
35 | className: classes,
|
36 | onKeyDown: onKeyDown,
|
37 | role: 'slider',
|
38 | tabIndex: 0
|
39 | }, _getProps(min, max, value, rtl)),
|
40 | React.createElement('div', { className: prefix + 'range-slider-inner' })
|
41 | );
|
42 | }
|
43 |
|
44 | Slider.propTypes = {
|
45 | min: PropTypes.number,
|
46 | max: PropTypes.number,
|
47 | value: PropTypes.number,
|
48 | prefix: PropTypes.string,
|
49 | hasMovingClass: PropTypes.bool,
|
50 | rtl: PropTypes.bool
|
51 | };
|
52 |
|
53 | Slider.defaultProps = {
|
54 | prefix: 'next-',
|
55 | min: 0,
|
56 | max: 100,
|
57 | value: 0,
|
58 | hasMovingClass: false,
|
59 | rtl: false
|
60 | };
|
61 |
|
62 | export default Slider; |
\ | No newline at end of file |