docs(steps): vue3

demo/documentation/components/steps/enUS/basic.demo.md

@@ -37,7 +37,7 @@
     </template>
   </n-button>
 </n-button-group>
-<n-radio-group v-model="currentStatus" size="medium" name="basic">
+<n-radio-group v-model:value="currentStatus" size="medium" name="basic">
   <n-radio-button value="error">
     Error
   </n-radio-button>

demo/documentation/components/steps/enUS/content.demo.md

@@ -54,7 +54,7 @@
   </n-step>
 </n-steps>
 
-<n-radio-group v-model="currentStatus" size="medium" name="basic">
+<n-radio-group v-model:value="currentStatus" size="medium" name="basic">
   <n-radio-button value="error">
     Error
   </n-radio-button>

demo/documentation/components/steps/enUS/index.demo-entry.md

@@ -13,18 +13,18 @@ content
 ### Steps Props
 |Name|Type|Default|Description|
 |-|-|-|-|
-|theme|`'light' \| 'dark' \| null \| string`|`null`||
-|current|`number`|`null`||
-|status|`'process' \| 'finish' \| 'error' \| 'wait'`|`'process'`||
+|current|`number`|`undefined`||
 |size|`'small' \| 'medium'`|`'medium'`||
+|status|`'process' \| 'finish' \| 'error' \| 'wait'`|`'process'`||
+|theme|`'light' \| 'dark' \| null \| string`|`null`||
 |vertical|`boolean`|`false`||
 
 ### Step Props
 |Name|Type|Default|Description|
 |-|-|-|-|
-|title|`string`|`null`||
-|description|`string`|`null`||
-|status|`'process' \| 'finish' \| 'error' \| 'wait'`|`'process'`||
+|description|`string`|`undefined`||
+|status|`'process' \| 'finish' \| 'error' \| 'wait'`|`undefined`||
+|title|`string`|`undefined`||
 
 ## Slots
 ### Steps Slots

demo/documentation/components/steps/enUS/size.demo.md

@@ -39,7 +39,7 @@ Steps has `small`, `medium` size.
     </template>
   </n-button>
 </n-button-group>
-<n-radio-group v-model="currentStatus" size="medium" name="size">
+<n-radio-group v-model:value="currentStatus" size="medium" name="size">
   <n-radio-button value="error">
     Error
   </n-radio-button>

demo/documentation/components/steps/enUS/vertical.demo.md

@@ -38,7 +38,7 @@
     </template>
   </n-button>
 </n-button-group>
-<n-radio-group v-model="currentStatus" size="medium" name="vertical">
+<n-radio-group v-model:value="currentStatus" size="medium" name="vertical">
   <n-radio-button value="error">
     Error
   </n-radio-button>

demo/documentation/components/steps/zhCN/basic.demo.md

@@ -37,7 +37,7 @@
     </template>
   </n-button>
 </n-button-group>
-<n-radio-group v-model="currentStatus" size="medium" name="basic">
+<n-radio-group v-model:value="currentStatus" size="medium" name="basic">
   <n-radio-button value="error">
     Error
   </n-radio-button>

demo/documentation/components/steps/zhCN/content.demo.md

@@ -54,7 +54,7 @@
   </n-step>
 </n-steps>
 
-<n-radio-group v-model="currentStatus" size="medium" name="basic">
+<n-radio-group v-model:value="currentStatus" size="medium" name="basic">
   <n-radio-button value="error">
     Error
   </n-radio-button>

demo/documentation/components/steps/zhCN/index.demo-entry.md

@@ -13,18 +13,18 @@ content
 ### Steps Props
 |名称|类型|默认值|说明|
 |-|-|-|-|
-|theme|`'light' \| 'dark' \| null \| string`|`null`||
-|current|`number`|`null`||
-|status|`'process' \| 'finish' \| 'error' \| 'wait'`|`'process'`||
+|current|`number`|`undefined`||
 |size|`'small' \| 'medium'`|`'medium'`||
