Revert "fix(inputnumber): icon 适配 && 修改icon宽度和设定的--nut-icon-width一致 (#…

…2707)"

This reverts commit 9338353.

src/packages/inputnumber/doc.en-US.md

@@ -147,7 +147,7 @@ The component provides the following CSS variables, which can be used to customi
 | \--nutui-inputnumber-input-border | The border value of the input in the number input box | `0` |
 | \--nutui-inputnumber-input-border-radius | The rounded corners of the input in the number input box | `6px` |
 | \--nutui-inputnumber-input-margin | The rounded corners of the input in the number input box | `0` |
-| \--nutui-inputnumber-button-width | The width of the left and right buttons of the number input box | `16px` |
+| \--nutui-inputnumber-button-width | The width of the left and right buttons of the number input box | `14px` |
 | \--nutui-inputnumber-button-height | The height of the left and right buttons of the number input box | `16px` |
 | \--nutui-inputnumber-button-border-radius | The rounded corners of the left and right buttons of the number input box | `30px` |
 | \--nutui-inputnumber-button-background-color | The background color of the left and right buttons of the number input box | `transparent` |

src/packages/inputnumber/doc.md

@@ -147,7 +147,7 @@ import { InputNumber } from '@nutui/nutui-react'
 | \--nutui-inputnumber-input-border | 数字输入框中input的border值 | `0` |
 | \--nutui-inputnumber-input-border-radius | 数字输入框中input的圆角 | `6px` |
 | \--nutui-inputnumber-input-margin | 数字输入框中input的margin值 | `0` |
-| \--nutui-inputnumber-button-width | 数字输入框左右按钮的宽度 | `16px` |
+| \--nutui-inputnumber-button-width | 数字输入框左右按钮的宽度 | `14px` |
 | \--nutui-inputnumber-button-height | 数字输入框左右按钮的高度 | `16px` |
 | \--nutui-inputnumber-button-border-radius | 数字输入框左右按钮的圆角 | `30px` |
 | \--nutui-inputnumber-button-background-color | 数字输入框左右按钮的背景色 | `transparent` |

src/packages/inputnumber/doc.taro.md

@@ -139,7 +139,7 @@ import { InputNumber } from '@nutui/nutui-react-taro'
 | \--nutui-inputnumber-input-border | 数字输入框中input的border值 | `0` |
 | \--nutui-inputnumber-input-border-radius | 数字输入框中input的圆角 | `6px` |
 | \--nutui-inputnumber-input-margin | 数字输入框中input的margin值 | `0` |
-| \--nutui-inputnumber-button-width | 数字输入框左右按钮的宽度 | `16px` |
+| \--nutui-inputnumber-button-width | 数字输入框左右按钮的宽度 | `14px` |
 | \--nutui-inputnumber-button-height | 数字输入框左右按钮的高度 | `16px` |
 | \--nutui-inputnumber-button-border-radius | 数字输入框左右按钮的圆角 | `30px` |
 | \--nutui-inputnumber-button-background-color | 数字输入框左右按钮的背景色 | `transparent` |

src/packages/inputnumber/doc.zh-TW.md

@@ -138,7 +138,7 @@ import { InputNumber } from '@nutui/nutui-react'
 | \--nutui-inputnumber-input-border | 數字輸入框中input的border值 | `0` |
 | \--nutui-inputnumber-input-border-radius | 數字輸入框中input的圓角 | `6px` |
 | \--nutui-inputnumber-input-margin | 數字輸入框中input的margin值 | `0` |
-| \--nutui-inputnumber-button-width | 數字輸入框左右按鈕的寬度 | `16px` |
+| \--nutui-inputnumber-button-width | 數字輸入框左右按鈕的寬度 | `14px` |
 | \--nutui-inputnumber-button-height | 數字輸入框左右按鈕的高度 | `16px` |
 | \--nutui-inputnumber-button-border-radius | 數字輸入框左右按鈕的圓角 | `30px` |
 | \--nutui-inputnumber-button-background-color | 數字輸入框左右按鈕的背景色 | `transparent` |

src/packages/inputnumber/inputnumber.harmony.css

@@ -7,7 +7,7 @@
   display: flex;
   justify-content: center;
   align-items: center;
