@ucloud-fe/react-components 1.7.1 → 1.8.0

package/lib/components/Slider/Slider.js

@@ -64,7 +64,7 @@ var _style = require("./style");
 var _zh_CN = _interopRequireDefault(require("./locale/zh_CN"));
 
 var _excluded = ["value", "dragging", "index", "tipFormatter"],
-    _excluded2 = ["value", "defaultValue", "onChange", "className", "style", "disabled", "min", "max", "step", "sliderClassName", "sliderStyle", "numberInput", "numberInputTipFormatter", "tipFormatter", "size", "marks", "isSensitive", "locale", "onLastChange"];
+    _excluded2 = ["value", "defaultValue", "range", "onChange", "className", "style", "disabled", "min", "max", "step", "sliderClassName", "sliderStyle", "numberInput", "numberInputTipFormatter", "tipFormatter", "size", "marks", "isSensitive", "locale", "onLastChange"];
 
 var _this = void 0,
     _dec,
@@ -86,6 +86,7 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
 var Handle = _rcSlider.default.Handle;
+var Range = _rcSlider.default.Range;
 var Size = ['sm', 'md', 'lg'];
 
 var handle = function handle(props) {
@@ -258,7 +259,9 @@ var Slider = (_dec = (0, _localeConsumerDecorator.default)({
         return null;
       }
 
-      var max = props.max;
+      var _props$max = props.max,
+          max = _props$max === void 0 ? 100 : _props$max,
+          range = props.range;
       var marks = {};
       var baseRatio = 0;
       (0, _each2.default)(_marks, function (_mark) {
@@ -268,7 +271,7 @@ var Slider = (_dec = (0, _localeConsumerDecorator.default)({
           return;
         }
 
-        var value = (baseRatio += _mark.ratio) / 100 * sliderSplit;
+        var value = (baseRatio += _mark.ratio) / 100 * (range ? max : sliderSplit);
         var mark = {
           label: _mark.label,
           style: _objectSpread(_objectSpread({
@@ -340,8 +343,8 @@ var Slider = (_dec = (0, _localeConsumerDecorator.default)({
 
     _this3.onSliderChange = function (v, latest) {
       (0, _newArrowCheck2.default)(this, _this4);
-
-      var value = _this3.translateSliderValueToValue(v);
+      var range = _this3.props.range;
+      var value = range ? v : _this3.translateSliderValueToValue(v);
 
       _this3.handleChange(value, latest);
     }.bind(this);
@@ -607,6 +610,7 @@ var Slider = (_dec = (0, _localeConsumerDecorator.default)({
       var _this$props = this.props,
           value = _this$props.value,
           defaultValue = _this$props.defaultValue,
+          range = _this$props.range,
           onChange = _this$props.onChange,
           className = _this$props.className,
           style = _this$props.style,
@@ -662,6 +666,31 @@ var Slider = (_dec = (0, _localeConsumerDecorator.default)({
       });
 
       var isNumberInputValid = numberInputValue + '' === value + '';
+
+      if (range) {
+        return /*#__PURE__*/_react.default.createElement(_style.SliderWrap, {
+          disabled: disabled,
+          style: style,
+          className: className,
+          size: size
+        }, /*#__PURE__*/_react.default.createElement(_style.RcSliderWrap, null, /*#__PURE__*/_react.default.createElement(Range, (0, _extends2.default)({
+          min: min,
+          max: max,
+          defaultValue: defaultValue,
+          value: value,
+          step: step,
+          prefixCls: _style.prefixCls,
+          marks: marksForSlider || {},
+          handle: function (handleProps) {
+            (0, _newArrowCheck2.default)(this, _this9);
+            return handle(_objectSpread(_objectSpread({}, handleProps), {}, {
+              // value,
+              tipFormatter: tipFormatter
+            }));
+          }.bind(this)
+        }, sliderProps, sharingProps))));
+      }
+
       return /*#__PURE__*/_react.default.createElement(_style.SliderWrap, {
         disabled: disabled,
         style: style,
@@ -702,10 +731,13 @@ var Slider = (_dec = (0, _localeConsumerDecorator.default)({
   return Slider;
 }(_react.Component), _class2.propTypes = {
   /** 值，受控 */
-  value: _propTypes.default.number,
+  value: _propTypes.default.number | _propTypes.default.arrayOf(_propTypes.default.number),
 
   /** 默认值，非受控 */
-  defaultValue: _propTypes.default.number,
+  defaultValue: _propTypes.default.number | _propTypes.default.arrayOf(_propTypes.default.number),
+
+  /** 是否为双滑块模式 */
+  range: _propTypes.default.bool,
 
   /** 修改回调 */
   onChange: _propTypes.default.func,
@@ -771,6 +803,7 @@ var Slider = (_dec = (0, _localeConsumerDecorator.default)({
     (0, _newArrowCheck2.default)(this, _this);
   }.bind(void 0),
   defaultValue: 0,
+  range: false,
   step: 1,
   size: 'md',
   min: 0,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ucloud-fe/react-components",
-  "version": "1.7.1",
+  "version": "1.8.0",
   "title": "UCloud react components",
   "description": "UCloud react components",
   "keywords": [