Nie możesz wybrać więcej, niż 25 tematów Tematy muszą się zaczynać od litery lub cyfry, mogą zawierać myślniki ('-') i mogą mieć do 35 znaków.
 
 
 
 

186 wiersze
6.2 KiB

  1. 'use strict';
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. var _extends2 = require('babel-runtime/helpers/extends');
  6. var _extends3 = _interopRequireDefault(_extends2);
  7. var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
  8. var _defineProperty3 = _interopRequireDefault(_defineProperty2);
  9. var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
  10. var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
  11. var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
  12. var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
  13. var _createClass2 = require('babel-runtime/helpers/createClass');
  14. var _createClass3 = _interopRequireDefault(_createClass2);
  15. var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
  16. var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
  17. var _inherits2 = require('babel-runtime/helpers/inherits');
  18. var _inherits3 = _interopRequireDefault(_inherits2);
  19. var _react = require('react');
  20. var _react2 = _interopRequireDefault(_react);
  21. var _propTypes = require('prop-types');
  22. var _propTypes2 = _interopRequireDefault(_propTypes);
  23. var _classnames = require('classnames');
  24. var _classnames2 = _interopRequireDefault(_classnames);
  25. var _addEventListener = require('rc-util/lib/Dom/addEventListener');
  26. var _addEventListener2 = _interopRequireDefault(_addEventListener);
  27. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
  28. var Handle = function (_React$Component) {
  29. (0, _inherits3['default'])(Handle, _React$Component);
  30. function Handle() {
  31. var _ref;
  32. var _temp, _this, _ret;
  33. (0, _classCallCheck3['default'])(this, Handle);
  34. for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
  35. args[_key] = arguments[_key];
  36. }
  37. return _ret = (_temp = (_this = (0, _possibleConstructorReturn3['default'])(this, (_ref = Handle.__proto__ || Object.getPrototypeOf(Handle)).call.apply(_ref, [this].concat(args))), _this), _this.state = {
  38. clickFocused: false
  39. }, _this.setHandleRef = function (node) {
  40. _this.handle = node;
  41. }, _this.handleMouseUp = function () {
  42. if (document.activeElement === _this.handle) {
  43. _this.setClickFocus(true);
  44. }
  45. }, _this.handleMouseDown = function () {
  46. // fix https://github.com/ant-design/ant-design/issues/15324
  47. _this.focus();
  48. }, _this.handleBlur = function () {
  49. _this.setClickFocus(false);
  50. }, _this.handleKeyDown = function () {
  51. _this.setClickFocus(false);
  52. }, _temp), (0, _possibleConstructorReturn3['default'])(_this, _ret);
  53. }
  54. (0, _createClass3['default'])(Handle, [{
  55. key: 'componentDidMount',
  56. value: function componentDidMount() {
  57. // mouseup won't trigger if mouse moved out of handle,
  58. // so we listen on document here.
  59. this.onMouseUpListener = (0, _addEventListener2['default'])(document, 'mouseup', this.handleMouseUp);
  60. }
  61. }, {
  62. key: 'componentWillUnmount',
  63. value: function componentWillUnmount() {
  64. if (this.onMouseUpListener) {
  65. this.onMouseUpListener.remove();
  66. }
  67. }
  68. }, {
  69. key: 'setClickFocus',
  70. value: function setClickFocus(focused) {
  71. this.setState({ clickFocused: focused });
  72. }
  73. }, {
  74. key: 'clickFocus',
  75. value: function clickFocus() {
  76. this.setClickFocus(true);
  77. this.focus();
  78. }
  79. }, {
  80. key: 'focus',
  81. value: function focus() {
  82. this.handle.focus();
  83. }
  84. }, {
  85. key: 'blur',
  86. value: function blur() {
  87. this.handle.blur();
  88. }
  89. }, {
  90. key: 'render',
  91. value: function render() {
  92. var _ref2, _ref3;
  93. var _props = this.props,
  94. prefixCls = _props.prefixCls,
  95. vertical = _props.vertical,
  96. reverse = _props.reverse,
  97. offset = _props.offset,
  98. style = _props.style,
  99. disabled = _props.disabled,
  100. min = _props.min,
  101. max = _props.max,
  102. value = _props.value,
  103. tabIndex = _props.tabIndex,
  104. restProps = (0, _objectWithoutProperties3['default'])(_props, ['prefixCls', 'vertical', 'reverse', 'offset', 'style', 'disabled', 'min', 'max', 'value', 'tabIndex']);
  105. var className = (0, _classnames2['default'])(this.props.className, (0, _defineProperty3['default'])({}, prefixCls + '-handle-click-focused', this.state.clickFocused));
  106. var positionStyle = vertical ? (_ref2 = {}, (0, _defineProperty3['default'])(_ref2, reverse ? 'top' : 'bottom', offset + '%'), (0, _defineProperty3['default'])(_ref2, reverse ? 'bottom' : 'top', 'auto'), (0, _defineProperty3['default'])(_ref2, 'transform', 'translateY(+50%)'), _ref2) : (_ref3 = {}, (0, _defineProperty3['default'])(_ref3, reverse ? 'right' : 'left', offset + '%'), (0, _defineProperty3['default'])(_ref3, reverse ? 'left' : 'right', 'auto'), (0, _defineProperty3['default'])(_ref3, 'transform', 'translateX(' + (reverse ? '+' : '-') + '50%)'), _ref3);
  107. var elStyle = (0, _extends3['default'])({}, style, positionStyle);
  108. var _tabIndex = tabIndex || 0;
  109. if (disabled || tabIndex === null) {
  110. _tabIndex = null;
  111. }
  112. return _react2['default'].createElement('div', (0, _extends3['default'])({
  113. ref: this.setHandleRef,
  114. tabIndex: _tabIndex
  115. }, restProps, {
  116. className: className,
  117. style: elStyle,
  118. onBlur: this.handleBlur,
  119. onKeyDown: this.handleKeyDown,
  120. onMouseDown: this.handleMouseDown
  121. // aria attribute
  122. , role: 'slider',
  123. 'aria-valuemin': min,
  124. 'aria-valuemax': max,
  125. 'aria-valuenow': value,
  126. 'aria-disabled': !!disabled
  127. }));
  128. }
  129. }]);
  130. return Handle;
  131. }(_react2['default'].Component);
  132. exports['default'] = Handle;
  133. Handle.propTypes = {
  134. prefixCls: _propTypes2['default'].string,
  135. className: _propTypes2['default'].string,
  136. vertical: _propTypes2['default'].bool,
  137. offset: _propTypes2['default'].number,
  138. style: _propTypes2['default'].object,
  139. disabled: _propTypes2['default'].bool,
  140. min: _propTypes2['default'].number,
  141. max: _propTypes2['default'].number,
  142. value: _propTypes2['default'].number,
  143. tabIndex: _propTypes2['default'].number,
  144. reverse: _propTypes2['default'].bool
  145. };
  146. module.exports = exports['default'];