refactor(rate): clean codes

src/rate/demos/enUS/color.demo.md

@@ -1,8 +1,7 @@
 # Color
 
+That's how disaster happens.
+
 ```html
-<n-space>
-  <n-rate />
-  <n-rate color="#4fb233" />
-</n-space>
+<n-rate color="#4fb233" />
 ```

src/rate/demos/enUS/index.demo-entry.md

@@ -14,12 +14,12 @@ icon
 ## Props
 
 | 名称 | 类型 | 默认值 | 说明 |
-| --- | --- | --- | --- | --- | --- |
+| --- | --- | --- | --- |
 | count | `number` | `5` |  |
 | value | `number` | `undefined` |  |
 | default-value | `number` | `0` |  |
 | size | `'small' \| 'medium' \| 'large' \| number` | `'medium'` |  |
-| on-update:value | `(value: number) => void` | `undefined` |  |  |  |
+| on-update:value | `(value: number) => void` | `undefined` |  |
 
 ## Slots
 

src/rate/demos/zhCN/color.demo.md

@@ -1,9 +1,7 @@
 # 颜色
 
-灾难就这么发生了
+灾难就是这么发生的。
+
 ```html
-<n-space align="center">
-  <n-rate />
-  <n-rate color="#4fb233" />
-</n-space>
+<n-rate color="#4fb233" />
 ```

src/rate/src/Rate.tsx

@@ -25,10 +25,7 @@ const rateProps = {
     type: Number,
     default: 5
   },
-  value: {
-    type: Number,
-    default: undefined
-  },
+  value: Number,
   defaultValue: {
     type: Number,
     default: 0
@@ -99,13 +96,14 @@ export default defineComponent({
         const { size } = props
         const {
           common: { cubicBezierEaseInOut },
-          self: { itemColor, itemColorActive, itemSize }
+          self
         } = themeRef.value
-        let mergedSize: string = itemSize
+        const { itemColor, itemColorActive } = self
+        let mergedSize: string
         if (typeof size === 'number') {
           mergedSize = `${size}px`
         } else {
-          mergedSize = themeRef.value.self[createKey('size', size)]
+          mergedSize = self[createKey('size', size)]
         }
         return {
           '--bezier': cubicBezierEaseInOut,

src/rate/styles/light.ts

@@ -7,8 +7,7 @@ const self = (vars: ThemeCommonVars) => {
   return {
     itemColor: railColor,
     itemColorActive: '#FFCC33',
-    itemSize: '20px',
-    sizeSmall: '14px',
+    sizeSmall: '16px',
     sizeMedium: '20px',
     sizeLarge: '24px'
   }