@nutui/nutui-react 1.5.1-beta.0 → 2.0.0-alpha.0

package/dist/esm/Range.js

@@ -1,12 +1,31 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-import React__default, { useState, useRef, useEffect, useCallback } from 'react';
-import { u as useTouch } from './useTouch-cf73a407.js';
-import { g as getRect } from './useClientRect-56bb675b.js';
-import Toast from './Toast.js';
-import { useConfig } from './ConfigProvider.js';
+function ownKeys(object, enumerableOnly) {
+  var keys = Object.keys(object);
+  if (Object.getOwnPropertySymbols) {
+    var symbols = Object.getOwnPropertySymbols(object);
+    enumerableOnly && (symbols = symbols.filter(function(sym) {
+      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+    })), keys.push.apply(keys, symbols);
+  }
+  return keys;
+}
+function _objectSpread(target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = null != arguments[i] ? arguments[i] : {};
+    i % 2 ? ownKeys(Object(source), true).forEach(function(key) {
+      _defineProperty(target, key, source[key]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) {
+      Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+    });
+  }
+  return target;
+}
+import React__default, { useState, useRef, useEffect, useCallback } from "react";
+import { u as useTouch } from "./use-touch.js";
+import { g as getRect } from "./use-client-rect.js";
+import Toast from "./Toast.js";
+import { useConfig } from "./ConfigProvider.js";
 var defaultProps = {
   range: false,
   hiddenRange: false,
@@ -20,57 +39,21 @@ var defaultProps = {
 };
 var startValue;
 var currentValue;
-var Range = function Range(props) {
-  var _useConfig = useConfig(),
-    locale = _useConfig.locale;
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
-    className = _defaultProps$props.className,
-    range = _defaultProps$props.range,
-    disabled = _defaultProps$props.disabled,
-    activeColor = _defaultProps$props.activeColor,
-    inactiveColor = _defaultProps$props.inactiveColor,
-    buttonColor = _defaultProps$props.buttonColor,
-    hiddenRange = _defaultProps$props.hiddenRange,
-    hiddenTag = _defaultProps$props.hiddenTag,
-    modelValue = _defaultProps$props.modelValue,
-    button = _defaultProps$props.button,
-    vertical = _defaultProps$props.vertical,
-    marks = _defaultProps$props.marks,
-    dragStart = _defaultProps$props.dragStart,
-    dragEnd = _defaultProps$props.dragEnd,
-    onChange = _defaultProps$props.onChange,
-    onDragStart = _defaultProps$props.onDragStart,
-    onDragEnd = _defaultProps$props.onDragEnd,
-    minDesc = _defaultProps$props.minDesc,
-    maxDesc = _defaultProps$props.maxDesc,
-    curValueDesc = _defaultProps$props.curValueDesc;
-  var _defaultProps$props2 = _objectSpread(_objectSpread({}, defaultProps), props),
-    min = _defaultProps$props2.min,
-    max = _defaultProps$props2.max,
-    step = _defaultProps$props2.step;
+var Range = function Range2(props) {
+  var _useConfig = useConfig(), locale = _useConfig.locale;
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), className = _defaultProps$props.className, range = _defaultProps$props.range, disabled = _defaultProps$props.disabled, activeColor = _defaultProps$props.activeColor, inactiveColor = _defaultProps$props.inactiveColor, buttonColor = _defaultProps$props.buttonColor, hiddenRange = _defaultProps$props.hiddenRange, hiddenTag = _defaultProps$props.hiddenTag, modelValue = _defaultProps$props.modelValue, button = _defaultProps$props.button, vertical = _defaultProps$props.vertical, marks = _defaultProps$props.marks, dragStart = _defaultProps$props.dragStart, dragEnd = _defaultProps$props.dragEnd, onChange = _defaultProps$props.onChange, onDragStart = _defaultProps$props.onDragStart, onDragEnd = _defaultProps$props.onDragEnd, minDesc = _defaultProps$props.minDesc, maxDesc = _defaultProps$props.maxDesc, curValueDesc = _defaultProps$props.curValueDesc;
+  var _defaultProps$props2 = _objectSpread(_objectSpread({}, defaultProps), props), min = _defaultProps$props2.min, max = _defaultProps$props2.max, step = _defaultProps$props2.step;
   min = Number(min);
   max = Number(max);
   step = Number(step);
-  var _useState = useState(0),
-    _useState2 = _slicedToArray(_useState, 2),
-    buttonIndex = _useState2[0],
-    SetButtonIndex = _useState2[1];
-  var _useState3 = useState(),
-    _useState4 = _slicedToArray(_useState3, 2),
-    initValue = _useState4[0],
-    SetInitValue = _useState4[1];
-  var _useState5 = useState('start'),
-    _useState6 = _slicedToArray(_useState5, 2),
-    dragStatus = _useState6[0],
-    SetDragStatus = _useState6[1];
+  var _useState = useState(0), _useState2 = _slicedToArray(_useState, 2), buttonIndex = _useState2[0], SetButtonIndex = _useState2[1];
+  var _useState3 = useState(), _useState4 = _slicedToArray(_useState3, 2), initValue = _useState4[0], SetInitValue = _useState4[1];
+  var _useState5 = useState("start"), _useState6 = _slicedToArray(_useState5, 2), dragStatus = _useState6[0], SetDragStatus = _useState6[1];
   var touch = useTouch();
   var root = useRef(null);
-  var _useState7 = useState([]),
-    _useState8 = _slicedToArray(_useState7, 2),
-    marksList = _useState8[0],
-    SetMarksList = _useState8[1];
-  useEffect(function () {
-    if (typeof modelValue === 'number') {
+  var _useState7 = useState([]), _useState8 = _slicedToArray(_useState7, 2), marksList = _useState8[0], SetMarksList = _useState8[1];
+  useEffect(function() {
+    if (typeof modelValue === "number") {
       if (!range && (modelValue < min || modelValue > max)) {
         SetInitValue(0);
         Toast.text("".concat(modelValue, " ").concat(locale.range.rangeText));
@@ -79,100 +62,92 @@ var Range = function Range(props) {
       SetInitValue(modelValue);
     }
   }, [modelValue]);
-  useEffect(function () {
+  useEffect(function() {
     if (marks) {
       var marksKeys = Object.keys(marks);
-      var list = marksKeys.map(parseFloat).sort(function (a, b) {
+      var list = marksKeys.map(parseFloat).sort(function(a, b) {
         return a - b;
-      }).filter(function (point) {
+      }).filter(function(point) {
         return point >= min && point <= max;
       });
       SetMarksList(list);
     }
   }, [marks]);
-  var scope = function scope() {
+  var scope = function scope2() {
     return Number(max) - Number(min);
   };
-  var classes = useCallback(function () {
-    var prefixCls = 'nut-range';
-    return [prefixCls, "".concat(disabled ? "".concat(prefixCls, "-disabled") : ''), "".concat(vertical ? "".concat(prefixCls, "-vertical") : ''), "".concat(!hiddenRange ? "".concat(prefixCls, "-show-number") : '')].filter(Boolean).join(' ');
+  var classes = useCallback(function() {
+    var prefixCls = "nut-range";
+    return [prefixCls, "".concat(disabled ? "".concat(prefixCls, "-disabled") : ""), "".concat(vertical ? "".concat(prefixCls, "-vertical") : ""), "".concat(!hiddenRange ? "".concat(prefixCls, "-show-number") : "")].filter(Boolean).join(" ");
   }, [disabled, vertical, hiddenRange]);
-  var containerClasses = useCallback(function () {
-    var prefixCls = 'nut-range-container';
-    return [prefixCls, "".concat(vertical ? "".concat(prefixCls, "-vertical") : ''), className].filter(Boolean).join(' ');
+  var containerClasses = useCallback(function() {
+    var prefixCls = "nut-range-container";
+    return [prefixCls, "".concat(vertical ? "".concat(prefixCls, "-vertical") : ""), className].filter(Boolean).join(" ");
   }, [vertical, className]);
-  var markClassName = useCallback(function (mark) {
-    var classPrefix = 'nut-range-mark';
+  var markClassName = useCallback(function(mark) {
+    var classPrefix = "nut-range-mark";
     var lowerBound = Number(min);
     var upperBound = Number(max);
     if (range) {
-      var _modelValue = _slicedToArray(modelValue, 2),
-        left = _modelValue[0],
-        right = _modelValue[1];
+      var _modelValue = _slicedToArray(modelValue, 2), left = _modelValue[0], right = _modelValue[1];
       lowerBound = left;
       upperBound = right;
     } else {
       upperBound = modelValue;
     }
     var isActive = mark <= upperBound && mark >= lowerBound;
-    return ["".concat(classPrefix, "-text"), "".concat(isActive ? "".concat(classPrefix, "-text-active") : '')].filter(Boolean).join(' ');
+    return ["".concat(classPrefix, "-text"), "".concat(isActive ? "".concat(classPrefix, "-text-active") : "")].filter(Boolean).join(" ");
   }, [range, modelValue, min, max]);
-  var _useState9 = useState(classes()),
-    _useState10 = _slicedToArray(_useState9, 2),
-    rangeName = _useState10[0],
-    setRangeName = _useState10[1];
-  var _useState11 = useState(containerClasses()),
-    _useState12 = _slicedToArray(_useState11, 2),
-    containerName = _useState12[0],
-    setContainerName = _useState12[1];
-  useEffect(function () {
+  var _useState9 = useState(classes()), _useState10 = _slicedToArray(_useState9, 2), rangeName = _useState10[0], setRangeName = _useState10[1];
+  var _useState11 = useState(containerClasses()), _useState12 = _slicedToArray(_useState11, 2), containerName = _useState12[0], setContainerName = _useState12[1];
+  useEffect(function() {
     setRangeName(classes());
     setContainerName(containerClasses());
   }, [classes, containerClasses]);
-  var wrapperStyle = function wrapperStyle() {
+  var wrapperStyle = function wrapperStyle2() {
     return {
       background: inactiveColor
     };
   };
-  var buttonStyle = function buttonStyle() {
+  var buttonStyle = function buttonStyle2() {
     return {
       borderColor: buttonColor
     };
   };
-  var isRange = function isRange(val) {
+  var isRange = function isRange2(val) {
     return !!range && Array.isArray(val);
   };
-  var calcMainAxis = function calcMainAxis() {
+  var calcMainAxis = function calcMainAxis2() {
     var modelVal = initValue || initValue === 0 ? initValue : modelValue;
     if (isRange(modelVal)) {
       return "".concat((modelVal[1] - modelVal[0]) * 100 / scope(), "%");
     }
     return "".concat((modelVal - Number(min)) * 100 / scope(), "%");
   };
-  var calcOffset = function calcOffset() {
+  var calcOffset = function calcOffset2() {
     var modelVal = initValue || initValue === 0 ? initValue : modelValue;
     if (isRange(modelVal)) {
       return "".concat((modelVal[0] - Number(min)) * 100 / scope(), "%");
     }
     return "0%";
   };
-  var barStyle = function barStyle() {
+  var barStyle = function barStyle2() {
     if (vertical) {
       return {
         height: calcMainAxis(),
         top: calcOffset(),
         background: activeColor,
-        transition: dragStatus ? 'none' : undefined
+        transition: dragStatus ? "none" : void 0
       };
     }
     return {
       width: calcMainAxis(),
       left: calcOffset(),
       background: activeColor,
-      transition: dragStatus ? 'none' : undefined
+      transition: dragStatus ? "none" : void 0
     };
   };
-  var marksStyle = function marksStyle(mark) {
+  var marksStyle = function marksStyle2(mark) {
     var style = {
       left: "".concat((mark - Number(min)) / scope() * 100, "%")
     };
@@ -183,13 +158,11 @@ var Range = function Range(props) {
     }
     return style;
   };
-  var tickStyle = function tickStyle(mark) {
+  var tickStyle = function tickStyle2(mark) {
     var lowerBound = Number(min);
     var upperBound = Number(max);
     if (range) {
-      var _modelValue2 = _slicedToArray(modelValue, 2),
-        left = _modelValue2[0],
-        right = _modelValue2[1];
+      var _modelValue2 = _slicedToArray(modelValue, 2), left = _modelValue2[0], right = _modelValue2[1];
       lowerBound = left;
       upperBound = right;
     }
@@ -199,20 +172,20 @@ var Range = function Range(props) {
     };
     return style;
   };
-  var format = function format(value) {
+  var format = function format2(value) {
     value = Math.max(+min, Math.min(value, +max));
     return Math.round(value / +step) * +step;
   };
-  var isSameValue = function isSameValue(newValue, oldValue) {
+  var isSameValue = function isSameValue2(newValue, oldValue) {
     return JSON.stringify(newValue) === JSON.stringify(oldValue);
   };
-  var handleOverlap = function handleOverlap(value) {
+  var handleOverlap = function handleOverlap2(value) {
     if (value[0] > value[1]) {
       return value.slice(0).reverse();
     }
     return value;
   };
-  var updateValue = function updateValue(value, end) {
+  var updateValue = function updateValue2(value, end) {
     if (isRange(value)) {
       value = handleOverlap(value).map(format);
     } else {
@@ -226,11 +199,11 @@ var Range = function Range(props) {
       onChange && onChange(value);
     }
   };
-  var click = function click(event) {
+  var click = function click2(event) {
     if (disabled || !root.current) {
       return;
     }
-    SetDragStatus('');
+    SetDragStatus("");
     var rect = getRect(root.current);
     var delta = event.clientX - rect.left;
     var total = rect.width;
@@ -241,10 +214,7 @@ var Range = function Range(props) {
     var value = Number(min) + delta / total * scope();
     currentValue = initValue || initValue === 0 ? initValue : modelValue;
     if (isRange(currentValue)) {
-      var _currentValue = currentValue,
-        _currentValue2 = _slicedToArray(_currentValue, 2),
-        left = _currentValue2[0],
-        right = _currentValue2[1];
+      var _currentValue = currentValue, _currentValue2 = _slicedToArray(_currentValue, 2), left = _currentValue2[0], right = _currentValue2[1];
       var middle = (left + right) / 2;
       if (value <= middle) {
         updateValue([value, right], true);
@@ -266,18 +236,18 @@ var Range = function Range(props) {
     } else {
       startValue = format(currentValue);
     }
-    SetDragStatus('start');
+    SetDragStatus("start");
   };
   var _onTouchMove = function onTouchMove(event) {
     if (disabled || !root.current) {
       return;
     }
-    if (dragStatus === 'start') {
+    if (dragStatus === "start") {
       dragStart && dragStart();
       onDragStart && onDragStart();
     }
     touch.move(event);
-    SetDragStatus('draging');
+    SetDragStatus("draging");
     var rect = getRect(root.current);
     var delta = touch.deltaX;
     var total = rect.width;
@@ -298,16 +268,16 @@ var Range = function Range(props) {
     if (disabled) {
       return;
     }
-    if (dragStatus === 'draging') {
+    if (dragStatus === "draging") {
       updateValue(currentValue, true);
       dragEnd && dragEnd();
       onDragEnd && onDragEnd();
     }
-    SetDragStatus('');
+    SetDragStatus("");
   };
-  var curValue = function curValue(idx) {
+  var curValue = function curValue2(idx) {
     var modelVal = initValue || initValue === 0 ? initValue : modelValue;
-    var value = typeof idx === 'number' ? modelVal[idx] : modelVal;
+    var value = typeof idx === "number" ? modelVal[idx] : modelVal;
     return value;
   };
   return React__default.createElement("div", {
@@ -323,31 +293,30 @@ var Range = function Range(props) {
     }
   }, marksList.length > 0 ? React__default.createElement("div", {
     className: "nut-range-mark"
-  }, marksList.map(function (marks) {
+  }, marksList.map(function(marks2) {
     return React__default.createElement("span", {
-      key: marks,
-      className: markClassName(marks),
-      style: marksStyle(marks)
-    }, marks, React__default.createElement("span", {
+      key: marks2,
+      className: markClassName(marks2),
+      style: marksStyle(marks2)
+    }, marks2, React__default.createElement("span", {
       className: "nut-range-tick",
-      style: tickStyle(marks)
+      style: tickStyle(marks2)
     }));
   })) : null, React__default.createElement("div", {
     className: "nut-range-bar",
     style: barStyle()
-  }, range ? [0, 1].map(function (item, index) {
+  }, range ? [0, 1].map(function(item, index) {
     return React__default.createElement("div", {
       role: "slider",
       key: index,
-      className: "".concat(index === 0 ? 'nut-range-button-wrapper-left' : '', "\n                  ").concat(index === 1 ? 'nut-range-button-wrapper-right' : ''),
+      className: "".concat(index === 0 ? "nut-range-button-wrapper-left" : "", "\n                  ").concat(index === 1 ? "nut-range-button-wrapper-right" : ""),
       tabIndex: disabled ? -1 : 0,
       "aria-valuemin": +min,
       "aria-valuenow": curValue(index),
       "aria-valuemax": +max,
-      "aria-orientation": vertical ? 'vertical' : 'horizontal',
+      "aria-orientation": vertical ? "vertical" : "horizontal",
       onTouchStart: function onTouchStart(e) {
-        if (typeof index === 'number') {
-          // 实时更新当前拖动的按钮索引
+        if (typeof index === "number") {
           SetButtonIndex(index);
         }
         _onTouchStart(e);
@@ -377,7 +346,7 @@ var Range = function Range(props) {
     "aria-valuemin": +min,
     "aria-valuenow": curValue(),
     "aria-valuemax": +max,
-    "aria-orientation": vertical ? 'vertical' : 'horizontal',
+    "aria-orientation": vertical ? "vertical" : "horizontal",
     onTouchStart: function onTouchStart(e) {
       _onTouchStart(e);
     },
@@ -403,5 +372,7 @@ var Range = function Range(props) {
   }, maxDesc || +max) : null);
 };
 Range.defaultProps = defaultProps;
-Range.displayName = 'NutRange';
-export { Range as default };
+Range.displayName = "NutRange";
+export {
+  Range as default
+};

package/dist/esm/Rate/style/index.js

@@ -1,2 +1,2 @@
-import '../../Icon/style'
+
 import '../../../packages/rate/rate.scss'

package/dist/esm/Rate.js

@@ -1,123 +1,105 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-import React__default, { useState, useEffect } from 'react';
-import classNames from 'classnames';
-import { c as cn } from './bem-3b438e61.js';
-import Icon from './Icon.js';
-import { C as ComponentDefaults } from './typings-f27b58f4.js';
-import '@bem-react/classname';
+function ownKeys(object, enumerableOnly) {
+  var keys = Object.keys(object);
+  if (Object.getOwnPropertySymbols) {
+    var symbols = Object.getOwnPropertySymbols(object);
+    enumerableOnly && (symbols = symbols.filter(function(sym) {
+      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+    })), keys.push.apply(keys, symbols);
+  }
+  return keys;
+}
+function _objectSpread(target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = null != arguments[i] ? arguments[i] : {};
+    i % 2 ? ownKeys(Object(source), true).forEach(function(key) {
+      _defineProperty(target, key, source[key]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) {
+      Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+    });
+  }
+  return target;
+}
+import React__default, { useState, useEffect } from "react";
+import classNames from "classnames";
+import { StarFillN } from "@nutui/icons-react";
+import { C as ComponentDefaults } from "./typings.js";
+import { u as usePropsValue } from "./use-props-value.js";
 var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
   count: 5,
-  modelValue: 0,
-  minimizeValue: 0,
-  iconSize: 18,
-  activeColor: '',
-  voidColor: '',
-  checkedIcon: 'star-fill-n',
-  uncheckedIcon: 'star-n',
+  min: 0,
+  checkedIcon: null,
+  uncheckedIcon: null,
   disabled: false,
-  readonly: false,
-  allowHalf: false,
-  spacing: 14
+  readOnly: false,
+  allowHalf: false
 });
-var Rate = function Rate(props) {
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
-    className = _defaultProps$props.className,
-    style = _defaultProps$props.style,
-    count = _defaultProps$props.count,
-    modelValue = _defaultProps$props.modelValue,
-    minimizeValue = _defaultProps$props.minimizeValue,
-    iconSize = _defaultProps$props.iconSize,
-    activeColor = _defaultProps$props.activeColor,
-    voidColor = _defaultProps$props.voidColor,
-    checkedIcon = _defaultProps$props.checkedIcon,
-    uncheckedIcon = _defaultProps$props.uncheckedIcon,
-    disabled = _defaultProps$props.disabled,
-    readonly = _defaultProps$props.readonly,
-    allowHalf = _defaultProps$props.allowHalf,
-    spacing = _defaultProps$props.spacing,
-    onChange = _defaultProps$props.onChange,
-    iconClassPrefix = _defaultProps$props.iconClassPrefix,
-    iconFontClassName = _defaultProps$props.iconFontClassName;
-  var b = cn('rate');
-  var bi = cn('rate-item');
-  var _useState = useState([1, 2, 3, 4, 5]),
-    _useState2 = _slicedToArray(_useState, 2),
-    countArray = _useState2[0],
-    setCountArray = _useState2[1];
-  var _useState3 = useState(0),
-    _useState4 = _slicedToArray(_useState3, 2),
-    score = _useState4[0],
-    setScore = _useState4[1];
-  useEffect(function () {
+var Rate = function Rate2(props) {
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), className = _defaultProps$props.className, style = _defaultProps$props.style, count = _defaultProps$props.count, value = _defaultProps$props.value, defaultValue = _defaultProps$props.defaultValue, min = _defaultProps$props.min, checkedIcon = _defaultProps$props.checkedIcon, uncheckedIcon = _defaultProps$props.uncheckedIcon, disabled = _defaultProps$props.disabled, readOnly = _defaultProps$props.readOnly, allowHalf = _defaultProps$props.allowHalf, onChange = _defaultProps$props.onChange;
+  var classPrefix = "nut-rate";
+  var _useState = useState([1, 2, 3, 4, 5]), _useState2 = _slicedToArray(_useState, 2), countArray = _useState2[0], setCountArray = _useState2[1];
+  var _usePropsValue = usePropsValue({
+    value,
+    defaultValue: Math.max(defaultValue || 0, min),
+    finalValue: 0,
+    onChange
+  }), _usePropsValue2 = _slicedToArray(_usePropsValue, 2), score = _usePropsValue2[0], setScore = _usePropsValue2[1];
+  useEffect(function() {
     var tmp = [];
     for (var i = 1; i <= Number(count); i++) {
       tmp.push(i);
     }
     setCountArray(tmp);
   }, [count]);
-  useEffect(function () {
-    setScore(Math.max(Number(modelValue), Number(minimizeValue)));
-  }, [modelValue]);
-  var pxCheck = function pxCheck(value) {
-    return Number.isNaN(Number(value)) ? String(value) : "".concat(value, "px");
+  var renderIcon = function renderIcon2(n) {
+    return n <= score ? checkedIcon || React__default.createElement(StarFillN, null) : uncheckedIcon || (checkedIcon ? React__default.cloneElement(checkedIcon, {
+      color: void 0
+    }) : React__default.createElement(StarFillN, null));
   };
   var _onClick = function onClick(e, index) {
     e.preventDefault();
     e.stopPropagation();
-    if (disabled || readonly) return;
-    var value = 0;
+    if (disabled || readOnly)
+      return;
+    var value2 = 0;
     if (!(index === 1 && score === index)) {
-      value = index;
-      if (allowHalf) {
-        if ((e === null || e === void 0 ? void 0 : e.target).className.includes('__icon--half')) {
-          value -= 0.5;
-        }
-      }
+      value2 = index;
     }
-    value = Math.max(value, Number(minimizeValue));
-    setScore(value);
-    onChange && onChange(value);
+    value2 = Math.max(value2, min);
+    setScore(value2);
+  };
+  var onHalfClick = function onHalfClick2(event, n) {
+    event.preventDefault();
+    event.stopPropagation();
+    var value2 = Math.max(min, n - 0.5);
+    setScore(value2);
   };
   return React__default.createElement("div", {
-    className: classNames(b(), className),
-    style: style
-  }, countArray.map(function (n) {
+    className: classNames(classPrefix, className, {
+      disabled,
+      readonly: readOnly
+    }),
+    style
+  }, countArray.map(function(n) {
     return React__default.createElement("div", {
-      className: bi(),
+      className: "".concat(classPrefix, "-item"),
       key: n,
       onClick: function onClick(event) {
         return _onClick(event, n);
-      },
-      style: {
-        marginRight: pxCheck(spacing)
       }
-    }, React__default.createElement(Icon, {
-      classPrefix: iconClassPrefix,
-      fontClassName: iconFontClassName,
-      size: iconSize,
-      className: classNames(bi('icon'), _defineProperty({}, bi('icon--disabled'), disabled || n > score)),
-      name: n <= score ? checkedIcon : uncheckedIcon,
-      color: n <= score ? activeColor : voidColor
-    }), allowHalf && score > n - 1 && React__default.createElement(Icon, {
-      classPrefix: iconClassPrefix,
-      fontClassName: iconFontClassName,
-      className: "".concat(bi('icon'), " ").concat(bi('icon--half')),
-      color: n <= score ? activeColor : voidColor,
-      size: iconSize,
-      name: checkedIcon
-    }), allowHalf && score < n - 1 && React__default.createElement(Icon, {
-      classPrefix: iconClassPrefix,
-      fontClassName: iconFontClassName,
-      className: "".concat(bi('icon'), " ").concat(bi('icon--disabled'), " ").concat(bi('icon--half')),
-      color: voidColor,
-      size: iconSize,
-      name: uncheckedIcon
-    }));
+    }, React__default.createElement("div", {
+      className: classNames("".concat(classPrefix, "-item__icon"), _defineProperty({}, "".concat(classPrefix, "-item__icon--disabled"), disabled || n > score))
+    }, renderIcon(n)), allowHalf && score > n - 1 && React__default.createElement("div", {
+      className: classNames("".concat(classPrefix, "-item__half"), "".concat(classPrefix, "-item__icon"), "".concat(classPrefix, "-item__icon--half")),
+      onClick: function onClick(event) {
+        return onHalfClick(event, n);
+      }
+    }, renderIcon(n)));
   }));
 };
 Rate.defaultProps = defaultProps;
-Rate.displayName = 'NutRate';
-export { Rate as default };
+Rate.displayName = "NutRate";
+export {
+  Rate as default
+};