You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
296 lines
8.9 KiB
296 lines
8.9 KiB
"use strict";
|
|
|
|
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
|
|
|
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
exports.default = void 0;
|
|
|
|
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
|
|
|
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
|
|
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
|
|
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
|
|
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
|
|
|
|
var _react = _interopRequireDefault(require("react"));
|
|
|
|
var _warning = _interopRequireDefault(require("rc-util/lib/warning"));
|
|
|
|
var _Track = _interopRequireDefault(require("./common/Track"));
|
|
|
|
var _createSlider = _interopRequireDefault(require("./common/createSlider"));
|
|
|
|
var utils = _interopRequireWildcard(require("./utils"));
|
|
|
|
var Slider = /*#__PURE__*/function (_React$Component) {
|
|
(0, _inherits2.default)(Slider, _React$Component);
|
|
|
|
var _super = (0, _createSuper2.default)(Slider);
|
|
|
|
/* eslint-enable */
|
|
function Slider(props) {
|
|
var _this;
|
|
|
|
(0, _classCallCheck2.default)(this, Slider);
|
|
_this = _super.call(this, props);
|
|
|
|
_this.positionGetValue = function (position) {
|
|
return [];
|
|
};
|
|
|
|
_this.onEnd = function (force) {
|
|
var dragging = _this.state.dragging;
|
|
|
|
_this.removeDocumentEvents();
|
|
|
|
if (dragging || force) {
|
|
_this.props.onAfterChange(_this.getValue());
|
|
}
|
|
|
|
_this.setState({
|
|
dragging: false
|
|
});
|
|
};
|
|
|
|
var defaultValue = props.defaultValue !== undefined ? props.defaultValue : props.min;
|
|
var value = props.value !== undefined ? props.value : defaultValue;
|
|
_this.state = {
|
|
value: _this.trimAlignValue(value),
|
|
dragging: false
|
|
};
|
|
(0, _warning.default)(!('minimumTrackStyle' in props), 'minimumTrackStyle will be deprecated, please use trackStyle instead.');
|
|
(0, _warning.default)(!('maximumTrackStyle' in props), 'maximumTrackStyle will be deprecated, please use railStyle instead.');
|
|
return _this;
|
|
}
|
|
/**
|
|
* [Legacy] Used for inherit other component.
|
|
* It's a bad code style which should be refactor.
|
|
*/
|
|
|
|
/* eslint-disable @typescript-eslint/no-unused-vars, class-methods-use-this */
|
|
|
|
|
|
(0, _createClass2.default)(Slider, [{
|
|
key: "calcValueByPos",
|
|
value: function calcValueByPos(value) {
|
|
return 0;
|
|
}
|
|
}, {
|
|
key: "calcOffset",
|
|
value: function calcOffset(value) {
|
|
return 0;
|
|
}
|
|
}, {
|
|
key: "saveHandle",
|
|
value: function saveHandle(index, h) {}
|
|
}, {
|
|
key: "removeDocumentEvents",
|
|
value: function removeDocumentEvents() {}
|
|
}, {
|
|
key: "componentDidUpdate",
|
|
value: function componentDidUpdate(prevProps, prevState) {
|
|
var _this$props = this.props,
|
|
min = _this$props.min,
|
|
max = _this$props.max,
|
|
value = _this$props.value,
|
|
onChange = _this$props.onChange;
|
|
|
|
if (!('min' in this.props || 'max' in this.props)) {
|
|
return;
|
|
}
|
|
|
|
var theValue = value !== undefined ? value : prevState.value;
|
|
var nextValue = this.trimAlignValue(theValue, this.props);
|
|
|
|
if (nextValue === prevState.value) {
|
|
return;
|
|
} // eslint-disable-next-line
|
|
|
|
|
|
this.setState({
|
|
value: nextValue
|
|
});
|
|
|
|
if (!(min === prevProps.min && max === prevProps.max) && utils.isValueOutOfRange(theValue, this.props)) {
|
|
onChange(nextValue);
|
|
}
|
|
}
|
|
}, {
|
|
key: "onChange",
|
|
value: function onChange(state) {
|
|
var props = this.props;
|
|
var isNotControlled = !('value' in props);
|
|
var nextState = state.value > this.props.max ? (0, _objectSpread2.default)((0, _objectSpread2.default)({}, state), {}, {
|
|
value: this.props.max
|
|
}) : state;
|
|
|
|
if (isNotControlled) {
|
|
this.setState(nextState);
|
|
}
|
|
|
|
var changedValue = nextState.value;
|
|
props.onChange(changedValue);
|
|
}
|
|
}, {
|
|
key: "onStart",
|
|
value: function onStart(position) {
|
|
this.setState({
|
|
dragging: true
|
|
});
|
|
var props = this.props;
|
|
var prevValue = this.getValue();
|
|
props.onBeforeChange(prevValue);
|
|
var value = this.calcValueByPos(position);
|
|
this.startValue = value;
|
|
this.startPosition = position;
|
|
if (value === prevValue) return;
|
|
this.prevMovedHandleIndex = 0;
|
|
this.onChange({
|
|
value: value
|
|
});
|
|
}
|
|
}, {
|
|
key: "onMove",
|
|
value: function onMove(e, position) {
|
|
utils.pauseEvent(e);
|
|
var oldValue = this.state.value;
|
|
var value = this.calcValueByPos(position);
|
|
if (value === oldValue) return;
|
|
this.onChange({
|
|
value: value
|
|
});
|
|
}
|
|
}, {
|
|
key: "onKeyboard",
|
|
value: function onKeyboard(e) {
|
|
var _this$props2 = this.props,
|
|
reverse = _this$props2.reverse,
|
|
vertical = _this$props2.vertical;
|
|
var valueMutator = utils.getKeyboardValueMutator(e, vertical, reverse);
|
|
|
|
if (valueMutator) {
|
|
utils.pauseEvent(e);
|
|
var state = this.state;
|
|
var oldValue = state.value;
|
|
var mutatedValue = valueMutator(oldValue, this.props);
|
|
var value = this.trimAlignValue(mutatedValue);
|
|
if (value === oldValue) return;
|
|
this.onChange({
|
|
value: value
|
|
});
|
|
this.props.onAfterChange(value);
|
|
this.onEnd();
|
|
}
|
|
}
|
|
}, {
|
|
key: "getValue",
|
|
value: function getValue() {
|
|
return this.state.value;
|
|
}
|
|
}, {
|
|
key: "getLowerBound",
|
|
value: function getLowerBound() {
|
|
var minPoint = this.props.startPoint || this.props.min;
|
|
return this.state.value > minPoint ? minPoint : this.state.value;
|
|
}
|
|
}, {
|
|
key: "getUpperBound",
|
|
value: function getUpperBound() {
|
|
if (this.state.value < this.props.startPoint) {
|
|
return this.props.startPoint;
|
|
}
|
|
|
|
return this.state.value;
|
|
}
|
|
}, {
|
|
key: "trimAlignValue",
|
|
value: function trimAlignValue(v) {
|
|
var nextProps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
|
|
if (v === null) {
|
|
return null;
|
|
}
|
|
|
|
var mergedProps = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, this.props), nextProps);
|
|
var val = utils.ensureValueInRange(v, mergedProps);
|
|
return utils.ensureValuePrecision(val, mergedProps);
|
|
}
|
|
}, {
|
|
key: "render",
|
|
value: function render() {
|
|
var _this2 = this;
|
|
|
|
var _this$props3 = this.props,
|
|
prefixCls = _this$props3.prefixCls,
|
|
vertical = _this$props3.vertical,
|
|
included = _this$props3.included,
|
|
disabled = _this$props3.disabled,
|
|
minimumTrackStyle = _this$props3.minimumTrackStyle,
|
|
trackStyle = _this$props3.trackStyle,
|
|
handleStyle = _this$props3.handleStyle,
|
|
tabIndex = _this$props3.tabIndex,
|
|
ariaLabelForHandle = _this$props3.ariaLabelForHandle,
|
|
ariaLabelledByForHandle = _this$props3.ariaLabelledByForHandle,
|
|
ariaValueTextFormatterForHandle = _this$props3.ariaValueTextFormatterForHandle,
|
|
min = _this$props3.min,
|
|
max = _this$props3.max,
|
|
startPoint = _this$props3.startPoint,
|
|
reverse = _this$props3.reverse,
|
|
handleGenerator = _this$props3.handle;
|
|
var _this$state = this.state,
|
|
value = _this$state.value,
|
|
dragging = _this$state.dragging;
|
|
var offset = this.calcOffset(value);
|
|
var handle = handleGenerator({
|
|
className: "".concat(prefixCls, "-handle"),
|
|
prefixCls: prefixCls,
|
|
vertical: vertical,
|
|
offset: offset,
|
|
value: value,
|
|
dragging: dragging,
|
|
disabled: disabled,
|
|
min: min,
|
|
max: max,
|
|
reverse: reverse,
|
|
index: 0,
|
|
tabIndex: tabIndex,
|
|
ariaLabel: ariaLabelForHandle,
|
|
ariaLabelledBy: ariaLabelledByForHandle,
|
|
ariaValueTextFormatter: ariaValueTextFormatterForHandle,
|
|
style: handleStyle[0] || handleStyle,
|
|
ref: function ref(h) {
|
|
return _this2.saveHandle(0, h);
|
|
}
|
|
});
|
|
var trackOffset = startPoint !== undefined ? this.calcOffset(startPoint) : 0;
|
|
var mergedTrackStyle = trackStyle[0] || trackStyle;
|
|
|
|
var track = /*#__PURE__*/_react.default.createElement(_Track.default, {
|
|
className: "".concat(prefixCls, "-track"),
|
|
vertical: vertical,
|
|
included: included,
|
|
offset: trackOffset,
|
|
reverse: reverse,
|
|
length: offset - trackOffset,
|
|
style: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, minimumTrackStyle), mergedTrackStyle)
|
|
});
|
|
|
|
return {
|
|
tracks: track,
|
|
handles: handle
|
|
};
|
|
}
|
|
}]);
|
|
return Slider;
|
|
}(_react.default.Component);
|
|
|
|
var _default = (0, _createSlider.default)(Slider);
|
|
|
|
exports.default = _default; |