-  width: 16px;
+  width: 14px;
   height: 24px;
   background-color: transparent;
   border-radius: 16px;
@@ -16,7 +16,7 @@
   display: flex;
   justify-content: center;
   align-items: center;
-  width: 16px;
+  width: 14px;
   height: 24px;
   background-color: transparent;
   border-radius: 16px;

src/packages/inputnumber/inputnumber.taro.tsx

@@ -11,11 +11,12 @@ import {
   Input as TaroInput,
   InputProps,
   View,
+  Text,
 } from '@tarojs/components'
 import { Minus, Plus } from '@nutui/icons-react-taro'
 import { usePropsValue } from '@/utils/use-props-value'
 import { BasicComponent, ComponentDefaults } from '@/utils/typings'
-import { harmonyAndRn } from '@/utils/platform-taro'
+import { harmony, harmonyAndRn, rn } from '@/utils/platform-taro'
 
 export interface InputNumberProps extends BasicComponent {
   value: number | string
@@ -90,6 +91,8 @@ export const InputNumber: FunctionComponent<
     ...props,
   }
   const isRnAndHarmony = harmonyAndRn()
+  const isRn = rn()
+  const isHarmony = harmony()
   const classes = classNames(classPrefix, className)
   const [focused, setFocused] = useState(false)
   const inputRef = useRef<HTMLInputElement>(null)
@@ -250,16 +253,31 @@ export const InputNumber: FunctionComponent<
   return (
     <View className={classes} style={style}>
       <View className={`${classPrefix}-minus`} onClick={handleReduce}>
-        <Minus
-          className={classNames(
-            `${classPrefix}-icon ${classPrefix}-icon-minus`,
-            {
-              [`${classPrefix}-icon-disabled`]: shadowValue === min || disabled,
-            }
-          )}
-        />
+        {isRnAndHarmony ? (
+          <Text
+            className={classNames(
+              `${classPrefix}-icon ${classPrefix}-icon-minus`,
+              {
+                [`${classPrefix}-icon-disabled`]:
+                  shadowValue === min || disabled,
+              }
+            )}
+          >
+            -
+          </Text>
+        ) : (
+          <Minus
+            className={classNames(
+              `${classPrefix}-icon ${classPrefix}-icon-minus`,
+              {
+                [`${classPrefix}-icon-disabled`]:
+                  shadowValue === min || disabled,
+              }
+            )}
+          />
+        )}
       </View>
-      {isRnAndHarmony ? (
+      {isRn ? (
         <TaroInput
           className={classNames(`${classPrefix}-input`, {
             [`${classPrefix}-input-disabled`]: disabled,
@@ -290,14 +308,29 @@ export const InputNumber: FunctionComponent<
       )}
 
       <View className={`${classPrefix}-add`} onClick={handlePlus}>
-        <Plus
-          className={classNames(
-            `${classPrefix}-icon ${classPrefix}-icon-plus`,
-            {
-              [`${classPrefix}-icon-disabled`]: shadowValue === max || disabled,
-            }
-          )}
-        />
+        {isRnAndHarmony ? (
+          <Text
+            className={classNames(
+              `${classPrefix}-icon ${classPrefix}-icon-plus`,
+              {
+                [`${classPrefix}-icon-disabled`]:
+                  shadowValue === max || disabled,
+              }
+            )}
+          >
+            +
+          </Text>
+        ) : (
+          <Plus
+            className={classNames(
+              `${classPrefix}-icon ${classPrefix}-icon-plus`,
+              {
+                [`${classPrefix}-icon-disabled`]:
+                  shadowValue === max || disabled,
+              }
+            )}
+          />
+        )}
       </View>
     </View>
   )

src/styles/variables.scss

@@ -629,7 +629,7 @@ $inputnumber-input-border-radius: var(
   6px
 ) !default;
 $inputnumber-input-margin: var(--nutui-inputnumber-input-margin, 0) !default;
-$inputnumber-button-width: var(--nutui-inputnumber-button-width, 16px) !default;
+$inputnumber-button-width: var(--nutui-inputnumber-button-width, 14px) !default;
 $inputnumber-button-height: var(
   --nutui-inputnumber-button-height,
   24px