+|status|`'process' \| 'finish' \| 'error' \| 'wait'`|`'process'`||
+|theme|`'light' \| 'dark' \| null \| string`|`null`||
 |vertical|`boolean`|`false`||
 
 ### Step Props
 |名称|类型|默认值|说明|
 |-|-|-|-|
-|title|`string`|`null`||
-|description|`string`|`null`||
-|status|`'process' \| 'finish' \| 'error' \| 'wait'`|`'process'`||
+|description|`string`|`undefined`||
+|status|`'process' \| 'finish' \| 'error' \| 'wait'`|`undefined`||
+|title|`string`|`undefined`||
 
 ## Slots
 ### Steps Slots

demo/documentation/components/steps/zhCN/size.demo.md

@@ -39,7 +39,7 @@
     </template>
   </n-button>
 </n-button-group>
-<n-radio-group v-model="currentStatus" size="medium" name="size">
+<n-radio-group v-model:value="currentStatus" size="medium" name="size">
   <n-radio-button value="error">
     Error
   </n-radio-button>

demo/documentation/components/steps/zhCN/vertical.demo.md

@@ -38,7 +38,7 @@
     </template>
   </n-button>
 </n-button-group>
-<n-radio-group v-model="currentStatus" size="medium" name="vertical">
+<n-radio-group v-model:value="currentStatus" size="medium" name="vertical">
   <n-radio-button value="error">
     Error
   </n-radio-button>

src/steps/src/Step.vue

@@ -2,7 +2,7 @@
   <div
     class="n-step"
     :class="{
-      [`n-step--${syntheticStatus}`]: syntheticStatus !== null
+      [`n-step--${mergedStatus}`]: mergedStatus
     }"
   >
     <div class="n-step-indicator">
@@ -11,23 +11,23 @@
       >
         <n-icon-switch-transition>
           <div
-            v-if="!(syntheticStatus === 'finish' || syntheticStatus === 'error')"
+            v-if="!(mergedStatus === 'finish' || mergedStatus === 'error')"
             key="index"
             class="n-step-indicator-slot__index"
             :style="{
-              color: syntheticStatus === 'process' ? ascendantBackgroundColor : null
+              color: mergedStatus === 'process' ? ascendantBackgroundColor : null
             }"
           >
             {{ index }}
           </div>
           <n-icon
-            v-else-if="syntheticStatus === 'finish'"
+            v-else-if="mergedStatus === 'finish'"
             key="finish"
           >
             <finished-icon />
           </n-icon>
           <n-icon
-            v-else-if="syntheticStatus === 'error'"
+            v-else-if="mergedStatus === 'error'"
             key="error"
           >
             <error-icon />
@@ -44,7 +44,7 @@
         <div v-if="!vertical" class="n-step-splitor" />
       </div>
       <div
-        v-if="description !== null || $slots.default"
+        v-if="description !== undefined || $slots.default"
         class="n-step-content__description"
       >
         <slot>{{ description }}</slot>
@@ -79,22 +79,22 @@ export default {
   props: {
     status: {
       type: String,
-      default: null,
+      default: undefined,
       validator (value) {
         return ['process', 'finish', 'error', 'wait'].includes(value)
       }
     },
     title: {
       type: String,
-      default: null
+      default: undefined
     },
     description: {
       type: String,
-      default: null
+      default: undefined
     },
     index: {
       type: [Number, String],
-      default: null
+      default: undefined
     }
   },
   computed: {
@@ -110,7 +110,7 @@ export default {
     stepsStatus () {
       return this.NSteps && this.NSteps.status
     },
-    syntheticStatus () {
+    mergedStatus () {
       if (this.status) {
         return this.status
       } else if (this.index < this.current) {
@@ -120,7 +120,7 @@ export default {
       } else if (this.index > this.current) {
         return 'wait'
       }
-      return null
+      return undefined
     }
   }
 }

src/steps/src/Steps.js

@@ -35,7 +35,7 @@ export default {
   props: {
     current: {
       type: Number,
-      default: null
+      default: undefined
     },
     status: {
       type: String,