From 04f1f0538bd77ba03f1684b852a91539005e6298 Mon Sep 17 00:00:00 2001
From: lwl <1181102955@qq.com>
Date: Fri, 3 Dec 2021 09:56:48 +0800
Subject: [PATCH 1/3] =?UTF-8?q?docs:=20=E5=A2=9E=E5=8A=A0input=E8=8B=B1?=
 =?UTF-8?q?=E6=96=87=E6=96=87=E6=A1=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../devui-vue/docs/components/input/index.md  |  37 ++++---
 .../docs/en-US/components/input/index.md      | 104 ++++++++++++++++++
 2 files changed, 127 insertions(+), 14 deletions(-)
 create mode 100644 packages/devui-vue/docs/en-US/components/input/index.md

diff --git a/packages/devui-vue/docs/components/input/index.md b/packages/devui-vue/docs/components/input/index.md
index 896a29fb..f6abd640 100644
--- a/packages/devui-vue/docs/components/input/index.md
+++ b/packages/devui-vue/docs/components/input/index.md
@@ -12,17 +12,17 @@
 
 ```vue
 <template>
-  <h4 style="margin: 10px 0">Default</h4>
+  <h4>Default</h4>
 
-  <d-input placeholder="Please Enter" autoFocus id="textInput" class="dinput"></d-input>
+  <d-input placeholder="请输入" autoFocus id="textInput" class="dinput"></d-input>
 
-  <h4 style="margin: 10px 0">Disabled</h4>
+  <h4>Disabled</h4>
 
-  <d-input placeholder="Please Enter" :disabled="true" class="dinput"></d-input>
+  <d-input placeholder="请输入" :disabled="true" class="dinput"></d-input>
 
-  <h4 style="margin: 10px 0">Error</h4>
+  <h4>Error</h4>
 
-  <d-input placeholder="Please Enter" :error="true" class="dinput"></d-input>
+  <d-input placeholder="请输入" :error="true" class="dinput"></d-input>
 </template>
 <style>
 .dinput {
@@ -39,17 +39,17 @@
 
 ```vue
 <template>
-  <h4 style="margin: 10px 0">Small</h4>
+  <h4>Small</h4>
 
-  <d-input size="sm" class="dinput" placeholder="Please Enter"></d-input>
+  <d-input size="sm" class="dinput" placeholder="请输入"></d-input>
 
-  <h4 style="margin: 10px 0">Middle</h4>
+  <h4>Middle</h4>
 
-  <d-input class="dinput" placeholder="Please Enter"></d-input>
+  <d-input class="dinput" placeholder="请输入"></d-input>
 
-  <h4 style="margin: 10px 0">Large</h4>
+  <h4>Large</h4>
 
-  <d-input size="lg" placeholder="Please Enter" class="dinput"></d-input>
+  <d-input size="lg" placeholder="请输入" class="dinput"></d-input>
 </template>
 ```
 
@@ -61,7 +61,7 @@
 
 ```vue
 <template>
-  <d-input v-model="searchText" class="dinput" placeholder="Please Enter" showPassword></d-input>
+  <d-input v-model="searchText" class="dinput" placeholder="请输入" showPassword></d-input>
 </template>
 <script>
 import { defineComponent, ref } from 'vue'
@@ -84,7 +84,7 @@ export default defineComponent({
 |         参数          |       类型       |          默认           |                      说明                      |       跳转 Demo       |
 | :-------------------: | :--------------: | :---------------------: | :--------------------------------------------: | :-------------------: |
 |          id           |     `string`     |           --            |                可选，文本框 id                 | [基本用法](#基本用法) |
-| modelValue \/ v-model |     `string`     |           ''            |                     绑定值                     |   [密码框](#密码框)   |
+| v-model |     `string`     |           ''            |                     绑定值                     |   [密码框](#密码框)   |
 |      placeholder      |     `string`     |           --            |            可选，文本框 placeholder            | [基本用法](#基本用法) |
 |       maxLength       |     `number`     | Number.MAX_SAFE_INTEGER |           可选，输入框的 max-length            |                       |
 |       disabled        |    `boolean`     |          false          |             可选，文本框是否被禁用             | [基本用法](#基本用法) |
@@ -93,3 +93,12 @@ export default defineComponent({
 |       cssClass        |     `string`     |           ''            |          可选，支持传入类名到输入框上          |                       |
 |     showPassword      |    `boolean`     |          false          |                可选，密码输入框                |   [密码框](#密码框)   |
 |       autoFocus       |    `boolean`     |          false          |            可选，输入框是否自动对焦            | [基本用法](#基本用法) |
+
+<style>
+  h4 {
+    font-weight: 700;
+    color: #575d6c;
+    font-size: 12px;
+    margin: 15px 0;
+  }
+</style>
diff --git a/packages/devui-vue/docs/en-US/components/input/index.md b/packages/devui-vue/docs/en-US/components/input/index.md
new file mode 100644
index 00000000..2d1ca167
--- /dev/null
+++ b/packages/devui-vue/docs/en-US/components/input/index.md
@@ -0,0 +1,104 @@
+# Input
+
+Text input box.
+
+### When To Use
+
+When you want to manually enter text.
+
+### Basic Usage
+
+:::demo
+
+```vue
+<template>
+  <h4>Default</h4>
+
+  <d-input placeholder="Please Enter" autoFocus id="textInput" class="dinput"></d-input>
+
+  <h4>Disabled</h4>
+
+  <d-input placeholder="Please Enter" :disabled="true" class="dinput"></d-input>
+
+  <h4>Error</h4>
+
+  <d-input placeholder="Please Enter" :error="true" class="dinput"></d-input>
+</template>
+<style>
+.dinput {
+  width: 200px;
+}
+</style>
+```
+
+:::
+
+### Size
+
+:::demo
+
+```vue
+<template>
+  <h4>Small</h4>
+
+  <d-input size="sm" class="dinput" placeholder="Please Enter"></d-input>
+
+  <h4>Middle</h4>
+
+  <d-input class="dinput" placeholder="Please Enter"></d-input>
+
+  <h4>Large</h4>
+
+  <d-input size="lg" placeholder="Please Enter" class="dinput"></d-input>
+</template>
+```
+
+:::
+
+### Password Input
+
+:::demo
+
+```vue
+<template>
+  <d-input v-model="searchText" class="dinput" placeholder="Please Enter" showPassword></d-input>
+</template>
+<script>
+import { defineComponent, ref } from 'vue'
+
+export default defineComponent({
+  setup() {
+    const searchText = ref('')
+    return {
+      searchText
+    }
+  }
+})
+</script>
+```
+
+:::
+
+### API
+
+|      Parameter        |       Type      |      Default     |     Description   |   Jump to Demo |
+| :-------------------: | :--------------: | :---------------------: | :--------------------------------------------: | :-------------------: |
+|          id           |     `string`     |           --            |   Optional, input ID  | [Basic Usage](#BasicUsage) |
+| v-model |     `string`     |           ''            |  Optional, bound value  |   [Password Input](#PasswordInput)   |
+|      placeholder      |     `string`     |           --            |  Optional, input placeholder    | [Basic Usage](#BasicUsage) |
+|       maxLength       |     `number`     | Number.MAX_SAFE_INTEGER |  Optional, the max-length of the input box |         |
+|       disabled        |    `boolean`     |          false          |  Optional, whether the input box is disabled  | [Basic Usage](#BasicUsage) |
+|         error         |    `boolean`     |          false          |  Optional, indicating whether an input error occurs in the input box. | [Basic Usage](#BasicUsage) |
+|         size          | `'sm'\|''\|'lg'` |           ''            | Optional, size of the text box. The value can be 'lg','','sm' |     [Size](#Size)     |
+|       cssClass        |     `string`     |           ''            |  Optional, support to pass in the class name to the input box   |                       |
+|     showPassword      |    `boolean`     |          false          |  Optional, password input box   |   [Password Input](#PasswordInput)   |
+|       autoFocus       |    `boolean`     |          false          |  Optional, whether the input box is auto-focused   | [Basic Usage](#BasicUsage) |
+
+<style>
+  h4 {
+    font-weight: 700;
+    color: #575d6c;
+    font-size: 12px;
+    margin: 15px 0;
+  }
+</style>
-- 
Gitee


From db0b2c3a03d9d63cd04918960451345340627991 Mon Sep 17 00:00:00 2001
From: lwl <1181102955@qq.com>
Date: Fri, 3 Dec 2021 13:35:26 +0800
Subject: [PATCH 2/3] =?UTF-8?q?docs:=20=E4=BF=AE=E6=94=B9=E6=96=87?=
 =?UTF-8?q?=E6=A1=A3=E8=B7=B3=E8=BD=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../docs/en-US/components/input/index.md      | 16 +++++++-------
 .../docs/en-US/components/search/index.md     | 22 +++++++++----------
 2 files changed, 19 insertions(+), 19 deletions(-)

diff --git a/packages/devui-vue/docs/en-US/components/input/index.md b/packages/devui-vue/docs/en-US/components/input/index.md
index 2d1ca167..03b02a6e 100644
--- a/packages/devui-vue/docs/en-US/components/input/index.md
+++ b/packages/devui-vue/docs/en-US/components/input/index.md
@@ -83,16 +83,16 @@ export default defineComponent({
 
 |      Parameter        |       Type      |      Default     |     Description   |   Jump to Demo |
 | :-------------------: | :--------------: | :---------------------: | :--------------------------------------------: | :-------------------: |
-|          id           |     `string`     |           --            |   Optional, input ID  | [Basic Usage](#BasicUsage) |
-| v-model |     `string`     |           ''            |  Optional, bound value  |   [Password Input](#PasswordInput)   |
-|      placeholder      |     `string`     |           --            |  Optional, input placeholder    | [Basic Usage](#BasicUsage) |
+|          id           |     `string`     |           --            |   Optional, input ID  | [Basic Usage](#basic-usage) |
+| v-model |     `string`     |           ''            |  Optional, bound value  |[Password Input](#password-input)   |
+|      placeholder      |     `string`     |           --            |  Optional, input placeholder    | [Basic Usage](#basic-usage) |
 |       maxLength       |     `number`     | Number.MAX_SAFE_INTEGER |  Optional, the max-length of the input box |         |
-|       disabled        |    `boolean`     |          false          |  Optional, whether the input box is disabled  | [Basic Usage](#BasicUsage) |
-|         error         |    `boolean`     |          false          |  Optional, indicating whether an input error occurs in the input box. | [Basic Usage](#BasicUsage) |
-|         size          | `'sm'\|''\|'lg'` |           ''            | Optional, size of the text box. The value can be 'lg','','sm' |     [Size](#Size)     |
+|       disabled        |    `boolean`     |          false          |  Optional, whether the input box is disabled  | [Basic Usage](#basic-usage) |
+|         error         |    `boolean`     |          false          |  Optional, indicating whether an input error occurs in the input box. | [Basic Usage](#basic-usage) |
+|         size          | `'sm'\|''\|'lg'` |           ''            | Optional, size of the text box. The value can be 'lg','','sm' |     [Size](#size)     |
 |       cssClass        |     `string`     |           ''            |  Optional, support to pass in the class name to the input box   |                       |
-|     showPassword      |    `boolean`     |          false          |  Optional, password input box   |   [Password Input](#PasswordInput)   |
-|       autoFocus       |    `boolean`     |          false          |  Optional, whether the input box is auto-focused   | [Basic Usage](#BasicUsage) |
+|     showPassword      |    `boolean`     |          false          |  Optional, password input box   |[Password Input](#password-input)   |
+|       autoFocus       |    `boolean`     |          false          |  Optional, whether the input box is auto-focused   | [Basic Usage](#basic-usage) |
 
 <style>
   h4 {
diff --git a/packages/devui-vue/docs/en-US/components/search/index.md b/packages/devui-vue/docs/en-US/components/search/index.md
index 96422bc7..fa5941a6 100644
--- a/packages/devui-vue/docs/en-US/components/search/index.md
+++ b/packages/devui-vue/docs/en-US/components/search/index.md
@@ -104,22 +104,22 @@ export default defineComponent({
 
 |  Parameter  |   Type   |   Default    | Description        | Jump to Demo             | Global Config |
 | :---------: | :------: | :-------: | :----------------------- | --------------------------------- | --------- |
-|    size     | `'sm'\|''\|'lg'` |    ''     | Optional. Specifies the size of the search box. The options are lg, '', and sm. | [Basic Usage](#BasicUsage)             ||
-|    placeholder     | `string` |  --   | Optional. This parameter specifies the placeholder in the input box. | [Left Search Icon](#LeftSearchIcon)             ||
-|    maxLength     | `number` |  --   | Optional. Max-length of the text box. |  [VModel](#VModel)  ||
-|    delay     | `number` |  300   | Optional. Delay of debounceTime.  |  [Basic Usage](#BasicUsage)  ||
-|    disabled    | `boolean` | false | Optional. Indicating whether the text box is available. | [Basic Usage](#BasicUsage)             ||
-|    autoFocus    | `boolean` | false | Optional. Whether to enable autofocus for the text box. | [Basic Usage](#BasicUsage)             ||
-| isKeyupSearch | `boolean` |  false   | Optional. Indicates whether to support immediate searchFn after input. | [Basic Usage](#BasicUsage) ||
-| iconPosition | `string` |  'right'   | Optional. The options are'left' and'right'. | [Left Search Icon](#LeftSearchIcon) ||
-| noBorder | `boolean` |  false  | Optional. Specifies whether to display the border. | [No Border](#NoBorder) ||
-| cssClass | `string` |  ''  | Optional. The class name can be transferred to the text box. | [VModel](#VModel) ||
+|    size     | `'sm'\|''\|'lg'` |    ''     | Optional. Specifies the size of the search box. The options are lg, '', and sm. | [Basic Usage](#basic-usage)             ||
+|    placeholder     | `string` |  --   | Optional. This parameter specifies the placeholder in the input box. | [Left Search Icon](#left-search-icon)             ||
+|    maxLength     | `number` |  --   | Optional. Max-length of the text box. |  [VModel](#vmodel)  ||
+|    delay     | `number` |  300   | Optional. Delay of debounceTime.  |  [Basic Usage](#basic-usage)  ||
+|    disabled    | `boolean` | false | Optional. Indicating whether the text box is available. | [Basic Usage](#basic-usage)             ||
+|    autoFocus    | `boolean` | false | Optional. Whether to enable autofocus for the text box. | [Basic Usage](#basic-usage)             ||
+| isKeyupSearch | `boolean` |  false   | Optional. Indicates whether to support immediate searchFn after input. | [Basic Usage](#basic-usage) ||
+| iconPosition | `string` |  'right'   | Optional. The options are'left' and'right'. | [Left Search Icon](#left-search-icon) ||
+| noBorder | `boolean` |  false  | Optional. Specifies whether to display the border. | [No Border](#no-border) ||
+| cssClass | `string` |  ''  | Optional. The class name can be transferred to the text box. | [VModel](#vmodel) ||
 
 ### d-search event
 
 |    Event    |   Type  | Description            | Jump to Demo |
 | :---------: | :------: | :--------------------: | :---------: |
-| onSearch |	`string` | Callback function triggered by pressing Enter or clicking the search button to return the value entered in the text box. |	[Basic Usage](#BasicUsage) |
+| onSearch |	`string` | Callback function triggered by pressing Enter or clicking the search button to return the value entered in the text box. |	[Basic Usage](#basic-usage) |
 
 <style>
   h4 {
-- 
Gitee


From 06fbd524b84016f4a7b4b408d20265344cec2f0d Mon Sep 17 00:00:00 2001
From: lwl <1181102955@qq.com>
Date: Fri, 3 Dec 2021 14:07:14 +0800
Subject: [PATCH 3/3] =?UTF-8?q?docs:=20=E4=BF=AE=E6=94=B9=E6=96=87?=
 =?UTF-8?q?=E6=A1=A3style=E6=A0=B7=E5=BC=8F=E9=98=B2=E6=AD=A2=E6=B1=A1?=
 =?UTF-8?q?=E6=9F=93=E5=85=A8=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../devui-vue/docs/components/input/index.md  | 61 +++++++++---------
 .../devui-vue/docs/components/search/index.md | 14 ++---
 .../docs/en-US/components/input/index.md      | 62 ++++++++++---------
 .../docs/en-US/components/search/index.md     | 16 ++---
 4 files changed, 81 insertions(+), 72 deletions(-)

diff --git a/packages/devui-vue/docs/components/input/index.md b/packages/devui-vue/docs/components/input/index.md
index f6abd640..a4d0c285 100644
--- a/packages/devui-vue/docs/components/input/index.md
+++ b/packages/devui-vue/docs/components/input/index.md
@@ -12,17 +12,19 @@
 
 ```vue
 <template>
-  <h4>Default</h4>
-
-  <d-input placeholder="请输入" autoFocus id="textInput" class="dinput"></d-input>
-
-  <h4>Disabled</h4>
-
-  <d-input placeholder="请输入" :disabled="true" class="dinput"></d-input>
-
-  <h4>Error</h4>
-
-  <d-input placeholder="请输入" :error="true" class="dinput"></d-input>
+  <div class="devui-input-demo">
+    <h4>Default</h4>
+  
+    <d-input placeholder="请输入" autoFocus id="textInput" class="dinput"></d-input>
+  
+    <h4>Disabled</h4>
+  
+    <d-input placeholder="请输入" :disabled="true" class="dinput"></d-input>
+  
+    <h4>Error</h4>
+  
+    <d-input placeholder="请输入" :error="true" class="dinput"></d-input>
+  </div>
 </template>
 <style>
 .dinput {
@@ -39,17 +41,20 @@
 
 ```vue
 <template>
-  <h4>Small</h4>
-
-  <d-input size="sm" class="dinput" placeholder="请输入"></d-input>
-
-  <h4>Middle</h4>
-
-  <d-input class="dinput" placeholder="请输入"></d-input>
-
-  <h4>Large</h4>
-
-  <d-input size="lg" placeholder="请输入" class="dinput"></d-input>
+  <div class="devui-input-demo">
+
+    <h4>Small</h4>
+  
+    <d-input size="sm" class="dinput" placeholder="请输入"></d-input>
+  
+    <h4>Middle</h4>
+  
+    <d-input class="dinput" placeholder="请输入"></d-input>
+  
+    <h4>Large</h4>
+  
+    <d-input size="lg" placeholder="请输入" class="dinput"></d-input>
+  </div>
 </template>
 ```
 
@@ -95,10 +100,10 @@ export default defineComponent({
 |       autoFocus       |    `boolean`     |          false          |            可选，输入框是否自动对焦            | [基本用法](#基本用法) |
 
 <style>
-  h4 {
-    font-weight: 700;
-    color: #575d6c;
-    font-size: 12px;
-    margin: 15px 0;
-  }
+.devui-input-demo h4 {
+  font-weight: 700;
+  color: #575d6c;
+  font-size: 12px;
+  margin: 15px 0;
+}
 </style>
diff --git a/packages/devui-vue/docs/components/search/index.md b/packages/devui-vue/docs/components/search/index.md
index 56d2381f..b1127a8f 100644
--- a/packages/devui-vue/docs/components/search/index.md
+++ b/packages/devui-vue/docs/components/search/index.md
@@ -12,7 +12,7 @@
 
 ```vue
 <template>
-  <div>
+  <div class="dev-search-demo">
     <h4>Small</h4>
     <d-search size="sm" autoFocus style="width: 200px" :delay="1000"></d-search>
     <h4>Middle</h4>
@@ -122,10 +122,10 @@ export default defineComponent({
 | onSearch |	`string` |	回车或点击搜索按钮触发的回调函数，返回文本框输入的值 |	[基本用法](#基本用法) |
 
 <style>
-  h4 {
-    font-weight: 700;
-    color: #575d6c;
-    font-size: 12px;
-    margin: 15px 0;
-  }
+.dev-search-demo  h4 {
+  font-weight: 700;
+  color: #575d6c;
+  font-size: 12px;
+  margin: 15px 0;
+}
 </style>
\ No newline at end of file
diff --git a/packages/devui-vue/docs/en-US/components/input/index.md b/packages/devui-vue/docs/en-US/components/input/index.md
index 03b02a6e..bc52a640 100644
--- a/packages/devui-vue/docs/en-US/components/input/index.md
+++ b/packages/devui-vue/docs/en-US/components/input/index.md
@@ -12,17 +12,19 @@ When you want to manually enter text.
 
 ```vue
 <template>
-  <h4>Default</h4>
-
-  <d-input placeholder="Please Enter" autoFocus id="textInput" class="dinput"></d-input>
-
-  <h4>Disabled</h4>
-
-  <d-input placeholder="Please Enter" :disabled="true" class="dinput"></d-input>
-
-  <h4>Error</h4>
-
-  <d-input placeholder="Please Enter" :error="true" class="dinput"></d-input>
+  <div class="devui-input-demo">
+    <h4>Default</h4>
+  
+    <d-input placeholder="Please Enter" autoFocus id="textInput" class="dinput"></d-input>
+  
+    <h4>Disabled</h4>
+  
+    <d-input placeholder="Please Enter" :disabled="true" class="dinput"></d-input>
+  
+    <h4>Error</h4>
+  
+    <d-input placeholder="Please Enter" :error="true" class="dinput"></d-input>
+  </div>
 </template>
 <style>
 .dinput {
@@ -39,17 +41,19 @@ When you want to manually enter text.
 
 ```vue
 <template>
-  <h4>Small</h4>
-
-  <d-input size="sm" class="dinput" placeholder="Please Enter"></d-input>
-
-  <h4>Middle</h4>
-
-  <d-input class="dinput" placeholder="Please Enter"></d-input>
-
-  <h4>Large</h4>
-
-  <d-input size="lg" placeholder="Please Enter" class="dinput"></d-input>
+  <div class="devui-input-demo">
+    <h4>Small</h4>
+  
+    <d-input size="sm" class="dinput" placeholder="Please Enter"></d-input>
+  
+    <h4>Middle</h4>
+  
+    <d-input class="dinput" placeholder="Please Enter"></d-input>
+  
+    <h4>Large</h4>
+  
+    <d-input size="lg" placeholder="Please Enter" class="dinput"></d-input>
+  </div>
 </template>
 ```
 
@@ -95,10 +99,10 @@ export default defineComponent({
 |       autoFocus       |    `boolean`     |          false          |  Optional, whether the input box is auto-focused   | [Basic Usage](#basic-usage) |
 
 <style>
-  h4 {
-    font-weight: 700;
-    color: #575d6c;
-    font-size: 12px;
-    margin: 15px 0;
-  }
-</style>
+.devui-input-demo h4 {
+  font-weight: 700;
+  color: #575d6c;
+  font-size: 12px;
+  margin: 15px 0;
+}
+</style>
\ No newline at end of file
diff --git a/packages/devui-vue/docs/en-US/components/search/index.md b/packages/devui-vue/docs/en-US/components/search/index.md
index fa5941a6..7adbdb00 100644
--- a/packages/devui-vue/docs/en-US/components/search/index.md
+++ b/packages/devui-vue/docs/en-US/components/search/index.md
@@ -12,7 +12,7 @@ When you need to search for required data in a dataset, you can enter the conten
 
 ```vue
 <template>
-  <div>
+  <div class="devui-search-demo">
     <h4>Small</h4>
     <d-search size="sm" autoFocus placeholder="please enter" style="width: 200px" :delay="1000"></d-search>
     <h4>Middle</h4>
@@ -51,7 +51,7 @@ export default defineComponent({
 ```vue
 <template>
   <div>
-    <d-search iconPosition="left" placeholder="please enter" style="width: 200px" placeholder="请输入"></d-search>
+    <d-search iconPosition="left" placeholder="please enter" style="width: 200px"></d-search>
   </div>
 </template>
 ```
@@ -122,10 +122,10 @@ export default defineComponent({
 | onSearch |	`string` | Callback function triggered by pressing Enter or clicking the search button to return the value entered in the text box. |	[Basic Usage](#basic-usage) |
 
 <style>
-  h4 {
-    font-weight: 700;
-    color: #575d6c;
-    font-size: 12px;
-    margin: 15px 0;
-  }
+.devui-search-demo h4 {
+  font-weight: 700;
+  color: #575d6c;
+  font-size: 12px;
+  margin: 15px 0;
+}
 </style>
-- 
Gitee